/* =========================================================================
   I'M A DAD THEME — theme.css
   Author: The Free Website Guys
   ========================================================================= */

/* ---------------------------------------------------------------------
 * FONTS & BASE TOKENS
 * ------------------------------------------------------------------- */
:root {
	--font-sans: 'Inter', ui-sans-serif, system-ui, sans-serif;
	--font-display: 'Fraunces', 'Georgia', serif;
	--font-body: var(--font-sans);

	--radius: 0.5rem;
	--radius-lg: 1rem;
	--radius-xl: 1.5rem;
	--radius-2xl: 2rem;

	--color-primary-foreground: #f9f4ee;
	--color-accent-foreground: #fdf8f1;
	--color-button-text: var(--color-primary-foreground);

	--btn-radius: 999px;
	--btn-height: 3rem;
	--btn-padding: 0.85rem 1.6rem;
	--btn-font-size: 0.875rem;
	--btn-font-weight: 600;
	--btn-letter-spacing: 0;
	--btn-text-transform: none;
	--btn-icon-padding: 0.6rem;

	--header-height: 128px;
	--checkout-gap: 2.5rem;
	/* Lovable logo fills header row: h-16 (4rem) / lg:h-20 (5rem) */
	--logo-height: 4rem;
}
@media (min-width: 1024px) {
	:root { --logo-height: 5rem; }
}

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

html {
	scroll-behavior: smooth;
	width: 100%;
	max-width: 100%;
	overflow-x: clip;
}

