/* Storefront owns these outer wrappers, outside the landing content. */
.tsa-landing-page .site-content > .col-full {
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
}

.tsa-landing-page .site-header {
	margin-bottom: 0;
}

.tsa-landing {
	--tsa-width: 1200px;
	--tsa-gutter: clamp(1.25rem, 3vw, 2rem);
	--tsa-space: clamp(3rem, 5vw, 4.5rem);
	--tsa-ink: #202b27;
	--tsa-muted: #52615b;
	--tsa-accent: #174f46;
	--tsa-accent-dark: #103c35;
	--tsa-surface: #f4f7f4;
	--tsa-border: #dce5df;
	color: var(--tsa-ink);
	font-size: 1rem;
	line-height: 1.65;
	overflow-wrap: anywhere;
}

.tsa-landing#primary {
	width: 100%;
	float: none;
	margin: 0;
}

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

.tsa-landing .site-main,
.tsa-landing .tsa-landing__page,
.tsa-landing .tsa-landing__content {
	margin: 0;
}

.tsa-landing .tsa-landing__content {
	display: flow-root;
	padding: 0;
}

/* Support both classic HTML and Gutenberg's optional Group inner wrapper. */
.tsa-landing .tsa-landing__content > *,
.tsa-landing .tsa-container,
.tsa-landing .alignwide {
	width: calc(100% - var(--tsa-gutter) - var(--tsa-gutter));
	max-width: var(--tsa-width);
	margin-inline: auto;
}

.tsa-landing .tsa-landing__content > .tsa-section,
.tsa-landing .tsa-landing__content > .alignfull {
	width: 100%;
	max-width: none;
	margin-inline: 0;
}

.tsa-landing .tsa-landing__content > :first-child:not(.tsa-section):not(.alignfull) {
	margin-top: var(--tsa-space);
}

.tsa-landing .tsa-landing__content > :last-child:not(.tsa-section):not(.alignfull) {
	margin-bottom: var(--tsa-space);
}

.tsa-landing .tsa-section {
	display: flow-root;
	padding-block: var(--tsa-space);
}

.tsa-landing .tsa-section--muted {
	background: var(--tsa-surface);
}

.tsa-landing .tsa-custom-order {
	background: linear-gradient(135deg, #edf4ef, #f7f9f6);
	border-block: 1px solid var(--tsa-border);
}

.tsa-landing .tsa-custom-order .tsa-container {
	max-width: 1000px;
}

.tsa-landing h1,
.tsa-landing h2,
.tsa-landing h3 {
	color: var(--tsa-ink);
	font-family: inherit;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -.025em;
	text-wrap: balance;
}

.tsa-landing h1 {
	margin: 1.25rem 0;
	font-size: clamp(2.125rem, 3.7vw, 3.5rem);
	line-height: 1.12;
}

.tsa-landing h2 {
	margin-bottom: 1rem;
	font-size: clamp(1.75rem, 2.7vw, 2.5rem);
}

.tsa-landing h3 {
	font-size: 1.25rem;
	line-height: 1.35;
}

.tsa-landing p {
	color: var(--tsa-muted);
	line-height: 1.7;
}

/* Center section introductions, while card and product copy stays readable. */
.tsa-landing .tsa-container > h2,
.tsa-landing .tsa-container > .wp-block-group__inner-container > h2 {
	text-align: center;
}

.tsa-landing .tsa-container > p,
.tsa-landing .tsa-container > .wp-block-group__inner-container > p {
	max-width: 66ch;
	margin-inline: auto;
	text-align: center;
}

.tsa-landing .tsa-eyebrow {
	color: var(--tsa-accent);
	font-size: .8125rem;
	font-weight: 700;
	letter-spacing: .065em;
	line-height: 1.5;
}

.tsa-landing .tsa-hero {
	display: grid;
	grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
	align-items: center;
	gap: clamp(2rem, 5vw, 4rem);
}

/* The wrapper must span the outer grid, then lay out the real child blocks. */
.tsa-landing .tsa-hero > .wp-block-group__inner-container {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: inherit;
	align-items: inherit;
	gap: inherit;
}

.tsa-landing .tsa-hero > *,
.tsa-landing .tsa-hero > .wp-block-group__inner-container > * {
	min-width: 0;
	margin-block: 0;
}

.tsa-landing .tsa-hero__copy {
	max-width: 38rem;
	margin-inline: auto;
	text-align: center;
}

.tsa-landing .tsa-hero__copy p:not(.tsa-eyebrow) {
	font-size: clamp(1rem, 1.3vw, 1.125rem);
}

.tsa-landing .tsa-hero__media {
	width: 100%;
	max-width: 28rem;
	margin-inline: auto;
}

.tsa-landing .tsa-hero__media figure {
	margin: 0;
}

.tsa-landing .tsa-hero__media img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: contain;
	object-position: center;
	border-radius: 1.75rem;
	box-shadow: 0 16px 48px rgb(32 43 39 / 10%);
}

