:root {
	--snpl-ink: #172033;
	--snpl-muted: #596173;
	--snpl-line: rgba(23, 32, 51, 0.12);
	--snpl-surface: #ffffff;
	--snpl-soft: #f4f7f7;
	--snpl-teal: #15b8a6;
	--snpl-blue: #4f7df3;
	--snpl-rose: #f05d8e;
}

body {
	background: var(--snpl-soft);
}

body.home #main,
body.snpl-categories-page-active #main,
.tax-product_cat #main,
.post-type-archive-product #main {
	--theme-content-vertical-spacing: 0;
}

body.home #main > .ct-container-full,
body.snpl-categories-page-active #main > .ct-container-full,
.tax-product_cat #main > .ct-container-full,
.post-type-archive-product #main > .ct-container-full {
	padding-top: 0 !important;
}

.ct-header [data-row*="middle"] {
	background: rgba(255, 255, 255, 0.94);
	backdrop-filter: blur(14px);
	border-bottom: 1px solid rgba(23, 32, 51, 0.08);
	box-shadow: 0 12px 32px rgba(23, 32, 51, 0.06);
}

.site-branding[data-id="logo"] {
	min-width: 210px;
}

.snpl-logo-link {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
}

.snpl-logo-link img {
	display: block;
	width: min(220px, 44vw);
	height: auto;
	max-height: 54px;
}

.header-menu-1 .menu {
	display: flex;
	align-items: center;
	gap: clamp(12px, 1.4vw, 24px);
}

.header-menu-1 .ct-menu-link {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.01em;
	color: var(--snpl-ink);
}

.header-menu-1 .ct-menu-link:hover,
.header-menu-1 .current-menu-item > .ct-menu-link {
	color: var(--snpl-teal);
}

body.home .entry-header,
body.snpl-categories-page-active .entry-header,
.tax-product_cat .hero-section[data-type],
.post-type-archive-product .hero-section[data-type] {
	display: none;
}

.snpl-hero {
	position: relative;
	min-height: clamp(420px, 58vh, 640px);
	display: grid;
	align-items: center;
	overflow: hidden;
	background-image:
		linear-gradient(90deg, rgba(255, 255, 255, 0.96) 0%, rgba(255, 255, 255, 0.86) 34%, rgba(255, 255, 255, 0.24) 61%, rgba(255, 255, 255, 0.04) 100%),
		var(--snpl-hero-image);
	background-size: cover;
	background-position: center;
	border-bottom: 1px solid rgba(23, 32, 51, 0.08);
}

.snpl-hero-home {
	margin-top: calc(var(--theme-content-vertical-spacing, 60px) * -1);
}

.snpl-hero-compact,
.snpl-hero-archive {
	min-height: clamp(320px, 42vh, 480px);
}

.snpl-hero-content {
	width: min(1180px, calc(100% - 40px));
	margin: 0 auto;
	padding: clamp(36px, 4rem, 64px) 0;
	color: var(--snpl-ink);
}

.snpl-eyebrow {
	margin: 0 0 14px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--snpl-teal);
}

.snpl-hero h1,
.snpl-section h2,
.snpl-feature-copy h2 {
	margin: 0;
	max-width: 680px;
	color: var(--snpl-ink);
	font-weight: 800;
	letter-spacing: 0;
	line-height: 1.02;
}

.snpl-hero h1 {
	font-size: clamp(42px, 4.5rem, 72px);
}

.snpl-hero p:not(.snpl-eyebrow) {
	max-width: 560px;
	margin: 22px 0 0;
	color: #384154;
	font-size: clamp(17px, 1.25rem, 20px);
	line-height: 1.6;
}

.snpl-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 30px;
}

.snpl-button,
.snpl-text-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	border-radius: 8px;
	padding: 0 20px;
	font-size: 14px;
	font-weight: 800;
	text-decoration: none;
}

.snpl-button-primary {
	background: var(--snpl-ink);
	color: #fff;
	box-shadow: 0 16px 32px rgba(23, 32, 51, 0.18);
}

.snpl-button-primary:hover {
	background: #0f1727;
	color: #fff;
}

.snpl-button-secondary {
	background: rgba(255, 255, 255, 0.72);
	border: 1px solid rgba(23, 32, 51, 0.18);
	color: var(--snpl-ink);
}

.snpl-button-secondary:hover,
.snpl-text-link:hover {
	color: var(--snpl-blue);
}

.snpl-service-strip,
.snpl-section,
.snpl-feature-band {
	width: min(1180px, calc(100% - 40px));
	margin-inline: auto;
}

.snpl-service-strip {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1px;
	margin-top: clamp(28px, 5vw, 64px);
	background: var(--snpl-line);
	border: 1px solid var(--snpl-line);
	border-radius: 8px;
	overflow: hidden;
}

.snpl-service-strip div {
	background: var(--snpl-surface);
	padding: 24px;
}

.snpl-service-strip strong,
.snpl-service-strip span {
	display: block;
}