body {
	margin: 0;
	width: 100%;
	max-width: 100%;
	overflow-x: clip;
	position: relative;
	background-color: var(--color-background);
	color: var(--color-foreground);
	font-family: var(--font-body);
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6, .font-display {
	font-family: var(--font-display);
	letter-spacing: -0.02em;
	font-weight: 500;
	margin: 0;
}

p { margin: 0; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button { font-family: inherit; cursor: pointer; }
ul { margin: 0; padding: 0; list-style: none; }
dl, dt, dd { margin: 0; padding: 0; }
/* Must beat author display:flex/block utilities */
[hidden] { display: none !important; }

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

.container-wide {
	margin-inline: auto;
	max-width: 80rem;
	width: 100%;
	padding-inline: 1.25rem;
	box-sizing: border-box;
	min-width: 0;
}
@media (min-width: 1024px) {
	.container-wide { padding-inline: 2.5rem; }
}

.site-main {
	width: 100%;
	max-width: 100%;
	overflow-x: hidden;
	min-width: 0;
}

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

/* COVER / FORCED-HEIGHT IMAGE EXCLUSIONS — never apply height:auto to these */
img:not(.cover-img):not(.site-logo-img):not(.theme-product-card-img):not(.theme-product-main-img):not(.theme-product-thumb-img):not(.theme-cart-thumb):not(.about-section__media-main-img):not(.about-section__media-small-img):not(.hero-section__video) {
	max-width: 100%;
	height: auto;
}
/* PDP main image must stay static + forced height from aspect-ratio (never height:auto). */
.single-product-main .theme-product-main-img {
	position: static !important;
	height: 100% !important;
	width: 100% !important;
	object-fit: cover;
}
.cover-img,
.theme-product-thumb-img,
.theme-cart-thumb {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.cover-img {
	position: absolute; inset: 0;
}

/* ---------------------------------------------------------------------
 * BUTTONS
 * ------------------------------------------------------------------- */
/* Lovable hero CTAs: px-6 py-3 text-sm font-semibold → ~46px tall */
.btn-hero-primary, .btn-hero-outline {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	border-radius: 999px;
	padding: 0.75rem 1.5rem;
	font-size: 0.875rem;
	line-height: 1.25rem; /* Tailwind text-sm leading */
	font-weight: 600;
	text-transform: none;
	transition: all 0.2s ease;
	white-space: nowrap;
	box-sizing: border-box;
	border: 1px solid transparent; /* keep primary/outline same outer height */
}
.btn-hero-primary {
	background-color: var(--color-rust);
	color: var(--color-accent-foreground);
	border-color: var(--color-rust);
}
.btn-hero-primary:hover { opacity: 0.9; }
.btn-hero-outline {
	background: transparent;
	border-color: color-mix(in srgb, var(--color-foreground) 30%, transparent);
	color: var(--color-foreground);
}
.btn-hero-outline:hover { background: color-mix(in srgb, var(--color-foreground) 10%, transparent); }
.btn-hero-outline--light {
	border-color: rgba(255,255,255,0.4); /* Lovable: border-white/40 */
	color: #fff;
}
.btn-hero-outline--light:hover { background: rgba(255,255,255,0.1); }
.btn-hero-primary svg, .btn-hero-outline svg { width: 1rem; height: 1rem; flex-shrink: 0; }
/* Navy CTAs — do NOT include hero buttons (keeps rust / outline). */
.single-product .single_add_to_cart_button,
.theme-btn-primary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	border-radius: 999px;
	padding: 0.75rem 1.5rem;
	font-size: 0.875rem;
	font-weight: 600;
	text-transform: none;
	background-color: var(--color-navy);
	color: var(--color-primary-foreground);
	border: none;
	transition: opacity 0.2s ease;
}
.theme-btn-primary:hover { opacity: 0.9; color: var(--color-primary-foreground); }

.theme-btn-outline {
	border: 1px solid var(--color-border);
	border-radius: 999px;
	padding: 0.6rem 1.25rem;
	font-size: 0.875rem;
	font-weight: 500;
	background: transparent;
	transition: background 0.2s ease;
}
.theme-btn-outline:hover { background: color-mix(in srgb, var(--color-foreground) 6%, transparent); }

/* ---------------------------------------------------------------------
 * ANIMATIONS
 * ------------------------------------------------------------------- */
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.animate-marquee {
	display: flex;
	flex-wrap: nowrap;
	white-space: nowrap;
	animation: marquee 32s linear infinite;
	will-change: transform;
}
.animate-marquee:hover { animation-play-state: paused; }

@keyframes theme-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes theme-slide-up { from { transform: translateX(100%); } to { transform: translateX(0); } }
.animate-fade-in { animation: theme-fade-in 0.3s ease; }
.animate-slide-up { animation: theme-slide-up 0.3s cubic-bezier(0.22,1,0.36,1); }

/* Reveal-on-load (hero) — matches framer-motion fadeUp: opacity+y(30) 0.7s ease */
.reveal-onload {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 0.7s cubic-bezier(0.25,0.4,0.25,1), transform 0.7s cubic-bezier(0.25,0.4,0.25,1);
	transition-delay: var(--reveal-delay, 0ms);
}
.on-load-stagger.is-visible .reveal-onload,
body.is-customizer .reveal-onload { opacity: 1; transform: translateY(0); }

/* Scroll reveal — matches homepage fadeUp: opacity + y(30), 0.7s, no blur */
.reveal-item {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 0.7s cubic-bezier(0.25,0.4,0.25,1), transform 0.7s cubic-bezier(0.25,0.4,0.25,1);
}
.reveal-item.is-visible,
body.is-customizer .reveal-item {
	opacity: 1;
	transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
	.reveal-item, .reveal-onload { transition-duration: 0.2s !important; transform: none !important; }
}

/* ---------------------------------------------------------------------
 * SITE HEADER
 * ------------------------------------------------------------------- */
.site-header {
	position: sticky; top: 0; inset-inline: 0; z-index: 40;
	width: 100%;
	max-width: 100%;
	/* clip (not hidden) so overflow-y stays visible — otherwise the mobile nav is clipped */
	overflow-x: clip;
	background: var(--color-background);
	transition: background-color 0.3s ease, backdrop-filter 0.3s ease, top 0.2s ease;
}
/* Mobile: fixed header (sticky breaks with overflow-x containment on ancestors). */
@media (max-width: 1023.98px) {
	:root {
		/* marquee (~2rem) + row (h-16 = 4rem) — matches hero height calc */
		--site-header-offset: 6rem;
	}
	.site-header {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		overflow-x: clip;
		overflow-y: visible;
	}
	body {
		padding-top: var(--site-header-offset);
	}
}
/* Offset sticky/fixed header when the WordPress admin bar is visible. */
body.admin-bar .site-header { top: 32px; }
@media screen and (max-width: 782px) {
	body.admin-bar .site-header { top: 46px; }
}
@media (max-width: 1023.98px) {
	body.admin-bar {
		padding-top: calc(var(--site-header-offset) + 32px);
	}
}
@media screen and (max-width: 782px) {
	body.admin-bar {
		padding-top: calc(var(--site-header-offset) + 46px);
	}
}
.site-header.is-scrolled {
	background: color-mix(in srgb, var(--color-background) 90%, transparent);
	backdrop-filter: blur(8px);
	border-bottom: 1px solid var(--color-border);
}
.site-header__marquee {
	background: var(--color-navy);
	color: #fff;
	width: 100%;
	max-width: 100%;
	overflow: hidden;
	border-bottom: 1px solid rgba(255,255,255,0.1);
	contain: paint;
}
.site-header__marquee-track {
	display: flex;
	width: max-content;
	max-width: none;
	padding-block: 0.5rem;
	font-size: 0.75rem;
	letter-spacing: 0.25em;
	text-transform: uppercase;
	font-weight: 500;
}
.site-header__marquee-group { display: flex; flex-shrink: 0; align-items: center; }
.site-header__marquee-item { display: flex; align-items: center; padding-inline: 1.5rem; }
.site-header__marquee-dot { margin-left: 1.5rem; color: var(--color-rust); }

.site-header__row {
	margin-inline: auto; max-width: 80rem; padding-inline: 1.25rem;
	height: 4rem; display: flex; align-items: center; justify-content: space-between; gap: 0.75rem;
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
}
@media (min-width: 1024px) { .site-header__row { padding-inline: 2.5rem; height: 5rem; } }

.site-header__brand {
	display: flex; align-items: stretch; height: 100%; gap: 0.75rem;
	min-width: 0;
}
@media (max-width: 1023.98px) {
	.site-header__brand {
		flex: 1 1 auto;
		max-width: calc(100% - 5.5rem);
	}
}
/* Default matches Lovable h-full (64px / lg:80px). Customizer can override via --logo-height. */
.site-logo-img {
	height: var(--logo-height, 100%);
	max-height: 100%;
	width: auto !important;
	max-width: 100%;
	display: block;
	object-fit: contain;
	align-self: center;
}
.site-logo-text { display: block; align-self: center; line-height: 1.1; font-family: var(--font-display); font-size: 1.35rem; font-weight: 500; }

.site-header__nav { display: none; margin-left: auto; margin-right: 1.5rem; }
@media (min-width: 1024px) { .site-header__nav { display: flex; align-items: center; gap: 2rem; } }
.theme-nav-list { display: flex; align-items: center; gap: 2rem; margin: 0; padding: 0; }
.theme-nav-list li { list-style: none; }
.theme-nav-list a, .theme-nav-link {
	position: relative; font-size: 0.875rem; font-weight: 500; color: var(--color-foreground);
	transition: color 0.2s ease;
}
.theme-nav-list a:hover, .theme-nav-link:hover { color: var(--color-rust); }
.theme-nav-list a::after, .theme-nav-link::after {
	content: ''; position: absolute; bottom: -4px; left: 0; height: 1px; width: 0;
	background: var(--color-rust); transition: width 0.3s ease;
}
.theme-nav-list a:hover::after, .theme-nav-link:hover::after { width: 100%; }

.site-header__cart-btn {
	position: relative; padding: 0.5rem; border-radius: 999px; background: transparent; border: none; color: var(--color-foreground);
	transition: background 0.2s ease;
}
.site-header__cart-btn:hover { background: color-mix(in srgb, var(--color-foreground) 10%, transparent); }
.theme-cart-count {
	position: absolute; top: -4px; right: -4px; width: 1.25rem; height: 1.25rem; border-radius: 999px;
	background: var(--color-rust); color: var(--color-accent-foreground); font-size: 11px; font-weight: 600;
	display: flex; align-items: center; justify-content: center; transition: transform 0.2s ease;
}
.theme-cart-count:empty { display: none; }

.site-header__menu-toggle {
	display: flex; align-items: center; justify-content: center; padding: 0.5rem;
	border: none; background: transparent; color: var(--color-foreground);
	border-radius: 0.375rem; transition: background-color 0.2s ease, transform 0.2s ease;
	flex-shrink: 0;
}
.site-header__menu-toggle:hover { background: color-mix(in srgb, var(--color-foreground) 8%, transparent); }
.site-header__menu-toggle:active { transform: scale(0.94); }
.site-header__menu-toggle-icons {
	position: relative;
	display: block;
	width: 22px;
	height: 22px;
}
.site-header__menu-toggle .icon-menu,
.site-header__menu-toggle .icon-close {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	transition:
		opacity 0.28s cubic-bezier(0.22, 1, 0.36, 1),
		transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}
.site-header__menu-toggle .icon-menu {
	opacity: 1;
	transform: rotate(0deg) scale(1);
}
.site-header__menu-toggle .icon-close {
	opacity: 0;
	transform: rotate(-90deg) scale(0.65);
}
.site-header__menu-toggle[aria-expanded="true"] .icon-menu {
	opacity: 0;
	transform: rotate(90deg) scale(0.65);
}
.site-header__menu-toggle[aria-expanded="true"] .icon-close {
	opacity: 1;
	transform: rotate(0deg) scale(1);
}
@media (min-width: 1024px) { .site-header__menu-toggle { display: none; } }

.site-header__mobile-nav {
	display: grid;
	grid-template-rows: 0fr;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	background: var(--color-background);
	border-top: 1px solid transparent;
	transition:
		grid-template-rows 0.4s cubic-bezier(0.22, 1, 0.36, 1),
		opacity 0.28s ease,
		visibility 0.28s ease,
		border-color 0.28s ease;
}
.site-header__mobile-nav.is-open {
	grid-template-rows: 1fr;
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	border-top-color: var(--color-border);
}
.site-header__mobile-nav-inner {
	overflow: hidden;
	min-height: 0;
}
.site-header__mobile-nav nav {
	padding: 0.25rem 1.5rem 0.85rem;
}
.site-header__mobile-nav .theme-nav-list {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0.2rem;
	margin: 0;
	padding: 0;
}
.site-header__mobile-nav .theme-nav-list > li {
	list-style: none;
}
.site-header__mobile-nav .theme-nav-list a,
.site-header__mobile-nav .theme-nav-list .theme-nav-link {
	display: block;
	padding: 0.8rem 0.85rem;
	border-radius: 0.5rem;
	font-size: 0.9375rem;
	font-weight: 500;
	opacity: 0;
	transform: translateX(-14px);
	transition:
		opacity 0.18s ease,
		transform 0.18s ease,
		background-color 0.2s ease,
		color 0.2s ease;
}
.site-header__mobile-nav .theme-nav-list a::after,
.site-header__mobile-nav .theme-nav-list .theme-nav-link::after {
	display: none;
}
.site-header__mobile-nav.is-open .theme-nav-list a,
.site-header__mobile-nav.is-open .theme-nav-list .theme-nav-link {
	opacity: 1;
	transform: translateX(0);
	transition-duration: 0.4s;
	transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}
.site-header__mobile-nav.is-open .theme-nav-list > li:nth-child(1) > a,
.site-header__mobile-nav.is-open .theme-nav-list > a:nth-child(1) { transition-delay: 0.05s; }
.site-header__mobile-nav.is-open .theme-nav-list > li:nth-child(2) > a,
.site-header__mobile-nav.is-open .theme-nav-list > a:nth-child(2) { transition-delay: 0.09s; }
.site-header__mobile-nav.is-open .theme-nav-list > li:nth-child(3) > a,
.site-header__mobile-nav.is-open .theme-nav-list > a:nth-child(3) { transition-delay: 0.13s; }
.site-header__mobile-nav.is-open .theme-nav-list > li:nth-child(4) > a,
.site-header__mobile-nav.is-open .theme-nav-list > a:nth-child(4) { transition-delay: 0.17s; }
.site-header__mobile-nav.is-open .theme-nav-list > li:nth-child(5) > a,
.site-header__mobile-nav.is-open .theme-nav-list > a:nth-child(5) { transition-delay: 0.21s; }
.site-header__mobile-nav.is-open .theme-nav-list > li:nth-child(6) > a,
.site-header__mobile-nav.is-open .theme-nav-list > a:nth-child(6) { transition-delay: 0.25s; }
.site-header__mobile-nav.is-open .theme-nav-list > li:nth-child(7) > a,
.site-header__mobile-nav.is-open .theme-nav-list > a:nth-child(7) { transition-delay: 0.29s; }
.site-header__mobile-nav.is-open .theme-nav-list > li:nth-child(n+8) > a,
.site-header__mobile-nav.is-open .theme-nav-list > a:nth-child(n+8) { transition-delay: 0.33s; }
.site-header__mobile-nav .theme-nav-list a:hover,
.site-header__mobile-nav .theme-nav-list .theme-nav-link:hover {
	background: var(--color-muted);
	color: var(--color-foreground);
}
@media (min-width: 1024px) { .site-header__mobile-nav { display: none !important; } }
@media (prefers-reduced-motion: reduce) {
	.site-header__mobile-nav,
	.site-header__mobile-nav .theme-nav-list a,
	.site-header__mobile-nav .theme-nav-list .theme-nav-link,
	.site-header__menu-toggle .icon-menu,
	.site-header__menu-toggle .icon-close {
		transition-duration: 0.01ms !important;
		transition-delay: 0ms !important;
	}
	.site-header__menu-toggle .icon-menu,
	.site-header__menu-toggle .icon-close,
	.site-header__mobile-nav .theme-nav-list a,
	.site-header__mobile-nav .theme-nav-list .theme-nav-link {
		transform: none !important;
	}
}

/* ---------------------------------------------------------------------
 * HOME HERO — pixel-matched to Lovable index.tsx
 * section: px-3 sm:px-6 pt-2
 * frame:   rounded-[2rem] h-[calc(100svh-4rem-2rem-0.75rem)] lg:…-5rem…
 * inner:   max-w-7xl h-full px-5 lg:px-10
 * grid:    grid-cols-1 lg:grid-cols-2 h-full
 * copy:    flex flex-col justify-center py-14
 * ------------------------------------------------------------------- */
.hero-section {
	position: relative;
	width: 100%;
	padding-inline: 0.75rem; /* px-3 */
	padding-top: 0.5rem;     /* pt-2 */
	padding-bottom: 0;
}
@media (min-width: 640px) {
	.hero-section { padding-inline: 1.5rem; } /* sm:px-6 */
}

/* Header row (4/5rem) + marquee (~2rem) + inset (0.75rem) — same tokens as Lovable */
.hero-section__frame {
	position: relative;
	width: 100%;
	border-radius: 2rem; /* rounded-[2rem] */
	overflow: hidden;
	background: var(--color-navy);
	height: calc(100svh - 4rem - 2rem - 0.75rem);
}
@media (min-width: 1024px) {
	.hero-section__frame { height: calc(100svh - 5rem - 2rem - 0.75rem); }
}
/* Keep first-viewport fit when WP admin bar is visible in preview */
body.admin-bar .hero-section__frame { height: calc(100svh - 4rem - 2rem - 0.75rem - 32px); }
@media (min-width: 1024px) {
	body.admin-bar .hero-section__frame { height: calc(100svh - 5rem - 2rem - 0.75rem - 32px); }
}
@media screen and (max-width: 782px) {
	body.admin-bar .hero-section__frame { height: calc(100svh - 4rem - 2rem - 0.75rem - 46px); }
}

.hero-section__video {
	position: absolute; inset: 0; width: 100%; height: 100%;
	object-fit: cover; opacity: 0.8;
}
.hero-section__gradient {
	position: absolute; inset: 0;
	/* from-brand-navy via-brand-navy/85 to-brand-navy/30 */
	background: linear-gradient(
		to right,
		var(--color-navy),
		color-mix(in srgb, var(--color-navy) 85%, transparent),
		color-mix(in srgb, var(--color-navy) 30%, transparent)
	);
}

.hero-section__content {
	position: relative;
	z-index: 10;
	height: 100%;
}
/* mx-auto max-w-7xl h-full px-5 lg:px-10 */
.hero-section__content-inner {
	margin-inline: auto;
	max-width: 80rem;
	height: 100%;
	padding-inline: 1.25rem; /* px-5 */
}
@media (min-width: 1024px) {
	.hero-section__content-inner { padding-inline: 2.5rem; } /* lg:px-10 */
}

/* grid-cols-1 lg:grid-cols-2 h-full — copy sits in left half */
.hero-section__grid {
	display: grid;
	grid-template-columns: 1fr;
	height: 100%;
}
@media (min-width: 1024px) {
	.hero-section__grid { grid-template-columns: 1fr 1fr; }
}

/* flex flex-col justify-center py-14 */
.hero-section__copy {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-block: 3.5rem; /* py-14 */
	min-width: 0;
}

/* text-xs tracking-[0.25em] uppercase text-accent font-medium */
.hero-section__eyebrow {
	font-size: 0.75rem;
	letter-spacing: 0.25em;
	text-transform: uppercase;
	color: var(--color-rust);
	font-weight: 500;
}

/* font-display text-5xl/sm:text-6xl/lg:text-7xl leading-[1.02] text-white mt-5 */
.hero-section__title {
	font-family: var(--font-display);
	font-size: 3rem;          /* text-5xl */
	line-height: 1.02;
	letter-spacing: -0.02em;
	color: #fff;
	margin-top: 1.25rem;      /* mt-5 */
	font-weight: 500;
}
@media (min-width: 640px) { .hero-section__title { font-size: 3.75rem; } } /* sm:text-6xl */
@media (min-width: 1024px) { .hero-section__title { font-size: 4.5rem; } } /* lg:text-7xl */
.hero-section__title .text-accent { color: var(--color-rust); }

/* mt-6 max-w-md text-base sm:text-lg text-white/85 leading-relaxed */
.hero-section__subtitle {
	margin-top: 1.5rem;       /* mt-6 */
	max-width: 28rem;         /* max-w-md */
	font-size: 1rem;          /* text-base */
	color: rgba(255, 255, 255, 0.85);
	line-height: 1.625;       /* leading-relaxed */
}
@media (min-width: 640px) { .hero-section__subtitle { font-size: 1.125rem; } } /* sm:text-lg */

/* mt-8 flex flex-wrap gap-3 */
.hero-section__ctas {
	margin-top: 2rem;         /* mt-8 */
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;             /* gap-3 */
}

/* ---------------------------------------------------------------------
 * STATS STRIP
 * ------------------------------------------------------------------- */
.stats-section { padding-block: 3.5rem; }
.stats-section__grid {
	display: grid; grid-template-columns: minmax(0, 1fr); gap: 1px;
	background: color-mix(in srgb, var(--color-border) 60%, transparent);
	border-radius: 1.25rem; /* Lovable rounded-3xl ≈ 20px */
	overflow: hidden; border: 1px solid color-mix(in srgb, var(--color-border) 60%, transparent);
	box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}
@media (min-width: 768px) { .stats-section__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.stats-section__item { background: var(--color-card); padding: 2rem; transition: background-color 0.3s ease; }
@media (min-width: 768px) { .stats-section__item { padding: 2.5rem; } }
.stats-section__item:hover { background: var(--color-background); }
.stats-section__item-head { display: flex; align-items: baseline; justify-content: space-between; }
.stats-section__num { font-family: var(--font-display); font-size: 1.5rem; color: color-mix(in srgb, var(--color-rust) 80%, transparent); }
.stats-section__rule { height: 1px; flex: 1; margin-left: 1rem; background: var(--color-border); transition: background-color 0.3s ease; }
.stats-section__item:hover .stats-section__rule { background: color-mix(in srgb, var(--color-rust) 40%, transparent); }
.stats-section__title { margin-top: 1.5rem; font-family: var(--font-display); font-size: 1.5rem; font-weight: 500; }
@media (min-width: 768px) { .stats-section__title { font-size: 1.65rem; } }
.stats-section__desc { margin-top: 0.75rem; font-size: 0.9375rem; color: color-mix(in srgb, var(--color-foreground) 70%, transparent); line-height: 1.6; }

/* ---------------------------------------------------------------------
 * ABOUT SECTION — Lovable: container-wide py-24 md:py-32 > grid-cols-12
 * ------------------------------------------------------------------- */
.about-section {
	background: var(--color-sand);
	overflow: hidden;
	width: 100%;
	max-width: 100%;
}
/* Padding only on pad wrapper — never merge with grid on same node */
.about-section__pad { padding-block: 6rem; } /* py-24 */
@media (min-width: 768px) { .about-section__pad { padding-block: 8rem; } } /* md:py-32 */
.about-section__grid {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: 1.5rem; /* gap-6 */
	align-items: center;
}
@media (min-width: 768px) { .about-section__grid { gap: 2.5rem; } } /* md:gap-10 */
.about-section__media { position: relative; grid-column: span 12; min-width: 0; }
@media (min-width: 768px) { .about-section__media { grid-column: span 6; } }
@media (min-width: 1024px) { .about-section__media { grid-column: span 5; } }
.about-section__media-main {
	position: relative;
	width: 100%;
	max-width: 100%;
	aspect-ratio: 4 / 5;
	border-radius: 2rem;
	overflow: hidden;
	box-shadow: 0 20px 40px -12px rgba(20,30,60,0.25);
}
/* Match Lovable w-full h-full object-cover (constrain to aspect box, not intrinsic 724×1084) */
.about-section__media-main-img,
.about-section__media-small-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	max-width: none;
}
.about-section__media-small {
	display: none; position: absolute; bottom: -2.5rem; right: -1.5rem; width: 10rem; aspect-ratio: 1/1;
	border-radius: 1.25rem; overflow: hidden; box-shadow: 0 20px 40px -12px rgba(20,30,60,0.25); border: 4px solid var(--color-sand);
}
@media (min-width: 768px) { .about-section__media-small { display: block; } }
@media (min-width: 1024px) { .about-section__media-small { right: -3rem; width: 13rem; } }
.about-section__ellipsis {
	position: absolute; top: -2.5rem; left: -1rem; font-family: var(--font-display); font-size: 9rem; line-height: 1;
	color: color-mix(in srgb, var(--color-rust) 20%, transparent); user-select: none;
	pointer-events: none;
}
.about-section__copy { grid-column: 1 / -1; min-width: 0; } /* col-span-12 */
@media (min-width: 768px) { .about-section__copy { grid-column: span 6; } } /* md:col-span-6 */
/* Lovable lg:col-span-6 lg:col-start-7 — must set start+span together (start alone = 1 col) */
@media (min-width: 1024px) { .about-section__copy { grid-column: 7 / span 6; } }
.about-section__eyebrow-row { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1.25rem; }
.about-section__rule { height: 1px; width: 2.5rem; background: var(--color-rust); }
.about-section__eyebrow { font-size: 0.75rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--color-rust); font-weight: 600; }
.about-section__title { font-size: 2.25rem; line-height: 1.02; letter-spacing: -0.02em; font-weight: 500; }
@media (min-width: 768px) { .about-section__title { font-size: 3rem; } }
@media (min-width: 1024px) { .about-section__title { font-size: 3.75rem; } }
.about-section__title-accent { font-style: italic; color: var(--color-rust); }
.about-section__body { margin-top: 2rem; font-size: 1.125rem; color: color-mix(in srgb, var(--color-foreground) 85%, transparent); line-height: 1.7; }
.about-section__quote {
	margin: 2rem 0 0; border-left: 2px solid var(--color-rust); padding-left: 1.25rem;
	font-family: var(--font-display); font-size: 1.25rem; line-height: 1.4; font-style: normal;
}
@media (min-width: 768px) { .about-section__quote { font-size: 1.5rem; } }
.about-section__quote-attr { display: block; margin-top: 0.5rem; font-size: 0.875rem; font-style: normal; text-transform: uppercase; letter-spacing: 0.25em; color: color-mix(in srgb, var(--color-foreground) 50%, transparent); font-family: var(--font-sans); }
.about-section__traits { margin-top: 2.5rem; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; max-width: 28rem; }
.about-section__trait-n { font-family: var(--font-display); font-size: 1.5rem; color: var(--color-rust); }
.about-section__trait-l { margin-top: 0.25rem; font-size: 0.75rem; letter-spacing: 0.2em; text-transform: uppercase; color: color-mix(in srgb, var(--color-foreground) 60%, transparent); }

/* ---------------------------------------------------------------------
 * SHARED SECTION HEADING SCALES (per-section, not one global clamp)
 * ------------------------------------------------------------------- */
.shop-heading, .services-section__title, .partners-section__title,
.projects-section__title, .tiktok-section__title, .podcast-section__title,
.founder-section__name, .faq-section__title, .contact-section__title {
	font-size: 2.25rem; font-weight: 500; margin-top: 0.75rem;
}
@media (min-width: 768px) { .shop-heading, .services-section__title, .partners-section__title,
	.projects-section__title, .tiktok-section__title, .podcast-section__title,
	.founder-section__name, .faq-section__title, .contact-section__title { font-size: 3rem; } }

.cta-band__title { margin-top: 1.25rem; font-size: 2.25rem; line-height: 1.02; letter-spacing: -0.02em; font-weight: 500; color: #fff; }
@media (min-width: 768px) { .cta-band__title { font-size: 3.75rem; } }
@media (min-width: 1024px) { .cta-band__title { font-size: 4.5rem; } }
.cta-band__title-accent { font-style: italic; color: var(--color-rust); }

/* ---------------------------------------------------------------------
 * SHOP SECTION + PRODUCT GRID/CARDS
 * ------------------------------------------------------------------- */
.shop-section, .services-section, .partners-section, .projects-section,
.tiktok-section, .podcast-section, .founder-section, .faq-section, .contact-section {
	padding-block: 5rem;
}
.services-section, .tiktok-section { background: var(--color-sand); }
.founder-section { background: var(--color-navy); color: #fff; }

.shop-section__head, .services-section__head, .partners-section__head,
.projects-section__head, .tiktok-section__head, .podcast-section__head,
.faq-section__head { text-align: center; margin-bottom: 3rem; }
.shop-section__eyebrow, .services-section__eyebrow, .partners-section__eyebrow,
.projects-section__eyebrow, .tiktok-section__eyebrow, .podcast-section__eyebrow,
.founder-section__eyebrow, .faq-section__eyebrow, .contact-section__eyebrow {
	font-size: 0.75rem; letter-spacing: 0.25em; text-transform: uppercase; color: var(--color-rust); font-weight: 600;
}
.shop-section__subtitle,
.partners-section__subtitle, .tiktok-section__subtitle, .podcast-section__subtitle {
	margin-top: 0.75rem; /* mt-3 */
	margin-inline: auto;
	color: color-mix(in srgb, var(--color-foreground) 70%, transparent);
}
.shop-section__subtitle { max-width: 36rem; } /* Lovable max-w-xl */
.partners-section__subtitle,
.tiktok-section__subtitle,
.podcast-section__subtitle { max-width: 42rem; } /* Lovable max-w-2xl */

.theme-product-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.5rem;
	align-items: stretch;
}
@media (min-width: 640px) { .theme-product-grid--shop { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .theme-product-grid--shop { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.theme-product-grid--related { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
@media (min-width: 1024px) { .theme-product-grid--related { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem; } }

.theme-product-card-wrap { height: 100%; display: flex; }
.theme-product-card {
	position: relative;
	background: var(--color-card);
	border: 1px solid var(--color-border);
	height: 100%;
	width: 100%;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border-radius: 1rem;
	transition: box-shadow 0.3s ease, transform 0.25s cubic-bezier(0.3,0.7,0.4,1);
}
a.theme-product-card:hover { transform: translateY(-4px); box-shadow: 0 20px 40px -12px rgba(20,30,60,0.18); }
.theme-product-card--coming-soon { cursor: default; }
.theme-product-card__badge { position: absolute; top: 0.75rem; left: 0.75rem; z-index: 10; }
.theme-badge {
	display: inline-flex; padding: 0.25rem 0.65rem; font-size: 10px; letter-spacing: 0.15em; text-transform: uppercase;
	border-radius: 999px;
}
.theme-badge--accent { background: var(--color-rust); color: var(--color-accent-foreground); }
.theme-badge--muted {
	background: color-mix(in srgb, var(--color-background) 90%, transparent);
	color: color-mix(in srgb, var(--color-foreground) 60%, transparent);
	border: 1px solid var(--color-border);
}
.theme-product-card__image-wrapper {
	position: relative; aspect-ratio: 1/1; overflow: hidden;
	background: var(--color-muted);
}
.theme-product-card-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s cubic-bezier(0.25,0.4,0.25,1); }
.theme-product-card:hover .theme-product-card-img:not(.is-faded) { transform: scale(1.05); }
.theme-product-card-img.is-faded { opacity: 0.7; }
.theme-product-card__info { flex: 1; display: flex; flex-direction: column; padding: 1.25rem; border-top: 1px solid var(--color-border); }
.theme-product-card__row {
	display: flex; align-items: flex-start; justify-content: space-between; gap: 0.75rem;
}
.theme-product-card__title {
	font-family: var(--font-display); font-size: 1.125rem; line-height: 1.35; font-weight: 500; min-width: 0;
}
.theme-product-card__price { font-size: 0.875rem; font-weight: 600; white-space: nowrap; padding-top: 0.25rem; flex-shrink: 0; }
.shop-empty-text { text-align: center; padding: 3rem 0; color: color-mix(in srgb, var(--color-foreground) 60%, transparent); }

/* ---------------------------------------------------------------------
 * SERVICES SECTION
 * ------------------------------------------------------------------- */
.services-section__grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 768px) { .services-section__grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
.services-section__card {
	position: relative; overflow: hidden; border-radius: 1rem; background: var(--color-card);
	border: 1px solid var(--color-border); padding: 1.75rem; display: flex; gap: 1.25rem;
	box-shadow: 0 1px 2px rgba(0,0,0,0.05);
	transition: box-shadow 0.5s ease, border-color 0.5s ease, transform 0.25s cubic-bezier(0.3,0.7,0.4,1);
}
.services-section__card:hover { box-shadow: 0 20px 40px -12px rgba(20,30,60,0.18); border-color: color-mix(in srgb, var(--color-rust) 40%, transparent); transform: translateY(-6px); }
.services-section__card-num {
	position: absolute; right: -0.5rem; bottom: -1.5rem; font-family: var(--font-display); font-size: 7rem; line-height: 1;
	color: color-mix(in srgb, var(--color-rust) 5%, transparent); transition: color 0.5s ease; user-select: none;
}
.services-section__card:hover .services-section__card-num { color: color-mix(in srgb, var(--color-rust) 10%, transparent); }
.services-section__card-icon {
	position: relative; width: 3rem; height: 3rem; border-radius: 999px; background: var(--color-navy); color: #fff;
	display: flex; align-items: center; justify-content: center; flex-shrink: 0; box-shadow: 0 4px 10px rgba(0,0,0,0.15);
	transition: transform 0.3s ease; z-index: 1;
}
.services-section__card-icon svg { position: relative; z-index: 2; }
.services-section__card-icon-glow {
	position: absolute; inset: 0; border-radius: 999px; background: color-mix(in srgb, var(--color-rust) 40%, transparent);
	opacity: 0; filter: blur(8px); transition: opacity 0.5s ease; z-index: 0;
}
.services-section__card:hover .services-section__card-icon-glow { opacity: 1; }
.services-section__card:hover .services-section__card-icon { transform: rotate(-8deg) scale(1.08); }
.services-section__card-body { position: relative; z-index: 1; }
.services-section__card-title { font-family: var(--font-display); font-size: 1.5rem; margin-bottom: 0.5rem; transition: color 0.3s ease; }
.services-section__card:hover .services-section__card-title { color: var(--color-rust); }
.services-section__card-desc { color: color-mix(in srgb, var(--color-foreground) 75%, transparent); line-height: 1.6; }
.services-section__learn {
	margin-top: 1rem; display: inline-flex; align-items: center; gap: 0.25rem;
	font-size: 0.75rem; letter-spacing: 0.2em; text-transform: uppercase; font-weight: 600; color: var(--color-rust);
	opacity: 0; transform: translateX(-4px); transition: opacity 0.5s ease, transform 0.5s ease;
}
.services-section__card:hover .services-section__learn { opacity: 1; transform: translateX(0); }
.services-section__bar {
	position: absolute; left: 0; bottom: 0; height: 2px; width: 0; background: var(--color-rust);
	transition: width 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}
.services-section__card:hover .services-section__bar { width: 100%; }

/* ---------------------------------------------------------------------
 * PARTNERS SECTION
 * ------------------------------------------------------------------- */
.partners-section__grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 640px) { .partners-section__grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (min-width: 1024px) { .partners-section__grid { grid-template-columns: repeat(3, minmax(0,1fr)); } }
.partners-section__card {
	display: flex; flex-direction: column; align-items: center; text-align: center;
	border-radius: 1.25rem; /* Lovable rounded-3xl ≈ 20px */
	background: var(--color-card); border: 1px solid color-mix(in srgb, var(--color-border) 60%, transparent);
	padding: 1.75rem; transition: border-color 0.5s ease, transform 0.5s ease, box-shadow 0.5s ease;
}
.partners-section__card:hover { border-color: color-mix(in srgb, var(--color-rust) 40%, transparent); transform: translateY(-4px); box-shadow: 0 20px 40px -12px rgba(20,30,60,0.18); }
.partners-section__card-initials {
	width: 5rem; height: 5rem; border-radius: 999px; background: var(--color-navy); color: #fff;
	display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-size: 1.5rem;
	box-shadow: 0 4px 10px rgba(0,0,0,0.15);
}
.partners-section__card-name { margin-top: 1.25rem; font-family: var(--font-display); font-size: 1.25rem; }
.partners-section__card-blurb { margin-top: 0.5rem; font-size: 0.875rem; color: color-mix(in srgb, var(--color-foreground) 70%, transparent); line-height: 1.6; }
.partners-section__card-visit {
	margin-top: 1.25rem; display: inline-flex; align-items: center; gap: 0.375rem; font-size: 0.75rem;
	letter-spacing: 0.2em; text-transform: uppercase; font-weight: 600; color: var(--color-rust); opacity: 0.8;
}
.partners-section__card:hover .partners-section__card-visit { opacity: 1; }
.partners-section__footer-text { margin-top: 2.5rem; text-align: center; font-size: 0.75rem; color: color-mix(in srgb, var(--color-foreground) 50%, transparent); }
.partners-section__footer-link { text-decoration: underline; }
.partners-section__footer-link:hover { color: var(--color-rust); }

/* ---------------------------------------------------------------------
 * PROJECTS SECTION
 * ------------------------------------------------------------------- */
.projects-section__grid { display: grid; grid-template-columns: 1fr; gap: 1.25rem; }
@media (min-width: 640px) { .projects-section__grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (min-width: 1024px) { .projects-section__grid { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (min-width: 1280px) { .projects-section__grid { grid-template-columns: repeat(5, minmax(0,1fr)); } }
.projects-section__card {
	position: relative; display: block; overflow: hidden; border-radius: 1.25rem;
	background: var(--color-card); border: 1px solid color-mix(in srgb, var(--color-border) 60%, transparent);
	transition: border-color 0.5s ease, transform 0.5s ease, box-shadow 0.5s ease;
}
.projects-section__card:hover { border-color: color-mix(in srgb, var(--color-rust) 40%, transparent); transform: translateY(-4px); box-shadow: 0 25px 50px -12px rgba(0,0,0,0.35); }
.projects-section__card-media { position: relative; aspect-ratio: 4/5; overflow: hidden; }
.projects-section__card-media img { transition: transform 0.7s ease; }
.projects-section__card:hover .projects-section__card-media img { transform: scale(1.05); }
.projects-section__card-gradient { position: absolute; inset: 0; background: linear-gradient(to top, var(--color-navy), color-mix(in srgb, var(--color-navy) 40%, transparent), transparent); }
.projects-section__card-top { position: absolute; top: 1rem; left: 1rem; display: flex; align-items: center; gap: 0.5rem; }
.projects-section__card-icon {
	display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem;
	border-radius: 999px; background: rgba(255,255,255,0.15); backdrop-filter: blur(6px); color: #fff; border: 1px solid rgba(255,255,255,0.2);
}
.projects-section__card-tag {
	font-size: 10px; letter-spacing: 0.25em; text-transform: uppercase; color: rgba(255,255,255,0.9); font-weight: 600;
	padding: 0.25rem 0.65rem; border-radius: 999px; background: rgba(255,255,255,0.1); backdrop-filter: blur(6px); border: 1px solid rgba(255,255,255,0.2);
}
.projects-section__card-bottom { position: absolute; inset-inline: 0; bottom: 0; padding: 1.25rem; }
.projects-section__card-title { font-family: var(--font-display); font-size: 1.5rem; color: #fff; line-height: 1.2; }
.projects-section__card-desc {
	margin-top: 0.5rem; font-size: 0.875rem; color: rgba(255,255,255,0.75); line-height: 1.6;
	display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.projects-section__card-explore {
	margin-top: 1rem; display: flex; align-items: center; gap: 0.5rem; font-size: 0.75rem; letter-spacing: 0.2em;
	text-transform: uppercase; font-weight: 600; color: var(--color-rust); opacity: 0; transform: translateY(-4px);
	transition: opacity 0.3s ease, transform 0.3s ease;
}
.projects-section__card:hover .projects-section__card-explore { opacity: 1; transform: translateY(0); }

/* ---------------------------------------------------------------------
 * TIKTOK SECTION
 * ------------------------------------------------------------------- */
.tiktok-section__grid { display: grid; grid-template-columns: 1fr; gap: 1.25rem; }
@media (min-width: 640px) { .tiktok-section__grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (min-width: 1024px) { .tiktok-section__grid { grid-template-columns: repeat(4, minmax(0,1fr)); } }
/* 4-col 9:16 cards. TikTok embed chrome is taller than 9:16 → oversize iframe + clip (no inner scroll). */
.tiktok-section__item {
	position: relative;
	width: 100%;
	min-width: 0;
	overflow: hidden;
	border-radius: 1rem;
	background: var(--color-card);
	border: 1px solid color-mix(in srgb, var(--color-border) 60%, transparent);
	box-shadow: 0 1px 2px rgba(0,0,0,0.05);
	aspect-ratio: 9 / 16;
}
.tiktok-section__item iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	/* Give the embed enough vertical room so TikTok doesn't scroll inside the iframe */
	height: 200%;
	border: none;
	overflow: hidden;
}
.tiktok-section__follow-row { margin-top: 2.5rem; display: flex; justify-content: center; }
.tiktok-section__follow-btn {
	display: inline-flex; align-items: center; gap: 0.5rem; border-radius: 999px; background: var(--color-navy); color: #fff;
	padding: 0.75rem 1.5rem; font-size: 0.875rem; font-weight: 600; transition: opacity 0.2s ease;
}
.tiktok-section__follow-btn:hover { opacity: 0.9; }

/* ---------------------------------------------------------------------
 * PODCAST SECTION
 * ------------------------------------------------------------------- */
.podcast-section__episodes { display: flex; flex-direction: column; gap: 1.25rem; max-width: 48rem; margin-inline: auto; }
.podcast-section__episode { position: relative; width: 100%; overflow: hidden; border-radius: 1rem; background: var(--color-card); border: 1px solid color-mix(in srgb, var(--color-border) 60%, transparent); box-shadow: 0 1px 2px rgba(0,0,0,0.05); }
.podcast-section__episode iframe { display: block; width: 100%; }
.podcast-section__platforms { margin-top: 2.5rem; max-width: 48rem; margin-inline: auto; }
.podcast-section__also-available { text-align: center; font-size: 0.75rem; letter-spacing: 0.2em; text-transform: uppercase; color: color-mix(in srgb, var(--color-foreground) 60%, transparent); font-weight: 600; margin-bottom: 1rem; }
.podcast-section__platform-row { display: flex; flex-wrap: nowrap; justify-content: center; align-items: center; gap: 0.75rem; overflow-x: auto; padding-bottom: 0.5rem; }
.podcast-section__platform-btn {
	display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; border: 1px solid var(--color-border);
	background: #fff; padding: 0.75rem 1.25rem; transition: border-color 0.2s ease, box-shadow 0.2s ease; flex-shrink: 0;
}
.podcast-section__platform-btn:hover { border-color: var(--color-navy); box-shadow: 0 4px 10px rgba(0,0,0,0.08); }
.podcast-section__platform-btn img { height: 1.375rem; width: auto; }
.podcast-section__platform-btn[aria-label*="YouTube"] img { height: 1.25rem; }
.podcast-section__platform-btn[aria-label*="iHeart"] img { height: 1.5rem; }
.podcast-section__more-wrap { display: flex; justify-content: center; margin-top: 0.5rem; position: relative; }
.podcast-section__more-btn {
	display: inline-flex; align-items: center; gap: 0.375rem; border-radius: 999px; border: 1px solid var(--color-muted);
	background: color-mix(in srgb, var(--color-muted) 40%, transparent); padding: 0.75rem 1.25rem; font-size: 0.875rem; font-weight: 500;
	color: color-mix(in srgb, var(--color-foreground) 50%, transparent); transition: color 0.2s ease, background-color 0.2s ease; border-width: 1px;
}
.podcast-section__more-btn:hover { color: color-mix(in srgb, var(--color-foreground) 80%, transparent); background: color-mix(in srgb, var(--color-muted) 60%, transparent); }
.podcast-section__more-chevron { transition: transform 0.2s ease; }
.podcast-section__more-btn[aria-expanded="true"] .podcast-section__more-chevron { transform: rotate(180deg); }
.podcast-section__more-menu {
	position: absolute; z-index: 50; top: calc(100% + 0.5rem); left: 50%; transform: translateX(-50%);
	width: 16rem; max-height: 20rem; overflow-y: auto; border-radius: 0.75rem; border: 1px solid var(--color-border);
	background: #fff; box-shadow: 0 20px 40px -12px rgba(0,0,0,0.25); padding-block: 0.5rem;
}
.podcast-section__more-menu[hidden] { display: none; }
.podcast-section__more-item { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 1rem; font-size: 0.875rem; color: color-mix(in srgb, var(--color-foreground) 80%, transparent); transition: background-color 0.2s ease; }
.podcast-section__more-item:hover { background: var(--color-muted); }
.podcast-section__more-item img { width: 1.25rem; height: 1.25rem; border-radius: 0.25rem; flex-shrink: 0; }
.podcast-section__more-item span { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.podcast-section__more-item-icon { margin-left: auto; color: color-mix(in srgb, var(--color-foreground) 40%, transparent); flex-shrink: 0; }
.podcast-section__rss-box { margin-top: 1.5rem; border-radius: 0.75rem; border: 1px solid var(--color-border); background: var(--color-card); padding: 1rem 1.25rem; }
.podcast-section__rss-inner { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; }
@media (min-width: 640px) { .podcast-section__rss-inner { flex-direction: row; gap: 1.25rem; } }
.podcast-section__rss-label { font-size: 0.875rem; color: color-mix(in srgb, var(--color-foreground) 60%, transparent); font-weight: 500; flex-shrink: 0; }
.podcast-section__rss-field { flex: 1; width: 100%; display: flex; align-items: stretch; border-radius: 0.5rem; border: 1px solid color-mix(in srgb, var(--color-border) 60%, transparent); background: var(--color-background); overflow: hidden; }
.podcast-section__rss-url-wrap { flex: 1; display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 1rem; min-width: 0; }
.podcast-section__rss-url { font-size: 0.875rem; color: color-mix(in srgb, var(--color-foreground) 80%, transparent); font-family: monospace; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.podcast-section__rss-copy-btn {
	flex-shrink: 0; display: inline-flex; align-items: center; gap: 0.5rem; background: var(--color-navy); color: #fff;
	padding: 0.6rem 1rem; font-size: 0.875rem; font-weight: 600; border: none; transition: opacity 0.2s ease;
}
.podcast-section__rss-copy-btn:hover { opacity: 0.9; }

/* ---------------------------------------------------------------------
 * FOUNDER SECTION
 * ------------------------------------------------------------------- */
/* Section has padding-block: 5rem (= Lovable container py-20); inner must not double it */
.founder-section__inner { padding-block: 0; display: grid; grid-template-columns: 1fr; gap: 3rem; align-items: center; }
@media (min-width: 1024px) { .founder-section__inner { grid-template-columns: 1fr 1fr; } }
.founder-section__media { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
/* Lovable: w-full aspect-square object-cover rounded-2xl (no absolute/cover-img) */
.founder-section__media-img {
	width: 100%;
	height: auto;
	aspect-ratio: 1/1;
	object-fit: cover;
	border-radius: 1rem;
	display: block;
}
.founder-section__media-img--2 { margin-top: 2.5rem; }
.founder-section__eyebrow { font-size: 0.75rem; letter-spacing: 0.25em; text-transform: uppercase; color: var(--color-rust); font-weight: 600; }
.founder-section__name { margin-bottom: 1.5rem; }
.founder-section__bio { display: flex; flex-direction: column; gap: 1rem; color: rgba(255,255,255,0.8); line-height: 1.7; }

/* ---------------------------------------------------------------------
 * FAQ SECTION
 * ------------------------------------------------------------------- */
.faq-section__inner { max-width: 48rem; margin-inline: auto; }
.faq-section__list { display: flex; flex-direction: column; gap: 0.75rem; }
.faq-section__item { border-radius: 1rem; border: 1px solid var(--color-border); background: var(--color-card); padding: 1.25rem; transition: box-shadow 0.2s ease; }
.faq-section__item[open] { box-shadow: 0 4px 10px rgba(0,0,0,0.08); }
.faq-section__summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; cursor: pointer; list-style: none; }
.faq-section__summary::-webkit-details-marker { display: none; }
.faq-section__question { font-family: var(--font-display); font-size: 1.125rem; }
.faq-section__chevron { color: color-mix(in srgb, var(--color-foreground) 55%, transparent); transition: transform 0.2s ease; flex-shrink: 0; }
.faq-section__item[open] .faq-section__chevron { transform: rotate(180deg); }
.faq-section__answer { margin-top: 0.75rem; color: color-mix(in srgb, var(--color-foreground) 75%, transparent); line-height: 1.6; }

/* ---------------------------------------------------------------------
 * CTA BAND
 * ------------------------------------------------------------------- */
.cta-band {
	position: relative; isolation: isolate; overflow: hidden; background-color: var(--color-navy);
	background-attachment: fixed; background-position: center; background-size: cover;
}
.cta-band__gradient { position: absolute; inset: 0; background: linear-gradient(to bottom right, color-mix(in srgb, var(--color-navy) 85%, transparent), color-mix(in srgb, var(--color-navy) 70%, transparent), color-mix(in srgb, var(--color-navy) 40%, transparent)); }
.cta-band__radial { position: absolute; inset: 0; background: radial-gradient(ellipse at bottom, rgba(0,0,0,0.55), transparent 60%); }
.cta-band__inner { position: relative; padding-block: 7rem; }
@media (min-width: 768px) { .cta-band__inner { padding-block: 10rem; } }
.cta-band__content { max-width: 48rem; }
.cta-band__eyebrow { display: inline-flex; align-items: center; gap: 0.5rem; font-size: 0.75rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--color-rust); font-weight: 600; }
.cta-band__eyebrow-rule { height: 1px; width: 2rem; background: var(--color-rust); }
.cta-band__body { margin-top: 1.5rem; font-size: 1.125rem; color: rgba(255,255,255,0.85); max-width: 42rem; line-height: 1.7; }
@media (min-width: 768px) { .cta-band__body { font-size: 1.25rem; } }
.cta-band__ctas { margin-top: 2.5rem; display: flex; flex-wrap: wrap; gap: 1rem; }
.cta-band .btn-hero-primary { padding: 1rem 1.75rem; box-shadow: 0 20px 40px -12px rgba(0,0,0,0.4); }
.cta-band .btn-hero-primary:hover { transform: translateY(-2px); }
.cta-band .btn-hero-outline--light { padding: 1rem 1.75rem; backdrop-filter: blur(4px); }

/* ---------------------------------------------------------------------
 * CONTACT SECTION
 * ------------------------------------------------------------------- */
.contact-section { background: var(--color-sand); }
.contact-section__inner { display: grid; grid-template-columns: 1fr; gap: 2.5rem; align-items: center; }
@media (min-width: 768px) { .contact-section__inner { grid-template-columns: 1fr 1fr; } }
.contact-section__title { margin-bottom: 1.25rem; }
.contact-section__body { color: color-mix(in srgb, var(--color-foreground) 75%, transparent); line-height: 1.7; margin-bottom: 1.5rem; }
.contact-section__links { display: flex; flex-direction: column; gap: 0.75rem; font-size: 0.875rem; }
.contact-section__link { display: flex; align-items: center; gap: 0.75rem; transition: color 0.2s ease; }
.contact-section__link:hover { color: var(--color-rust); }
.contact-section__link-icon { color: var(--color-rust); flex-shrink: 0; }
.contact-section__form { border-radius: 1rem; background: var(--color-card); border: 1px solid var(--color-border); padding: 1.5rem; display: flex; flex-direction: column; gap: 0.75rem; }
.theme-input, .theme-textarea {
	width: 100%; padding: 0.75rem 1rem; background: var(--color-background); border: 1px solid var(--color-border);
	border-radius: 0.375rem; font-size: 0.875rem; font-family: inherit; color: inherit;
}
.theme-input:focus, .theme-textarea:focus { outline: none; box-shadow: 0 0 0 2px var(--color-rust); }
.theme-textarea { resize: none; }
/* Lovable contact CTA uses bg-primary (navy), not accent/rust */
.contact-section__submit {
	width: 100%;
	background-color: var(--color-navy) !important;
	color: var(--color-primary-foreground) !important;
}
.contact-section__submit:hover { opacity: 0.9; }
.theme-form-message { border-radius: 0.5rem; padding: 0.65rem 0.9rem; font-size: 0.8125rem; }
.theme-form-message[data-status="success"] { background: color-mix(in srgb, var(--color-navy) 12%, transparent); color: var(--color-navy); }
.theme-form-message[data-status="error"] { background: color-mix(in srgb, #b91c1c 12%, transparent); color: #b91c1c; }
.theme-form-message[hidden] { display: none; }

/* =========================================================================
   SITE FOOTER
   ========================================================================= */
.site-footer { background: var(--color-navy); color: #fff; overflow-x: clip; }
.site-footer__inner { margin-inline: auto; max-width: 80rem; padding: 4rem 1.25rem 2rem; min-width: 0; }
@media (min-width: 1024px) { .site-footer__inner { padding-inline: 2.5rem; } }
/* Mobile: single column. Never use span-N without a 12-col template (causes page-wide overflow). */
.site-footer__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 3rem; }
.site-footer__brand,
.site-footer__col { grid-column: auto; min-width: 0; }
@media (min-width: 768px) {
	.site-footer__grid { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2.5rem; }
	.site-footer__brand { grid-column: span 4; }
	.site-footer__col--explore { grid-column: 6 / span 2; }
	.site-footer__col--support { grid-column: span 2; }
	.site-footer__col--contact { grid-column: 10 / -1; min-width: 0; }
}
.site-footer__col-title { font-size: 0.75rem; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.5); }
.theme-footer-list { margin-top: 1rem; display: flex; flex-direction: column; gap: 0.65rem; font-size: 0.875rem; }
.theme-footer-list a { color: rgba(255,255,255,0.8); transition: color 0.2s ease; }
.theme-footer-list a:hover { color: var(--color-rust); }
.site-footer__contact-list { margin-top: 1rem; display: flex; flex-direction: column; gap: 0.75rem; font-size: 0.875rem; color: rgba(255,255,255,0.8); }
.site-footer__contact-link {
	display: inline-flex;
	align-items: center;
	gap: 0.625rem;
	max-width: 100%;
	transition: color 0.2s ease;
	/* Prefer full email on one line; only wrap at soft points on very narrow screens */
	word-break: normal;
	overflow-wrap: anywhere;
}
@media (min-width: 768px) {
	.site-footer__contact-link { white-space: nowrap; overflow-wrap: normal; }
}
.site-footer__contact-link:hover { color: var(--color-rust); }
.site-footer__contact-link svg { flex-shrink: 0; color: rgba(255,255,255,0.5); }
.site-footer__tt-badge { display: inline-grid; place-items: center; height: 14px; width: 14px; font-size: 9px; font-weight: 700; color: rgba(255,255,255,0.5); }
.site-footer__bottom { margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,0.1); display: flex; flex-direction: column; gap: 0.75rem; align-items: center; justify-content: space-between; font-size: 0.75rem; color: rgba(255,255,255,0.5); }
@media (min-width: 768px) { .site-footer__bottom { flex-direction: row; } }
.site-footer__tagline { letter-spacing: 0.2em; text-transform: uppercase; }

/* =========================================================================
   404 / GENERIC PAGE
   ========================================================================= */
.theme-404 { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding-block: 4rem; padding-inline: 1rem; }
.theme-404__inner { text-align: center; max-width: 28rem; }
.theme-404__code { font-size: 4.5rem; font-weight: 700; line-height: 1; } /* Lovable text-7xl */
.theme-404__title { margin-top: 1rem; font-size: 1.25rem; font-weight: 600; }
.theme-404__text { margin-top: 0.5rem; font-size: 0.875rem; color: color-mix(in srgb, var(--color-foreground) 65%, transparent); }
.theme-404__cta {
	display: inline-flex; align-items: center; justify-content: center; margin-top: 1.5rem;
	padding: 0.5rem 1rem; border-radius: 0.375rem; background: var(--color-navy); color: #fff;
	font-size: 0.875rem; font-weight: 500; transition: opacity 0.2s ease;
}
.theme-404__cta:hover { opacity: 0.9; color: #fff; }
.theme-generic-page { padding-block: 4rem; }
.page-title { font-size: 2rem; font-weight: 600; margin-bottom: 1.5rem; }
/* Mobile uses fixed header + body padding-top (--site-header-offset).
   Do NOT also pad .site-main. Desktop keeps sticky in-flow. */
body.theme-no-hero .site-main { padding-top: 0; }
body.home .site-main { padding-top: 0; }

/* ---------------------------------------------------------------------
 * MOBILE OVERFLOW HARDENING — < lg (desktop layout unchanged)
 * ------------------------------------------------------------------- */
@media (max-width: 1023.98px) {
	html, body {
		overflow-x: clip !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	/* Exclude .site-header — overflow-x:hidden would clip the drawer / force overflow-y */
	.site-main,
	.site-footer,
	.cta-band,
	.hero-section,
	.about-section,
	.services-section,
	.founder-section,
	.contact-section {
		max-width: 100% !important;
		overflow-x: clip;
	}

	.site-header {
		max-width: 100% !important;
	}

	.site-main > *,
	.container-wide,
	section[class*="-section"] {
		min-width: 0;
		max-width: 100%;
		box-sizing: border-box;
	}

	/* Never let absolute decoration widen the page */
	.about-section__ellipsis {
		left: 0;
		font-size: clamp(4rem, 22vw, 9rem);
		max-width: 40%;
		overflow: hidden;
	}
	.services-section__card-num {
		right: 0;
		font-size: clamp(3rem, 18vw, 7rem);
	}

	.hero-section__title,
	.about-section__title,
	.cta-band__title,
	.section-heading,
	.shop-heading,
	.contact-section__title,
	.founder-section__name,
	.theme-product-info__title {
		overflow-wrap: anywhere;
		word-break: break-word;
	}

	.hero-section,
	.hero-section__frame,
	.hero-section__content,
	.hero-section__content-inner,
	.hero-section__grid,
	.hero-section__copy,
	.hero-section__ctas {
		min-width: 0;
		max-width: 100%;
		box-sizing: border-box;
	}

	.hero-section__ctas .btn-hero-primary,
	.hero-section__ctas .btn-hero-outline,
	.cta-band__ctas .btn-hero-primary,
	.cta-band__ctas .btn-hero-outline {
		white-space: normal;
		text-align: center;
		max-width: 100%;
	}

	img, svg, video, canvas, iframe, embed, object {
		max-width: 100%;
	}

	/* Avoid 100vw (includes scrollbar gutters and causes horizontal scroll) */
	.podcast-section__more-menu {
		left: 0;
		right: 0;
		transform: none;
		margin-inline: auto;
		width: 100%;
		max-width: 16rem;
	}

	.podcast-section__platform-row {
		max-width: 100%;
	}

	.contact-section__link,
	.site-footer__contact-link {
		white-space: normal !important;
		overflow-wrap: anywhere;
		max-width: 100%;
	}

	.contact-section__form,
	.theme-input,
	.theme-textarea {
		max-width: 100%;
		min-width: 0;
	}

	.theme-product-grid,
	.theme-product-card-wrap,
	.theme-product-card,
	.services-section__grid,
	.partners-section__grid,
	.projects-section__grid,
	.tiktok-section__grid,
	.about-section__grid {
		min-width: 0;
		max-width: 100%;
	}

	.cta-band { background-attachment: scroll; }

	/* Off-canvas drawer must not enlarge scrollWidth while closed */
	#theme-cart-drawer {
		visibility: hidden;
		pointer-events: none;
	}
	body.cart-open #theme-cart-drawer {
		visibility: visible;
		pointer-events: auto;
	}
}