/**
 * TAZZANT responsive homepage — mobile lots 03A to 03I plus desktop layout.
 * Homepage overrides stay scoped to the dedicated body class and component.
 */

.tz-mobile-home {
	display: none;
}

.tz-desktop-site-header,
.tz-desktop-footer {
	display: none;
}

@media (max-width: 991.98px) {
	html {
	scroll-behavior: smooth;
	}

	body.tazzant-mobile-homepage {
		background: var(--tz-bg);
		color: var(--tz-text);
		padding-bottom: calc(var(--tz-mobile-nav-height) + env(safe-area-inset-bottom, 0px));
	}

	body.tazzant-mobile-homepage .wd-hb-wrapp,
	body.tazzant-mobile-homepage .whb-header,
	body.tazzant-mobile-homepage .wd-page-content,
	body.tazzant-mobile-homepage .footer-container,
	body.tazzant-mobile-homepage .wd-toolbar {
		display: none !important;
	}

	.tz-mobile-home,
	.tz-mobile-home * {
		box-sizing: border-box;
	}

	.tz-mobile-home {
		display: block;
		font-family: Nunito, Inter, ui-rounded, "Arial Rounded MT Bold", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
		margin: 0 auto;
		max-width: 820px;
		padding: 12px 12px 28px;
		position: relative;
		z-index: 391;
	}

	.tz-mobile-home a {
		color: inherit;
		text-decoration: none;
	}

	.tz-mobile-home svg {
		display: block;
		fill: none;
		height: 100%;
		stroke: currentColor;
		stroke-linecap: round;
		stroke-linejoin: round;
		stroke-width: 1.7;
		width: 100%;
	}

	.tz-skip-link {
		background: var(--tz-text);
		border-radius: var(--tz-radius-sm);
		color: var(--tz-surface) !important;
		font-size: 13px;
		font-weight: 800;
		left: 14px;
		padding: 10px 14px;
		position: fixed;
		top: -100px;
		z-index: 10000;
	}

	.tz-skip-link:focus {
		top: 12px;
	}

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

	/* Header — native WoodMart triggers remain on menu, search and cart. */
	.tz-header {
		align-items: center;
		background: rgb(255 255 255 / 96%);
		border: 1px solid rgb(22 59 109 / 5%);
		border-radius: 20px;
		box-shadow: 0 8px 24px rgb(70 48 26 / 9%);
		display: grid;
		grid-template-columns: 46px minmax(0, 1fr) 92px;
		height: 72px;
		padding: 7px 8px;
		position: sticky;
		top: 8px;
		z-index: 395;
	}

	.tz-header-actions {
		align-items: center;
		display: flex;
		justify-content: flex-end;
	}

	.tz-header-tool,
	.tz-header-tool > a,
	.tz-header-tool > button {
		align-items: center;
		display: flex;
		height: 44px;
		justify-content: center;
		width: 44px;
	}

	.tz-header-tool > a,
	.tz-header-tool > button {
		appearance: none;
		background: transparent;
		border: 0;
		color: var(--tz-text);
		cursor: pointer;
		padding: 0;
		position: relative;
	}

	.tz-header-tool svg {
		height: 27px;
		width: 27px;
	}

	.tz-logo {
		display: block;
		margin: 0 auto;
		max-width: 184px;
		width: 100%;
	}

	.tz-logo picture,
	.tz-logo img {
		display: block;
		width: 100%;
	}

	.tz-logo img {
		height: auto;
	}

	.tz-cart-count,
	.tz-bottom-cart > b {
		align-items: center;
		background: var(--tz-cta);
		border: 2px solid var(--tz-surface);
		border-radius: var(--tz-radius-pill);
		color: var(--tz-surface);
		display: flex;
		font-size: 10px;
		font-style: normal;
		font-weight: 800;
		height: 20px;
		justify-content: center;
		line-height: 1;
		min-width: 20px;
		padding-inline: 4px;
		position: absolute;
		right: 0;
		top: 0;
	}

	.tz-cart-count.is-empty,
	.tz-bottom-cart > b.is-empty {
		display: none;
	}

	/* Mobile TAZZANT drawer — replaces the English WoodMart demo menu. */
	body.tz-menu-open {
		overflow: hidden;
	}

	.tz-menu-layer[hidden] {
		display: none !important;
	}

	.tz-menu-layer,
	.tz-menu-layer * {
		box-sizing: border-box;
	}

	.tz-menu-layer {
		color: var(--tz-text);
		font-family: Nunito, Inter, ui-rounded, "Arial Rounded MT Bold", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
		inset: 0;
		position: fixed;
		z-index: 999999;
	}

	.tz-menu-layer a {
		color: inherit;
		text-decoration: none;
	}

	.tz-menu-layer svg {
		display: block;
		fill: none;
		height: 100%;
		stroke: currentColor;
		stroke-linecap: round;
		stroke-linejoin: round;
		stroke-width: 1.7;
		width: 100%;
	}

	.tz-menu-backdrop {
		appearance: none;
		background: rgb(16 30 49 / 64%);
		border: 0;
		cursor: pointer;
		inset: 0;
		opacity: 0;
		padding: 0;
		position: absolute;
		transition: opacity .22s ease;
		width: 100%;
	}

	.tz-menu-drawer {
		background: var(--tz-bg);
		box-shadow: 18px 0 45px rgb(22 59 109 / 18%);
		display: flex;
		flex-direction: column;
		height: 100%;
		left: 0;
		overflow-x: hidden;
		overflow-y: auto;
		overscroll-behavior: contain;
		padding: max(14px, env(safe-area-inset-top, 0px)) 14px calc(24px + env(safe-area-inset-bottom, 0px));
		position: absolute;
		top: 0;
		transform: translateX(-102%);
		transition: transform .24s cubic-bezier(.22, .75, .32, 1);
		width: min(90vw, 380px);
	}

	.tz-menu-layer.is-open .tz-menu-backdrop {
		opacity: 1;
	}

	.tz-menu-layer.is-open .tz-menu-drawer {
		transform: translateX(0);
	}

	.tz-menu-head {
		align-items: center;
		display: flex;
		justify-content: space-between;
		min-height: 54px;
	}

	.tz-menu-logo {
		display: block;
		max-width: 188px;
		width: 61%;
	}

	.tz-menu-logo img {
		display: block;
		height: auto;
		width: 100%;
	}

	.tz-menu-close {
		align-items: center;
		appearance: none;
		background: var(--tz-surface);
		border: 1px solid var(--tz-border);
		border-radius: 14px;
		color: var(--tz-text);
		cursor: pointer;
		display: flex;
		height: 44px;
		justify-content: center;
		padding: 0;
		width: 44px;
	}

	.tz-menu-close svg {
		height: 22px;
		width: 22px;
	}

	.tz-menu-search {
		align-items: center;
		background: var(--tz-surface);
		border: 1px solid var(--tz-border);
		border-radius: 17px;
		box-shadow: var(--tz-shadow-sm);
		display: grid;
		gap: 8px;
		grid-template-columns: 22px minmax(0, 1fr) auto;
		margin-top: 12px;
		min-height: 54px;
		padding: 5px 6px 5px 13px;
	}

	.tz-menu-search > svg {
		color: var(--tz-muted);
		height: 21px;
		width: 21px;
	}

	.tz-menu-search input[type="search"] {
		appearance: none;
		background: transparent;
		border: 0;
		box-shadow: none;
		color: var(--tz-text);
		font: 700 13px/1.2 Nunito, Inter, system-ui, sans-serif;
		height: 42px;
		min-width: 0;
		outline: 0;
		padding: 0;
		width: 100%;
	}

	.tz-menu-search input[type="search"]::placeholder {
		color: #8b94a3;
		opacity: 1;
	}

	.tz-menu-search button {
		appearance: none;
		background: var(--tz-primary);
		border: 0;
		border-radius: 12px;
		color: var(--tz-surface);
		cursor: pointer;
		font-size: 10.5px;
		font-weight: 850;
		min-height: 42px;
		padding: 0 11px;
	}

	.tz-menu-welcome {
		align-items: center;
		background: linear-gradient(135deg, var(--tz-aqua-soft), #fff);
		border: 1px solid rgb(69 197 180 / 20%);
		border-radius: 18px;
		display: grid;
		gap: 11px;
		grid-template-columns: 42px 1fr;
		margin-top: 12px;
		padding: 12px;
	}

	.tz-menu-welcome > span {
		align-items: center;
		background: var(--tz-surface);
		border-radius: 13px;
		color: var(--tz-primary);
		display: flex;
		height: 42px;
		justify-content: center;
		width: 42px;
	}

	.tz-menu-welcome svg {
		height: 22px;
		width: 22px;
	}

	.tz-menu-welcome p,
	.tz-menu-welcome strong {
		display: block;
		margin: 0;
	}

	.tz-menu-welcome p {
		color: #258f83;
		font-size: 9.5px;
		font-weight: 850;
		letter-spacing: .04em;
		margin-bottom: 3px;
		text-transform: uppercase;
	}

	.tz-menu-welcome strong {
		color: var(--tz-text);
		font-size: 13px;
		font-weight: 850;
		line-height: 1.25;
	}

	.tz-menu-nav {
		background: var(--tz-surface);
		border: 1px solid var(--tz-border);
		border-radius: 20px;
		box-shadow: var(--tz-shadow-sm);
		margin-top: 12px;
		overflow: hidden;
	}

	.tz-menu-nav > a {
		align-items: center;
		display: grid;
		gap: 10px;
		grid-template-columns: 38px minmax(0, 1fr) 12px;
		min-height: 67px;
		padding: 8px 11px;
	}

	.tz-menu-nav > a + a {
		border-top: 1px solid var(--tz-border);
	}

	.tz-menu-item-icon {
		align-items: center;
		border-radius: 12px;
		display: flex;
		height: 38px;
		justify-content: center;
		width: 38px;
	}

	.tz-menu-item-icon.is-aqua { background: var(--tz-aqua-soft); color: #258f83; }
	.tz-menu-item-icon.is-coral { background: var(--tz-coral-soft); color: var(--tz-cta); }
	.tz-menu-item-icon.is-yellow { background: var(--tz-yellow-soft); color: #c78910; }
	.tz-menu-item-icon.is-purple { background: var(--tz-purple-soft); color: var(--tz-purple); }
	.tz-menu-item-icon.is-green { background: var(--tz-green-soft); color: #659727; }

	.tz-menu-item-icon svg {
		height: 20px;
		width: 20px;
	}

	.tz-menu-nav strong,
	.tz-menu-nav small {
		display: block;
	}

	.tz-menu-nav strong {
		color: var(--tz-text);
		font-size: 12.5px;
		font-weight: 850;
		line-height: 1.2;
	}

	.tz-menu-nav small {
		color: var(--tz-muted);
		font-size: 9.5px;
		line-height: 1.3;
		margin-top: 3px;
	}

	.tz-menu-nav b {
		color: #9aa3af;
		font-size: 20px;
		font-weight: 500;
	}

	.tz-menu-ages {
		background: var(--tz-surface);
		border: 1px solid var(--tz-border);
		border-radius: 18px;
		margin-top: 12px;
		padding: 13px;
	}

	.tz-menu-ages > strong {
		display: block;
		font-size: 11.5px;
		font-weight: 850;
		margin-bottom: 9px;
	}

	.tz-menu-ages > div {
		display: flex;
		flex-wrap: wrap;
		gap: 7px;
	}

	.tz-menu-ages a {
		background: var(--tz-aqua-soft);
		border: 1px solid rgb(69 197 180 / 18%);
		border-radius: var(--tz-radius-pill);
		color: #247f75;
		font-size: 10.5px;
		font-weight: 800;
		min-height: 36px;
		padding: 10px 11px;
	}

	.tz-menu-utilities {
		display: grid;
		gap: 8px;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		margin-top: 12px;
	}

	.tz-menu-utilities a {
		align-items: center;
		background: var(--tz-surface);
		border: 1px solid var(--tz-border);
		border-radius: 15px;
		color: var(--tz-text);
		display: flex;
		flex-direction: column;
		font-size: 9px;
		font-weight: 800;
		gap: 6px;
		justify-content: center;
		min-height: 68px;
		padding: 7px 4px;
		text-align: center;
	}

	.tz-menu-utilities a.is-whatsapp {
		color: #168f42;
	}

	.tz-menu-utilities svg {
		height: 22px;
		width: 22px;
	}

	/* Hero — first mobile LCP with two clear actions. */
	.tz-hero {
		background:
			radial-gradient(circle at 94% 8%, rgb(255 255 255 / 82%) 0 46px, transparent 47px),
			linear-gradient(145deg, #f0fbf9 0%, #e7f8f6 100%);
		border: 1px solid rgb(69 197 180 / 10%);
		border-radius: var(--tz-radius-lg);
		box-shadow: var(--tz-shadow-md);
		display: grid;
		grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr);
		margin-top: 16px;
		min-height: 386px;
		overflow: hidden;
		padding: 25px 17px 32px;
		position: relative;
	}

	.tz-hero-copy {
		align-self: center;
		position: relative;
		z-index: 2;
	}

	.tz-eyebrow,
	.tz-section-kicker {
		font-weight: 800;
		letter-spacing: .01em;
	}

	.tz-eyebrow {
		background: rgb(255 255 255 / 68%);
		border: 1px solid rgb(69 197 180 / 42%);
		border-radius: var(--tz-radius-pill);
		color: #258f83;
		display: inline-block;
		font-size: 10.5px;
		line-height: 1;
		margin: 0 0 14px;
		padding: 9px 10px;
		white-space: nowrap;
	}

	.tz-hero h1 {
		color: var(--tz-text);
		font-family: Nunito, ui-rounded, "Arial Rounded MT Bold", system-ui, sans-serif;
		font-size: clamp(27px, 8vw, 38px);
		font-weight: 850;
		letter-spacing: -.045em;
		line-height: 1.03;
		margin: 0;
		max-width: 220px;
	}

	.tz-hero-intro {
		color: var(--tz-muted);
		font-size: 13.5px;
		line-height: 1.45;
		margin: 14px 0 17px;
		max-width: 205px;
	}

	.tz-hero-actions {
		align-items: flex-start;
		display: flex;
		flex-direction: column;
		gap: 9px;
	}

	.tz-button {
		align-items: center;
		border-radius: var(--tz-radius-pill);
		display: inline-flex;
		font-size: 11px;
		font-weight: 850;
		gap: 7px;
		justify-content: center;
		min-height: 44px;
		padding: 0 13px;
		white-space: nowrap;
	}

	.tz-button-primary {
		background: linear-gradient(135deg, #ff746a, var(--tz-cta));
		box-shadow: 0 9px 18px rgb(255 91 94 / 26%);
		color: var(--tz-surface) !important;
	}

	.tz-button-primary span {
		font-size: 18px;
		line-height: 1;
	}

	.tz-button-secondary {
		background: rgb(255 255 255 / 72%);
		border: 1px solid rgb(69 197 180 / 58%);
		color: #247f75 !important;
	}

	.tz-hero-art {
		align-self: center;
		height: 255px;
		margin-inline: -29px -47px;
		position: relative;
		z-index: 1;
	}

	.tz-hero-art img {
		display: block;
		height: 100%;
		object-fit: cover;
		width: 100%;
	}

	.tz-hero-dots {
		bottom: 14px;
		display: flex;
		gap: 6px;
		left: 50%;
		position: absolute;
		transform: translateX(-50%);
	}

	.tz-hero-dots span {
		background: #c6d3d0;
		border-radius: var(--tz-radius-pill);
		height: 7px;
		width: 7px;
	}

	.tz-hero-dots .is-active {
		background: var(--tz-primary);
		width: 20px;
	}

	/* Shared section rhythm. */
	.tz-main {
		display: grid;
		gap: 16px;
	}

	.tz-section {
		background: var(--tz-surface);
		border: 1px solid rgb(239 231 218 / 88%);
		border-radius: var(--tz-radius-lg);
		box-shadow: var(--tz-shadow-sm);
		margin-top: 0;
		overflow: hidden;
		padding: 20px 16px;
	}

	.tz-main > .tz-section:first-of-type {
		margin-top: 0;
	}

	.tz-section-heading {
		margin-bottom: 15px;
	}

	.tz-section-heading.is-inline {
		align-items: flex-end;
		display: flex;
		gap: 12px;
		justify-content: space-between;
	}

	.tz-section-kicker {
		color: var(--tz-primary);
		font-size: 10px;
		letter-spacing: .08em;
		margin: 0 0 5px;
		text-transform: uppercase;
	}

	.tz-section h2 {
		color: var(--tz-text);
		font-family: Nunito, ui-rounded, "Arial Rounded MT Bold", system-ui, sans-serif;
		font-size: clamp(21px, 5.8vw, 27px);
		font-weight: 850;
		letter-spacing: -.025em;
		line-height: 1.1;
		margin: 0;
	}

	.tz-section-heading > p:not(.tz-section-kicker),
	.tz-section-intro {
		color: var(--tz-muted);
		font-size: 13px;
		line-height: 1.5;
		margin: 8px 0 0;
	}

	.tz-section-heading.is-inline a {
		color: #279e90;
		font-size: 11.5px;
		font-weight: 850;
		padding-bottom: 2px;
		white-space: nowrap;
	}

	.tz-horizontal-list {
		display: flex;
		gap: 11px;
		margin-inline: -16px;
		overflow-x: auto;
		padding: 2px 16px 9px;
		scroll-padding-inline: 16px;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
	}

	.tz-horizontal-list::-webkit-scrollbar {
		display: none;
	}

	.tz-horizontal-list > * {
		flex: 0 0 auto;
		scroll-snap-align: start;
	}

	/* Lot 03B — three intention cards. */
	.tz-easy-card {
		border: 1px solid var(--tz-border);
		border-radius: 20px;
		box-shadow: 0 5px 16px rgb(22 59 109 / 5%);
		display: flex;
		flex-direction: column;
		min-height: 204px;
		padding: 15px;
		width: min(76vw, 270px);
	}

	.tz-easy-card.is-turquoise { background: linear-gradient(150deg, var(--tz-aqua-soft), #fff 72%); }
	.tz-easy-card.is-purple { background: linear-gradient(150deg, var(--tz-purple-soft), #fff 72%); }
	.tz-easy-card.is-yellow { background: linear-gradient(150deg, var(--tz-yellow-soft), #fff 72%); }

	.tz-card-icon,
	.tz-pack-icon {
		align-items: center;
		background: var(--tz-surface);
		border-radius: 15px;
		box-shadow: 0 5px 13px rgb(22 59 109 / 8%);
		color: var(--tz-primary);
		display: flex;
		height: 46px;
		justify-content: center;
		margin-bottom: 15px;
		width: 46px;
	}

	.tz-card-icon svg,
	.tz-pack-icon svg {
		height: 24px;
		width: 24px;
	}

	.tz-easy-card.is-purple .tz-card-icon { color: var(--tz-purple); }
	.tz-easy-card.is-yellow .tz-card-icon { color: #dc9814; }

	.tz-easy-card strong {
		color: var(--tz-text);
		font-size: 17px;
		font-weight: 850;
	}

	.tz-easy-card > span:not(.tz-card-icon) {
		color: var(--tz-muted);
		font-size: 12px;
		line-height: 1.45;
		margin-top: 5px;
	}

	.tz-easy-card em {
		color: var(--tz-text);
		font-size: 11px;
		font-style: normal;
		font-weight: 850;
		margin-top: auto;
		padding-top: 12px;
	}

	/* Lot 03C — complete age selector. */
	.tz-age-card {
		align-items: center;
		border: 1px solid rgb(22 59 109 / 5%);
		border-radius: 18px;
		display: grid;
		gap: 9px;
		grid-template-columns: 42px 1fr 12px;
		min-height: 72px;
		padding: 10px;
		width: 160px;
	}

	.tz-age-card.is-aqua { background: var(--tz-aqua-soft); }
	.tz-age-card.is-yellow { background: var(--tz-yellow-soft); }
	.tz-age-card.is-coral { background: var(--tz-coral-soft); }
	.tz-age-card.is-purple { background: var(--tz-purple-soft); }
	.tz-age-card.is-green { background: var(--tz-green-soft); }

	.tz-age-face {
		align-items: center;
		background: var(--tz-surface);
		border-radius: 50%;
		box-shadow: 0 4px 11px rgb(22 59 109 / 7%);
		color: var(--tz-text);
		display: flex;
		font-size: 13px;
		font-weight: 850;
		height: 42px;
		justify-content: center;
		width: 42px;
	}

	.tz-age-card strong,
	.tz-age-card small {
		display: block;
	}

	.tz-age-card strong {
		color: var(--tz-text);
		font-size: 16px;
		font-weight: 900;
		line-height: 1.1;
	}

	.tz-age-card small {
		color: var(--tz-muted);
		font-size: 11px;
		margin-top: 2px;
	}

	.tz-age-card b {
		color: var(--tz-muted);
		font-size: 22px;
		font-weight: 500;
	}

	/* Lot 03D — need-first navigation. */
	.tz-needs-grid {
		display: grid;
		gap: 9px;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.tz-need-card {
		align-items: center;
		background: #fbfbfa;
		border: 1px solid var(--tz-border);
		border-radius: 16px;
		display: grid;
		gap: 8px;
		grid-template-columns: 34px 1fr 8px;
		min-height: 72px;
		padding: 9px;
	}

	.tz-need-card > span {
		align-items: center;
		border-radius: 12px;
		color: var(--tz-text);
		display: flex;
		height: 34px;
		justify-content: center;
		width: 34px;
	}

	.tz-need-card.is-aqua > span { background: var(--tz-aqua-soft); color: #258f83; }
	.tz-need-card.is-yellow > span { background: var(--tz-yellow-soft); color: #c78910; }
	.tz-need-card.is-purple > span { background: var(--tz-purple-soft); color: var(--tz-purple); }
	.tz-need-card.is-coral > span { background: var(--tz-coral-soft); color: var(--tz-cta); }
	.tz-need-card.is-green > span { background: var(--tz-green-soft); color: #629523; }

	.tz-need-card svg {
		height: 19px;
		width: 19px;
	}

	.tz-need-card strong {
		color: var(--tz-text);
		font-size: 11.5px;
		font-weight: 800;
		line-height: 1.22;
	}

	.tz-need-card b {
		color: #96a0ad;
		font-size: 17px;
		font-weight: 500;
	}

	/* Lot 03E — honest pack placeholders, no fake products. */
	.tz-coming-pill,
	.tz-pack-status {
		background: var(--tz-coral-soft);
		border-radius: var(--tz-radius-pill);
		color: #c94c44;
		font-size: 10px;
		font-weight: 850;
		padding: 6px 10px;
	}

	.tz-pack-list {
		margin-top: 15px;
	}

	.tz-pack-card {
		background: linear-gradient(145deg, #fff, #fafafa);
		border: 1px solid var(--tz-border);
		border-radius: 20px;
		min-height: 190px;
		padding: 15px;
		position: relative;
		width: min(66vw, 238px);
	}

	.tz-pack-card::after {
		border: 2px dashed currentColor;
		border-radius: 50%;
		content: "";
		height: 52px;
		opacity: .09;
		position: absolute;
		right: 15px;
		top: 18px;
		width: 52px;
	}

	.tz-pack-card.is-aqua { color: var(--tz-primary); background: linear-gradient(145deg, var(--tz-aqua-soft), #fff 82%); }
	.tz-pack-card.is-yellow { color: #c78b16; background: linear-gradient(145deg, var(--tz-yellow-soft), #fff 82%); }
	.tz-pack-card.is-coral { color: var(--tz-cta); background: linear-gradient(145deg, var(--tz-coral-soft), #fff 82%); }
	.tz-pack-card.is-green { color: #609126; background: linear-gradient(145deg, var(--tz-green-soft), #fff 82%); }

	.tz-pack-card small {
		color: currentColor;
		font-size: 10px;
		font-weight: 850;
		letter-spacing: .04em;
		text-transform: uppercase;
	}

	.tz-pack-card h3 {
		color: var(--tz-text);
		font-size: 16px;
		font-weight: 850;
		line-height: 1.25;
		margin: 5px 0 17px;
	}

	.tz-pack-icon {
		color: currentColor;
		margin-bottom: 13px;
	}

	.tz-pack-status {
		background: rgb(255 255 255 / 82%);
		color: var(--tz-muted);
	}

	/* Lot 03F — live WooCommerce cards or an explicit empty state. */
	.tz-product-list {
		padding-bottom: 12px;
	}

	.tz-product-card {
		background: var(--tz-surface);
		border: 1px solid var(--tz-border);
		border-radius: 20px;
		box-shadow: 0 7px 18px rgb(22 59 109 / 7%);
		overflow: hidden;
		width: min(69vw, 252px);
	}

	.tz-product-image {
		aspect-ratio: 1 / .86;
		background: #faf9f7;
		display: block;
		overflow: hidden;
	}

	.tz-product-image img {
		height: 100%;
		object-fit: cover;
		width: 100%;
	}

	.tz-product-content {
		padding: 12px;
	}

	.tz-product-badge {
		background: var(--tz-purple-soft);
		border-radius: var(--tz-radius-pill);
		color: var(--tz-purple);
		display: inline-block;
		font-size: 9px;
		font-weight: 850;
		padding: 5px 8px;
	}

	.tz-product-card h3 {
		font-size: 14px;
		font-weight: 850;
		line-height: 1.3;
		margin: 8px 0 10px;
	}

	.tz-product-meta {
		align-items: center;
		display: flex;
		gap: 8px;
		justify-content: space-between;
		min-height: 27px;
	}

	.tz-product-price {
		color: var(--tz-cta);
		font-size: 16px;
		font-weight: 900;
	}

	.tz-product-rating {
		color: #d58d00;
		font-size: 10px;
		font-weight: 800;
	}

	.tz-add-to-cart.button {
		align-items: center;
		background: var(--tz-cta);
		border-radius: 13px;
		color: #fff;
		display: flex;
		font-size: 11px;
		font-weight: 850;
		gap: 7px;
		justify-content: center;
		margin-top: 11px;
		min-height: 44px;
		padding: 0 12px;
		width: 100%;
	}

	.tz-add-to-cart svg {
		height: 18px;
		width: 18px;
	}

	.tz-empty-state {
		align-items: center;
		background: linear-gradient(145deg, var(--tz-purple-soft), #fff);
		border: 1px dashed rgb(139 111 209 / 40%);
		border-radius: 18px;
		display: grid;
		gap: 13px;
		grid-template-columns: 48px 1fr;
		padding: 16px;
	}

	.tz-empty-state > svg {
		background: var(--tz-surface);
		border-radius: 15px;
		color: var(--tz-purple);
		height: 48px;
		padding: 11px;
		width: 48px;
	}

	.tz-empty-state strong,
	.tz-empty-state span {
		display: block;
	}

	.tz-empty-state strong {
		font-size: 13px;
		font-weight: 850;
		line-height: 1.3;
	}

	.tz-empty-state span {
		color: var(--tz-muted);
		font-size: 11px;
		line-height: 1.4;
		margin-top: 4px;
	}

	/* Lot 03G — commitments, editorial preparation and trust. */
	.tz-why {
		background: linear-gradient(155deg, #eefaf8, #fff 72%);
	}

	.tz-why-grid {
		display: grid;
		gap: 10px;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.tz-why-grid > div {
		background: rgb(255 255 255 / 88%);
		border: 1px solid rgb(69 197 180 / 18%);
		border-radius: 17px;
		padding: 13px;
	}

	.tz-why-grid span {
		align-items: center;
		background: var(--tz-aqua-soft);
		border-radius: 12px;
		color: #258f83;
		display: flex;
		height: 37px;
		justify-content: center;
		margin-bottom: 10px;
		width: 37px;
	}

	.tz-why-grid svg {
		height: 20px;
		width: 20px;
	}

	.tz-why-grid strong {
		display: block;
		font-size: 12.5px;
		font-weight: 850;
		line-height: 1.25;
	}

	.tz-why-grid p {
		color: var(--tz-muted);
		font-size: 10.5px;
		line-height: 1.42;
		margin: 5px 0 0;
	}

	.tz-advice-list {
		margin-top: 14px;
	}

	.tz-advice-card {
		border: 1px solid var(--tz-border);
		border-radius: 19px;
		min-height: 160px;
		padding: 16px;
		width: min(72vw, 260px);
	}

	.tz-advice-card.is-aqua { background: var(--tz-aqua-soft); }
	.tz-advice-card.is-yellow { background: var(--tz-yellow-soft); }
	.tz-advice-card.is-purple { background: var(--tz-purple-soft); }

	.tz-advice-card > span {
		color: rgb(22 59 109 / 26%);
		font-size: 25px;
		font-weight: 900;
	}

	.tz-advice-card h3 {
		color: var(--tz-text);
		font-size: 15px;
		font-weight: 850;
		line-height: 1.3;
		margin: 16px 0 11px;
	}

	.tz-advice-card small {
		color: var(--tz-muted);
		font-size: 10.5px;
		font-weight: 750;
	}

	.tz-trust {
		display: grid;
		gap: 0;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		padding-block: 9px;
	}

	.tz-trust > div,
	.tz-trust > a {
		align-items: center;
		display: grid;
		gap: 9px;
		grid-template-columns: 37px 1fr;
		min-height: 91px;
		padding: 11px 8px;
	}

	.tz-trust > :nth-child(odd) {
		border-right: 1px solid var(--tz-border);
	}

	.tz-trust > :nth-child(-n + 2) {
		border-bottom: 1px solid var(--tz-border);
	}

	.tz-trust > div > span,
	.tz-trust > a > span {
		align-items: center;
		border-radius: 12px;
		display: flex;
		height: 37px;
		justify-content: center;
		width: 37px;
	}

	.tz-trust svg {
		height: 21px;
		width: 21px;
	}

	.tz-trust .is-coral { background: var(--tz-coral-soft); color: var(--tz-cta); }
	.tz-trust .is-aqua { background: var(--tz-aqua-soft); color: var(--tz-primary); }
	.tz-trust .is-whatsapp { background: #e8fbed; color: var(--tz-whatsapp); }
	.tz-trust .is-purple { background: var(--tz-purple-soft); color: var(--tz-purple); }

	.tz-trust p,
	.tz-trust strong,
	.tz-trust small {
		display: block;
		margin: 0;
	}

	.tz-trust strong {
		font-size: 11.5px;
		font-weight: 850;
		line-height: 1.22;
	}

	.tz-trust small {
		color: var(--tz-muted);
		font-size: 9.5px;
		line-height: 1.35;
		margin-top: 4px;
	}

	/* Lot 03H — lightweight bottom navigation, scoped to this homepage. */
	.tz-bottom-nav {
		align-items: center;
		background: rgb(255 255 255 / 97%);
		border: 1px solid rgb(22 59 109 / 8%);
		border-radius: 21px 21px 0 0;
		bottom: 0;
		box-shadow: 0 -8px 26px rgb(22 59 109 / 10%);
		display: grid;
		grid-template-columns: repeat(5, minmax(0, 1fr));
		left: 50%;
		max-width: 820px;
		min-height: calc(var(--tz-mobile-nav-height) + env(safe-area-inset-bottom, 0px));
		padding: 7px 7px env(safe-area-inset-bottom, 0px);
		position: fixed;
		transform: translateX(-50%);
		width: 100%;
		z-index: 500;
	}

	.tz-bottom-nav > a,
	.tz-bottom-nav > span,
	.tz-bottom-nav > button {
		align-items: center;
		appearance: none;
		background: transparent;
		border: 0;
		color: var(--tz-text);
		cursor: pointer;
		display: flex;
		flex-direction: column;
		font-size: 9.5px;
		font-weight: 750;
		gap: 4px;
		justify-content: center;
		min-height: 52px;
		position: relative;
	}

	.tz-bottom-nav > a.is-active {
		color: var(--tz-cta);
	}

	.tz-bottom-nav > span > a {
		align-items: center;
		color: var(--tz-text);
		display: flex;
		flex-direction: column;
		font-size: 9.5px;
		font-weight: 750;
		gap: 4px;
		justify-content: center;
		min-height: 52px;
		width: 100%;
	}

	.tz-bottom-nav svg {
		height: 23px;
		width: 23px;
	}

	.tz-bottom-cart > b {
		right: calc(50% - 23px);
		top: 0;
	}

	/* Clear keyboard feedback and large enough touch targets. */
	.tz-mobile-home a:focus-visible,
	.tz-mobile-home button:focus-visible,
	.tz-menu-layer a:focus-visible,
	.tz-menu-layer button:focus-visible,
	.tz-menu-layer input:focus-visible {
		outline: 3px solid var(--tz-yellow);
		outline-offset: 3px;
	}

	.tz-button,
	.tz-header-tool > a,
	.tz-header-tool > button,
	.tz-bottom-nav > a,
	.tz-bottom-nav > button,
	.tz-bottom-nav > span > a {
		touch-action: manipulation;
	}
}

@media (max-width: 374px) {
	.tz-mobile-home {
		padding-inline: 8px;
	}

	.tz-header {
		grid-template-columns: 42px minmax(0, 1fr) 84px;
		padding-inline: 5px;
	}

	.tz-logo {
		max-width: 164px;
	}

	.tz-hero {
		grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
		padding-inline: 13px;
	}

	.tz-hero h1 {
		font-size: 26px;
	}

	.tz-hero-art {
		margin-inline: -30px -52px;
	}

	.tz-button {
		font-size: 10.5px;
		padding-inline: 11px;
	}

	.tz-section {
		padding-inline: 14px;
	}

	.tz-horizontal-list {
		margin-inline: -14px;
		padding-inline: 14px;
	}
}

@media (min-width: 600px) and (max-width: 991.98px) {
	.tz-mobile-home {
		padding-inline: 20px;
	}

	.tz-header {
		grid-template-columns: 52px minmax(0, 1fr) 104px;
	}

	.tz-logo {
		max-width: 205px;
	}

	.tz-hero {
		grid-template-columns: 1fr 1fr;
		min-height: 420px;
		padding-inline: 36px;
	}

	.tz-hero h1,
	.tz-hero-intro {
		max-width: 300px;
	}

	.tz-hero-art {
		height: 340px;
		margin-inline: -20px -55px;
	}

	.tz-hero-actions {
		align-items: center;
		flex-direction: row;
		flex-wrap: wrap;
	}

	.tz-easy-list,
	.tz-age-list,
	.tz-pack-list,
	.tz-advice-list {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		margin-inline: 0;
		overflow: visible;
		padding-inline: 0;
	}

	.tz-age-list {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.tz-easy-card,
	.tz-age-card,
	.tz-pack-card,
	.tz-advice-card {
		width: auto;
	}

	.tz-needs-grid,
	.tz-why-grid,
	.tz-trust {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.tz-trust > :nth-child(n) {
		border-bottom: 0;
		border-right: 1px solid var(--tz-border);
	}

	.tz-trust > :last-child {
		border-right: 0;
	}

	.tz-trust > div,
	.tz-trust > a {
		grid-template-columns: 39px 1fr;
	}
}

/* Desktop homepage — approved TAZZANT direction, isolated from WoodMart. */
@media (min-width: 992px) {
	html {
		scroll-behavior: smooth;
	}

	body.tazzant-mobile-homepage {
		background: var(--tz-bg);
		color: var(--tz-text);
		padding: 0;
	}

	body.tazzant-mobile-homepage .wd-hb-wrapp,
	body.tazzant-mobile-homepage .whb-header,
	body.tazzant-mobile-homepage .wd-page-content,
	body.tazzant-mobile-homepage .footer-container,
	body.tazzant-mobile-homepage .wd-toolbar {
		display: none !important;
	}

	.tz-mobile-home,
	.tz-mobile-home * {
		box-sizing: border-box;
	}

	.tz-mobile-home {
		background: var(--tz-bg);
		display: block;
		font-family: Nunito, Inter, ui-rounded, "Arial Rounded MT Bold", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
		margin: 0;
		max-width: none;
		padding: 0;
		position: relative;
		width: 100%;
	}

	.tz-mobile-home a {
		color: inherit;
		text-decoration: none;
	}

	.tz-mobile-home svg {
		display: block;
		fill: none;
		height: 100%;
		stroke: currentColor;
		stroke-linecap: round;
		stroke-linejoin: round;
		stroke-width: 1.7;
		width: 100%;
	}

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

	.tz-skip-link {
		background: var(--tz-text);
		border-radius: var(--tz-radius-sm);
		color: #fff !important;
		font-size: 13px;
		font-weight: 850;
		left: 24px;
		padding: 11px 16px;
		position: fixed;
		top: -100px;
		z-index: 10000;
	}

	.tz-skip-link:focus {
		top: 14px;
	}

	.tz-header,
	.tz-bottom-nav {
		display: none;
	}

	.tz-desktop-site-header,
	.tz-desktop-footer {
		display: block;
	}

	.tz-desktop-container {
		margin-inline: auto;
		max-width: calc(var(--tz-content) + 40px);
		padding-inline: 20px;
		width: 100%;
	}

	.tz-desktop-topbar {
		background: var(--tz-primary);
		color: #fff;
	}

	.tz-desktop-topbar .tz-desktop-container {
		align-items: center;
		display: flex;
		font-size: 12px;
		font-weight: 800;
		justify-content: center;
		min-height: 34px;
	}

	.tz-desktop-topbar span,
	.tz-desktop-topbar a {
		align-items: center;
		display: inline-flex;
		gap: 7px;
		justify-content: center;
		padding: 0 28px;
	}

	.tz-desktop-topbar span + span,
	.tz-desktop-topbar span + a {
		border-left: 1px solid rgb(255 255 255 / 38%);
	}

	.tz-desktop-topbar svg {
		height: 17px;
		width: 17px;
	}

	.tz-desktop-header {
		background: rgb(255 255 255 / 97%);
		border-bottom: 1px solid var(--tz-border);
		box-shadow: 0 6px 20px rgb(22 59 109 / 5%);
		position: relative;
		z-index: 50;
	}

	.tz-desktop-header-main {
		align-items: center;
		display: grid;
		gap: 30px;
		grid-template-columns: 225px minmax(310px, 1fr) auto;
		min-height: 92px;
	}

	.tz-desktop-logo {
		display: block;
		width: 215px;
	}

	.tz-desktop-logo img,
	.tz-footer-brand img {
		display: block;
		height: auto;
		width: 100%;
	}

	.tz-desktop-search {
		align-items: center;
		background: #f7faf9;
		border: 1px solid #dcebe8;
		border-radius: var(--tz-radius-pill);
		display: grid;
		grid-template-columns: 1fr 50px;
		height: 50px;
		overflow: hidden;
	}

	.tz-desktop-search input[type="search"] {
		background: transparent;
		border: 0;
		box-shadow: none;
		color: var(--tz-text);
		font-family: inherit;
		font-size: 14px;
		font-weight: 650;
		height: 100%;
		line-height: 1.2;
		outline: 0;
		padding: 0 20px;
		width: 100%;
	}

	.tz-desktop-search input::placeholder {
		color: #8794a5;
	}

	.tz-desktop-search button {
		align-items: center;
		appearance: none;
		background: var(--tz-primary);
		border: 0;
		color: #fff;
		cursor: pointer;
		display: flex;
		height: 100%;
		justify-content: center;
		padding: 0;
	}

	.tz-desktop-search button svg {
		height: 22px;
		width: 22px;
	}

	.tz-desktop-actions {
		align-items: center;
		display: flex;
		gap: 17px;
	}

	.tz-desktop-actions > a {
		align-items: center;
		color: var(--tz-text);
		display: flex;
		flex-direction: column;
		font-size: 10px;
		font-weight: 800;
		gap: 4px;
		min-width: 48px;
		position: relative;
	}

	.tz-desktop-actions svg {
		height: 25px;
		width: 25px;
	}

	.tz-desktop-actions .tz-cart-count {
		align-items: center;
		background: var(--tz-cta);
		border: 2px solid #fff;
		border-radius: var(--tz-radius-pill);
		color: #fff;
		display: flex;
		font-size: 9px;
		height: 19px;
		justify-content: center;
		line-height: 1;
		min-width: 19px;
		padding: 0 4px;
		position: absolute;
		right: 2px;
		top: -7px;
	}

	.tz-desktop-actions .tz-cart-count.is-empty {
		display: none;
	}

	.tz-desktop-nav {
		border-top: 1px solid #f2ede5;
	}

	.tz-desktop-nav .tz-desktop-container {
		align-items: stretch;
		display: flex;
		justify-content: space-between;
		overflow-x: auto;
		scrollbar-width: none;
	}

	.tz-desktop-nav .tz-desktop-container::-webkit-scrollbar {
		display: none;
	}

	.tz-desktop-nav a {
		align-items: center;
		color: var(--tz-text);
		display: flex;
		font-size: 11.5px;
		font-weight: 800;
		min-height: 48px;
		padding: 0 10px;
		position: relative;
		white-space: nowrap;
	}

	.tz-desktop-nav a::after {
		background: var(--tz-primary);
		border-radius: var(--tz-radius-pill);
		bottom: 0;
		content: "";
		height: 3px;
		left: 50%;
		position: absolute;
		transform: translateX(-50%) scaleX(0);
		transition: transform .18s ease;
		width: calc(100% - 20px);
	}

	.tz-desktop-nav a:hover::after,
	.tz-desktop-nav a:focus-visible::after {
		transform: translateX(-50%) scaleX(1);
	}

	.tz-main {
		display: grid;
		gap: 24px;
		margin: 24px auto 0;
		max-width: calc(var(--tz-content) + 40px);
		padding: 0 20px 42px;
	}

	.tz-hero {
		background:
			radial-gradient(circle at 91% 10%, rgb(255 255 255 / 86%) 0 64px, transparent 65px),
			linear-gradient(145deg, #f1fbfa 0%, #e4f8f5 100%);
		border: 1px solid rgb(69 197 180 / 15%);
		border-radius: 30px;
		box-shadow: var(--tz-shadow-md);
		display: grid;
		grid-template-columns: minmax(0, .93fr) minmax(0, 1.07fr);
		min-height: 460px;
		overflow: hidden;
		padding: 48px 54px;
		position: relative;
	}

	.tz-hero-copy {
		align-self: center;
		position: relative;
		z-index: 2;
	}

	.tz-eyebrow,
	.tz-section-kicker {
		font-weight: 850;
		letter-spacing: .01em;
	}

	.tz-eyebrow {
		background: rgb(255 255 255 / 72%);
		border: 1px solid rgb(69 197 180 / 44%);
		border-radius: var(--tz-radius-pill);
		color: #258f83;
		display: inline-block;
		font-size: 13px;
		line-height: 1;
		margin: 0 0 22px;
		padding: 11px 16px;
	}

	.tz-hero h1 {
		color: var(--tz-text);
		font-size: clamp(48px, 4.2vw, 64px);
		font-weight: 900;
		letter-spacing: -.05em;
		line-height: .99;
		margin: 0;
		max-width: 590px;
	}

	.tz-hero-intro {
		color: var(--tz-muted);
		font-size: 18px;
		line-height: 1.5;
		margin: 22px 0 26px;
		max-width: 470px;
	}

	.tz-hero-actions {
		align-items: center;
		display: flex;
		gap: 12px;
	}

	.tz-button {
		align-items: center;
		border-radius: var(--tz-radius-pill);
		display: inline-flex;
		font-size: 13px;
		font-weight: 850;
		gap: 8px;
		justify-content: center;
		min-height: 50px;
		padding: 0 21px;
		white-space: nowrap;
	}

	.tz-button-primary {
		background: linear-gradient(135deg, #ff746a, var(--tz-cta));
		box-shadow: 0 10px 20px rgb(255 91 94 / 24%);
		color: #fff !important;
	}

	.tz-button-primary span {
		font-size: 20px;
		line-height: 1;
	}

	.tz-button-secondary {
		background: rgb(255 255 255 / 76%);
		border: 1px solid rgb(69 197 180 / 60%);
		color: #247f75 !important;
	}

	.tz-hero-art {
		align-self: center;
		height: 405px;
		position: relative;
		z-index: 1;
	}

	.tz-hero-art img {
		display: block;
		height: 100%;
		object-fit: contain;
		width: 100%;
	}

	.tz-hero-dots {
		bottom: 18px;
		display: flex;
		gap: 7px;
		left: 50%;
		position: absolute;
		transform: translateX(-50%);
	}

	.tz-hero-dots span {
		background: #c6d3d0;
		border-radius: var(--tz-radius-pill);
		height: 7px;
		width: 7px;
	}

	.tz-hero-dots .is-active {
		background: var(--tz-primary);
		width: 24px;
	}

	.tz-section {
		background: var(--tz-surface);
		border: 1px solid rgb(239 231 218 / 90%);
		border-radius: 28px;
		box-shadow: var(--tz-shadow-sm);
		overflow: hidden;
		padding: 32px;
	}

	.tz-section-heading {
		margin-bottom: 22px;
	}

	.tz-section-heading.is-inline {
		align-items: flex-end;
		display: flex;
		gap: 20px;
		justify-content: space-between;
	}

	.tz-section-kicker {
		color: var(--tz-primary);
		font-size: 11px;
		letter-spacing: .1em;
		margin: 0 0 7px;
		text-transform: uppercase;
	}

	.tz-section h2 {
		color: var(--tz-text);
		font-size: 30px;
		font-weight: 900;
		letter-spacing: -.03em;
		line-height: 1.08;
		margin: 0;
	}

	.tz-section-heading > p:not(.tz-section-kicker),
	.tz-section-intro {
		color: var(--tz-muted);
		font-size: 14px;
		line-height: 1.5;
		margin: 9px 0 0;
	}

	.tz-section-heading.is-inline a {
		color: #279e90;
		font-size: 13px;
		font-weight: 850;
		padding-bottom: 3px;
		white-space: nowrap;
	}

	.tz-horizontal-list {
		display: grid;
		gap: 14px;
		margin: 0;
		overflow: visible;
		padding: 0;
	}

	.tz-easy-list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.tz-easy-card {
		border: 1px solid var(--tz-border);
		border-radius: 21px;
		box-shadow: 0 5px 16px rgb(22 59 109 / 4%);
		display: flex;
		flex-direction: column;
		min-height: 205px;
		padding: 20px;
		transition: box-shadow .18s ease, transform .18s ease;
		width: auto;
	}

	.tz-easy-card.is-turquoise { background: linear-gradient(150deg, var(--tz-aqua-soft), #fff 72%); }
	.tz-easy-card.is-purple { background: linear-gradient(150deg, var(--tz-purple-soft), #fff 72%); }
	.tz-easy-card.is-yellow { background: linear-gradient(150deg, var(--tz-yellow-soft), #fff 72%); }

	.tz-card-icon,
	.tz-pack-icon {
		align-items: center;
		background: #fff;
		border-radius: 15px;
		box-shadow: 0 5px 13px rgb(22 59 109 / 8%);
		color: var(--tz-primary);
		display: flex;
		height: 48px;
		justify-content: center;
		margin-bottom: 16px;
		width: 48px;
	}

	.tz-card-icon svg,
	.tz-pack-icon svg {
		height: 24px;
		width: 24px;
	}

	.tz-easy-card.is-purple .tz-card-icon { color: var(--tz-purple); }
	.tz-easy-card.is-yellow .tz-card-icon { color: #dc9814; }

	.tz-easy-card strong {
		font-size: 18px;
		font-weight: 900;
	}

	.tz-easy-card > span:not(.tz-card-icon) {
		color: var(--tz-muted);
		font-size: 13px;
		line-height: 1.45;
		margin-top: 6px;
	}

	.tz-easy-card em {
		font-size: 12px;
		font-style: normal;
		font-weight: 850;
		margin-top: auto;
		padding-top: 16px;
	}

	.tz-age-list {
		grid-template-columns: repeat(8, minmax(0, 1fr));
	}

	.tz-age-card {
		align-items: center;
		border: 1px solid rgb(22 59 109 / 5%);
		border-radius: 18px;
		display: grid;
		gap: 7px;
		grid-template-columns: 38px 1fr 9px;
		min-height: 74px;
		padding: 9px;
	}

	.tz-age-card.is-aqua { background: var(--tz-aqua-soft); }
	.tz-age-card.is-yellow { background: var(--tz-yellow-soft); }
	.tz-age-card.is-coral { background: var(--tz-coral-soft); }
	.tz-age-card.is-purple { background: var(--tz-purple-soft); }
	.tz-age-card.is-green { background: var(--tz-green-soft); }

	.tz-age-face {
		align-items: center;
		background: #fff;
		border-radius: 50%;
		box-shadow: 0 4px 11px rgb(22 59 109 / 7%);
		display: flex;
		font-size: 12px;
		font-weight: 850;
		height: 38px;
		justify-content: center;
		width: 38px;
	}

	.tz-age-card strong,
	.tz-age-card small {
		display: block;
	}

	.tz-age-card strong {
		font-size: 14px;
		font-weight: 900;
		line-height: 1.05;
	}

	.tz-age-card small {
		color: var(--tz-muted);
		font-size: 10px;
		margin-top: 3px;
	}

	.tz-age-card b {
		color: var(--tz-muted);
		font-size: 18px;
		font-weight: 500;
	}

	.tz-needs-grid {
		display: grid;
		gap: 12px;
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.tz-need-card {
		align-items: center;
		background: #fbfbfa;
		border: 1px solid var(--tz-border);
		border-radius: 17px;
		display: grid;
		gap: 10px;
		grid-template-columns: 40px 1fr 9px;
		min-height: 82px;
		padding: 12px;
		transition: box-shadow .18s ease, transform .18s ease;
	}

	.tz-need-card > span {
		align-items: center;
		border-radius: 12px;
		display: flex;
		height: 40px;
		justify-content: center;
		width: 40px;
	}

	.tz-need-card.is-aqua > span { background: var(--tz-aqua-soft); color: #258f83; }
	.tz-need-card.is-yellow > span { background: var(--tz-yellow-soft); color: #c78910; }
	.tz-need-card.is-purple > span { background: var(--tz-purple-soft); color: var(--tz-purple); }
	.tz-need-card.is-coral > span { background: var(--tz-coral-soft); color: var(--tz-cta); }
	.tz-need-card.is-green > span { background: var(--tz-green-soft); color: #629523; }

	.tz-need-card svg {
		height: 21px;
		width: 21px;
	}

	.tz-need-card strong {
		font-size: 12px;
		font-weight: 850;
		line-height: 1.25;
	}

	.tz-need-card b {
		color: #96a0ad;
		font-size: 18px;
		font-weight: 500;
	}

	.tz-coming-pill,
	.tz-pack-status {
		background: var(--tz-coral-soft);
		border-radius: var(--tz-radius-pill);
		color: #c94c44;
		font-size: 10px;
		font-weight: 850;
		padding: 7px 11px;
	}

	.tz-pack-list {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		margin-top: 18px;
	}

	.tz-pack-card {
		background: linear-gradient(145deg, #fff, #fafafa);
		border: 1px solid var(--tz-border);
		border-radius: 20px;
		min-height: 200px;
		padding: 18px;
		position: relative;
	}

	.tz-pack-card::after {
		border: 2px dashed currentColor;
		border-radius: 50%;
		content: "";
		height: 56px;
		opacity: .09;
		position: absolute;
		right: 18px;
		top: 20px;
		width: 56px;
	}

	.tz-pack-card.is-aqua { color: var(--tz-primary); background: linear-gradient(145deg, var(--tz-aqua-soft), #fff 82%); }
	.tz-pack-card.is-yellow { color: #c78b16; background: linear-gradient(145deg, var(--tz-yellow-soft), #fff 82%); }
	.tz-pack-card.is-coral { color: var(--tz-cta); background: linear-gradient(145deg, var(--tz-coral-soft), #fff 82%); }
	.tz-pack-card.is-green { color: #609126; background: linear-gradient(145deg, var(--tz-green-soft), #fff 82%); }

	.tz-pack-card small {
		font-size: 10px;
		font-weight: 850;
		letter-spacing: .04em;
		text-transform: uppercase;
	}

	.tz-pack-card h3 {
		color: var(--tz-text);
		font-size: 17px;
		font-weight: 900;
		line-height: 1.25;
		margin: 6px 0 19px;
	}

	.tz-pack-icon {
		color: currentColor;
		margin-bottom: 14px;
	}

	.tz-pack-status {
		background: rgb(255 255 255 / 82%);
		color: var(--tz-muted);
	}

	.tz-product-list {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.tz-product-card {
		background: #fff;
		border: 1px solid var(--tz-border);
		border-radius: 20px;
		box-shadow: 0 7px 18px rgb(22 59 109 / 7%);
		overflow: hidden;
	}

	.tz-product-image {
		aspect-ratio: 1 / .86;
		background: #faf9f7;
		display: block;
		overflow: hidden;
	}

	.tz-product-image img {
		height: 100%;
		object-fit: cover;
		width: 100%;
	}

	.tz-product-content {
		padding: 15px;
	}

	.tz-product-badge {
		background: var(--tz-purple-soft);
		border-radius: var(--tz-radius-pill);
		color: var(--tz-purple);
		display: inline-block;
		font-size: 9px;
		font-weight: 850;
		padding: 5px 8px;
	}

	.tz-product-card h3 {
		font-size: 14px;
		font-weight: 850;
		line-height: 1.3;
		margin: 9px 0 11px;
	}

	.tz-product-meta {
		align-items: center;
		display: flex;
		gap: 8px;
		justify-content: space-between;
		min-height: 28px;
	}

	.tz-product-price {
		color: var(--tz-cta);
		font-size: 17px;
		font-weight: 900;
	}

	.tz-product-rating {
		color: #d58d00;
		font-size: 10px;
		font-weight: 800;
	}

	.tz-add-to-cart.button {
		align-items: center;
		background: var(--tz-cta);
		border-radius: 13px;
		color: #fff;
		display: flex;
		font-size: 11px;
		font-weight: 850;
		gap: 7px;
		justify-content: center;
		margin-top: 12px;
		min-height: 44px;
		padding: 0 12px;
		width: 100%;
	}

	.tz-add-to-cart svg {
		height: 18px;
		width: 18px;
	}

	.tz-empty-state {
		align-items: center;
		background: linear-gradient(145deg, var(--tz-purple-soft), #fff);
		border: 1px dashed rgb(139 111 209 / 40%);
		border-radius: 18px;
		display: grid;
		gap: 16px;
		grid-template-columns: 56px 1fr;
		padding: 22px;
	}

	.tz-empty-state > svg {
		background: #fff;
		border-radius: 16px;
		color: var(--tz-purple);
		height: 56px;
		padding: 13px;
		width: 56px;
	}

	.tz-empty-state strong,
	.tz-empty-state span {
		display: block;
	}

	.tz-empty-state strong {
		font-size: 15px;
		font-weight: 850;
	}

	.tz-empty-state span {
		color: var(--tz-muted);
		font-size: 12px;
		margin-top: 5px;
	}

	.tz-why {
		background: linear-gradient(155deg, #eefaf8, #fff 72%);
	}

	.tz-why-grid,
	.tz-trust {
		display: grid;
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.tz-why-grid {
		gap: 12px;
	}

	.tz-why-grid > div {
		background: rgb(255 255 255 / 88%);
		border: 1px solid rgb(69 197 180 / 18%);
		border-radius: 18px;
		padding: 18px;
	}

	.tz-why-grid span {
		align-items: center;
		background: var(--tz-aqua-soft);
		border-radius: 13px;
		color: #258f83;
		display: flex;
		height: 42px;
		justify-content: center;
		margin-bottom: 12px;
		width: 42px;
	}

	.tz-why-grid svg {
		height: 22px;
		width: 22px;
	}

	.tz-why-grid strong {
		display: block;
		font-size: 13px;
		font-weight: 900;
		line-height: 1.25;
	}

	.tz-why-grid p {
		color: var(--tz-muted);
		font-size: 11px;
		line-height: 1.45;
		margin: 7px 0 0;
	}

	.tz-advice-list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		margin-top: 18px;
	}

	.tz-advice-card {
		border: 1px solid var(--tz-border);
		border-radius: 19px;
		min-height: 180px;
		padding: 21px;
	}

	.tz-advice-card.is-aqua { background: var(--tz-aqua-soft); }
	.tz-advice-card.is-yellow { background: var(--tz-yellow-soft); }
	.tz-advice-card.is-purple { background: var(--tz-purple-soft); }

	.tz-advice-card > span {
		color: rgb(22 59 109 / 26%);
		font-size: 27px;
		font-weight: 900;
	}

	.tz-advice-card h3 {
		font-size: 17px;
		font-weight: 850;
		line-height: 1.3;
		margin: 20px 0 14px;
	}

	.tz-advice-card small {
		color: var(--tz-muted);
		font-size: 11px;
		font-weight: 750;
	}

	.tz-trust {
		padding: 12px;
	}

	.tz-trust > div,
	.tz-trust > a {
		align-items: center;
		border-right: 1px solid var(--tz-border);
		display: grid;
		gap: 12px;
		grid-template-columns: 46px 1fr;
		min-height: 100px;
		padding: 15px;
	}

	.tz-trust > :last-child {
		border-right: 0;
	}

	.tz-trust > div > span,
	.tz-trust > a > span {
		align-items: center;
		border-radius: 14px;
		display: flex;
		height: 46px;
		justify-content: center;
		width: 46px;
	}

	.tz-trust svg {
		height: 24px;
		width: 24px;
	}

	.tz-trust .is-coral { background: var(--tz-coral-soft); color: var(--tz-cta); }
	.tz-trust .is-aqua { background: var(--tz-aqua-soft); color: var(--tz-primary); }
	.tz-trust .is-whatsapp { background: #e8fbed; color: var(--tz-whatsapp); }
	.tz-trust .is-purple { background: var(--tz-purple-soft); color: var(--tz-purple); }

	.tz-trust p,
	.tz-trust strong,
	.tz-trust small {
		display: block;
		margin: 0;
	}

	.tz-trust strong {
		font-size: 12px;
		font-weight: 900;
		line-height: 1.25;
	}

	.tz-trust small {
		color: var(--tz-muted);
		font-size: 10px;
		line-height: 1.4;
		margin-top: 5px;
	}

	.tz-easy-card:hover,
	.tz-need-card:hover {
		box-shadow: 0 12px 24px rgb(22 59 109 / 9%);
		transform: translateY(-3px);
	}

	.tz-mobile-home a:focus-visible,
	.tz-mobile-home button:focus-visible,
	.tz-mobile-home input:focus-visible {
		outline: 3px solid var(--tz-yellow);
		outline-offset: 3px;
	}

	.tz-desktop-footer {
		background: var(--tz-text);
		color: #fff;
		padding: 48px 0 20px;
	}

	.tz-footer-grid {
		display: grid;
		gap: 44px;
		grid-template-columns: 1.35fr .85fr .95fr 1.2fr;
	}

	.tz-footer-brand > a {
		display: block;
		filter: drop-shadow(0 4px 12px rgb(0 0 0 / 12%));
		max-width: 205px;
	}

	.tz-footer-brand p,
	.tz-footer-contact p {
		color: rgb(255 255 255 / 70%);
		font-size: 12px;
		line-height: 1.6;
		margin: 17px 0 0;
		max-width: 280px;
	}

	.tz-footer-grid nav,
	.tz-footer-contact {
		display: flex;
		flex-direction: column;
	}

	.tz-footer-grid nav > strong,
	.tz-footer-contact > strong {
		font-size: 14px;
		font-weight: 900;
		margin-bottom: 16px;
	}

	.tz-footer-grid nav a {
		color: rgb(255 255 255 / 72%);
		font-size: 12px;
		margin-bottom: 11px;
	}

	.tz-footer-contact > a {
		align-items: center;
		background: var(--tz-whatsapp);
		border-radius: var(--tz-radius-pill);
		color: #fff;
		display: inline-flex;
		font-size: 12px;
		font-weight: 850;
		gap: 8px;
		margin-top: 18px;
		min-height: 42px;
		padding: 0 16px;
		width: fit-content;
	}

	.tz-footer-contact > a svg {
		height: 20px;
		width: 20px;
	}

	.tz-footer-bottom {
		border-top: 1px solid rgb(255 255 255 / 13%);
		color: rgb(255 255 255 / 58%);
		display: flex;
		font-size: 10.5px;
		justify-content: space-between;
		margin-top: 36px;
		padding-top: 18px;
	}
}

@media (min-width: 992px) and (max-width: 1199.98px) {
	.tz-desktop-header-main {
		gap: 18px;
		grid-template-columns: 190px minmax(250px, 1fr) auto;
	}

	.tz-desktop-logo {
		width: 185px;
	}

	.tz-desktop-actions {
		gap: 9px;
	}

	.tz-desktop-actions > a {
		min-width: 43px;
	}

	.tz-desktop-actions > a span {
		display: none;
	}

	.tz-hero {
		padding-inline: 40px;
	}

	.tz-age-list {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.tz-footer-grid {
		gap: 28px;
	}
}

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

	.tz-mobile-home *,
	.tz-mobile-home *::before,
	.tz-mobile-home *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}