.snpl-service-strip strong {
	color: var(--snpl-ink);
	font-size: 15px;
}

.snpl-service-strip span {
	margin-top: 5px;
	color: var(--snpl-muted);
	font-size: 13px;
	line-height: 1.5;
}

.snpl-section {
	padding: clamp(48px, 7vw, 90px) 0;
}

.snpl-section-heading {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 24px;
	margin-bottom: 24px;
}

.snpl-section h2,
.snpl-feature-copy h2 {
	font-size: clamp(30px, 3rem, 48px);
}

.snpl-collection-grid {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 18px;
}

.snpl-collection-card {
	display: flex;
	flex-direction: column;
	min-height: 100%;
	background: var(--snpl-surface);
	border: 1px solid rgba(23, 32, 51, 0.08);
	border-radius: 8px;
	overflow: hidden;
	text-decoration: none;
	box-shadow: 0 18px 38px rgba(23, 32, 51, 0.07);
	transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.snpl-collection-card:hover {
	transform: translateY(-3px);
	border-color: rgba(21, 184, 166, 0.32);
	box-shadow: 0 26px 48px rgba(23, 32, 51, 0.12);
}

.snpl-collection-card img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	display: block;
}

.snpl-collection-card span,
.snpl-collection-card strong,
.snpl-collection-card em {
	margin-inline: 16px;
}

.snpl-collection-card span {
	margin-top: 16px;
	color: var(--snpl-teal);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.snpl-collection-card strong {
	margin-top: 7px;
	color: var(--snpl-ink);
	font-size: 18px;
	line-height: 1.2;
}

.snpl-collection-card em {
	margin-top: 10px;
	margin-bottom: 18px;
	color: var(--snpl-muted);
	font-size: 13px;
	font-style: normal;
	line-height: 1.5;
}

.snpl-feature-band {
	display: grid;
	grid-template-columns: 0.78fr 1.22fr;
	gap: clamp(24px, 4vw, 54px);
	align-items: center;
	margin-bottom: clamp(54px, 7vw, 90px);
	padding: clamp(18px, 2.2vw, 28px);
	background: var(--snpl-surface);
	border: 1px solid rgba(23, 32, 51, 0.08);
	border-radius: 8px;
	box-shadow: 0 24px 55px rgba(23, 32, 51, 0.08);
}

.snpl-feature-copy {
	padding: clamp(14px, 2.5vw, 30px);
}

.snpl-feature-copy p:not(.snpl-eyebrow) {
	margin: 18px 0 0;
	color: var(--snpl-muted);
	font-size: 16px;
	line-height: 1.7;
}

.snpl-feature-band img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: 8px;
}

.snpl-text-link {
	margin-top: 22px;
	padding-inline: 0;
	color: var(--snpl-ink);
}

.snpl-empty-store {
	width: min(1180px, calc(100% - 40px));
	margin: 28px auto;
	padding: 24px;
	background: #fff;
	border: 1px solid rgba(23, 32, 51, 0.08);
	border-radius: 8px;
	color: var(--snpl-muted);
	box-shadow: 0 18px 38px rgba(23, 32, 51, 0.06);
}

.snpl-empty-store strong,
.snpl-empty-store span {
	display: block;
}

.snpl-empty-store strong {
	color: var(--snpl-ink);
	font-size: 18px;
}

.snpl-empty-store span {
	margin-top: 6px;
}

.woocommerce ul.products li.product,
[data-products] .product {
	border-radius: 8px;
	overflow: hidden;
	background: #fff;
	border: 1px solid rgba(23, 32, 51, 0.08);
	box-shadow: 0 18px 36px rgba(23, 32, 51, 0.06);
}

.woocommerce ul.products li.product .ct-media-container,
[data-products] .product .ct-media-container {
	background: #f7f8fb;
}

@media (max-width: 1100px) {
	.snpl-collection-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 780px) {
	.snpl-hero {
		min-height: auto;
		background-image:
			linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.86) 54%, rgba(255, 255, 255, 0.48) 100%),
			var(--snpl-hero-image);
		background-position: center right;
	}

	.snpl-service-strip,
	.snpl-feature-band {
		grid-template-columns: 1fr;
	}

	.snpl-section-heading {
		display: block;
	}

	.snpl-collection-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 520px) {
	.site-branding[data-id="logo"] {
		min-width: 0;
	}

	.snpl-logo-link img {
		width: min(182px, 58vw);
	}

	.snpl-hero-content {
		width: min(100% - 32px, 1180px);
		padding: 34px 0 42px;
	}

	.snpl-hero h1 {
		font-size: 48px;
	}

	.snpl-hero p:not(.snpl-eyebrow) {
		margin-top: 18px;
		font-size: 18px;
	}

	.snpl-collection-grid {
		grid-template-columns: 1fr;
	}

	.snpl-actions {
		display: grid;
	}

	.snpl-button {
		width: 100%;
	}
}