.tsa-landing .tsa-actions {
	display: flex;
	justify-content: center;
	align-items: stretch;
	flex-wrap: wrap;
	gap: .75rem;
	margin-block: 1.75rem;
}

.tsa-landing .tsa-actions > .wp-block-button {
	margin: 0;
}

.tsa-landing .tsa-button,
.tsa-landing .tsa-actions .wp-block-button__link,
.tsa-landing .site-main ul.products li.product .button,
.tsa-landing .site-main ul.products li.product .added_to_cart {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 50px;
	max-width: 100%;
	padding: .85rem 1.35rem;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.4;
	text-align: center;
	text-decoration: none;
	white-space: normal;
	transition: background-color .18s ease, color .18s ease, box-shadow .18s ease;
	/* Core outline buttons and Storefront use important presentation rules. */
	background: var(--tsa-accent) !important;
	color: #fff !important;
	border: 1px solid var(--tsa-accent) !important;
	border-radius: .875rem !important;
}

.tsa-landing .tsa-button--secondary,
.tsa-landing .tsa-actions .is-style-outline .wp-block-button__link {
	background: #fff !important;
	color: var(--tsa-accent) !important;
}

.tsa-landing .tsa-button:is(:hover, :focus-visible),
.tsa-landing .tsa-actions .wp-block-button__link:is(:hover, :focus-visible),
.tsa-landing .site-main ul.products li.product .button:is(:hover, :focus-visible),
.tsa-landing .site-main ul.products li.product .added_to_cart:is(:hover, :focus-visible) {
	background: var(--tsa-accent-dark) !important;
	color: #fff !important;
	border-color: var(--tsa-accent-dark) !important;
	box-shadow: 0 4px 12px rgb(23 79 70 / 16%);
}

/* Keep secondary buttons legible even with Gutenberg's outline style active. */
.tsa-landing .tsa-button--secondary:is(:hover, :focus-visible),
.tsa-landing .tsa-actions .is-style-outline .wp-block-button__link:is(:hover, :focus-visible) {
	background: #e1eee6 !important;
	color: var(--tsa-accent-dark) !important;
	border-color: var(--tsa-accent) !important;
	box-shadow: none;
}

.tsa-landing a:focus-visible,
.tsa-landing button:focus-visible,
.tsa-landing input:focus-visible,
.tsa-landing select:focus-visible,
.tsa-landing textarea:focus-visible {
	outline: 3px solid #1976b9;
	outline-offset: 4px;
}

.tsa-landing [id] {
	scroll-margin-top: 2rem;
}

.tsa-landing img,
.tsa-landing iframe,
.tsa-landing video {
	max-width: 100%;
}

.tsa-landing img {
	height: auto;
}

.tsa-landing pre {
	white-space: pre-wrap;
	overflow-wrap: anywhere;
}

.tsa-landing :is(.tsa-how-it-works, .tsa-reviews, .tsa-trust) {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.25rem;
	list-style: none;
	padding: 0;
	margin-block: 2rem 0;
}

.tsa-landing :is(.tsa-how-it-works, .tsa-reviews, .tsa-trust) > .wp-block-group__inner-container {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: inherit;
	gap: inherit;
}

.tsa-landing :is(.tsa-how-it-works, .tsa-reviews, .tsa-trust) > :not(.wp-block-group__inner-container),
.tsa-landing :is(.tsa-how-it-works, .tsa-reviews, .tsa-trust) > .wp-block-group__inner-container > * {
	min-width: 0;
	margin: 0;
	padding: clamp(1.25rem, 2.5vw, 2rem);
	border: 1px solid var(--tsa-border);
	border-radius: 1.25rem;
	background: #fff;
	box-shadow: 0 4px 18px rgb(32 43 39 / 3%);
	text-align: left;
}

.tsa-landing :is(.tsa-how-it-works, .tsa-reviews, .tsa-trust) p:last-child {
	margin-bottom: 0;
}

/* Reset Storefront floats, fixed mobile heights and the old price overlay. */
.tsa-landing .site-main ul.products {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1.25rem;
	width: 100%;
	margin: 2rem 0;
	padding: 0;
	list-style: none;
}

.tsa-landing .site-main ul.products::before,
.tsa-landing .site-main ul.products::after {
	display: none;
}

.tsa-landing .site-main ul.products li.product {
	display: flex;
	flex-direction: column;
	float: none;
	clear: none;
	width: auto;
	min-width: 0;
	margin: 0;
	padding: 1rem;
	border: 1px solid var(--tsa-border);
	border-radius: 1.25rem;
	background: #fff;
	text-align: left;
	transition: border-color .18s ease, box-shadow .18s ease;
}

.tsa-landing .site-main ul.products li.product:not(.product-category) {
	height: auto;
}

.tsa-landing .site-main ul.products li.product:is(:hover, :focus-within) {
	border-color: #9bb7a9;
	box-shadow: 0 8px 24px rgb(32 43 39 / 8%);
}

.tsa-landing .site-main ul.products li.product .woocommerce-loop-product__link {
	display: flex;
	flex: 1;
	flex-direction: column;
	color: var(--tsa-ink);
	text-decoration: none;
}

.tsa-landing .site-main ul.products li.product img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: contain;
	margin: 0 0 1rem;
	border-radius: .75rem;
}

.tsa-landing .site-main ul.products li.product .category-image-4x3 {
	position: relative;
	padding: 0;
	aspect-ratio: 4 / 3;
	margin-bottom: 1rem;
	overflow: hidden;
}

.tsa-landing .site-main ul.products li.product .category-image-4x3 img {
	height: 100%;
	margin: 0;
}

.tsa-landing .site-main ul.products li.product .woocommerce-loop-product__title {
	font-size: 1.125rem;
	line-height: 1.4;
	margin: 0 0 .75rem;
}

.tsa-landing .site-main ul.products li.product .price {
	position: static;
	display: block;
	margin-top: auto;
	padding: 0;
	background: transparent;
	color: var(--tsa-ink);
	font-size: 1rem;
	font-weight: 600;
}

.tsa-landing .site-main ul.products li.product .button,
.tsa-landing .site-main ul.products li.product .added_to_cart {
	width: 100%;
	margin: .75rem 0 0;
}

@media (max-width: 1199px) {
	.tsa-landing .site-main ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 767px) {
	.tsa-landing .tsa-hero,
	.tsa-landing :is(.tsa-how-it-works, .tsa-reviews, .tsa-trust) {
		grid-template-columns: minmax(0, 1fr);
	}

	.tsa-landing .tsa-hero {
		gap: 2rem;
	}

	.tsa-landing .tsa-actions > *,
	.tsa-landing .tsa-actions .wp-block-button__link {
		width: 100%;
	}

	.tsa-landing .tsa-hero__media {
		max-width: 25rem;
	}
}

@media (max-width: 479px) {
	.tsa-landing .site-main ul.products {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (prefers-reduced-motion: reduce) {
	.tsa-landing .tsa-button,
	.tsa-landing .tsa-actions .wp-block-button__link,
	.tsa-landing .site-main ul.products li.product,
	.tsa-landing .site-main ul.products li.product .button,
	.tsa-landing .site-main ul.products li.product .added_to_cart {
		transition: none;
	}
}
