/**
 * FUNFERY shared design system.
 *
 * Component-specific selectors should use ff- or funfery- prefixes.
 */

:root {
	--ff-color-background: #f7f7f7;
	--ff-color-surface: #ffffff;
	--ff-color-surface-blue: #e0f5fa;
	--ff-color-surface-peach: #ffe5d6;
	--ff-color-surface-lilac: #f3dfff;
	--ff-color-surface-green: #edf5dc;
	--ff-color-surface-soft: var(--ff-color-surface-blue);
	--ff-color-surface-violet: var(--ff-color-surface-lilac);
	--ff-color-text: #24343b;
	--ff-color-text-muted: #52646d;
	--ff-color-border: #b9cdd1;
	--ff-color-control-border: #71868b;
	--ff-color-accent: #73b526;
	--ff-color-accent-hover: #65a21f;
	--ff-color-accent-dark: #3f6b0d;
	--ff-color-accent-contrast: #172c10;
	--ff-color-accent-deep: var(--ff-color-accent-dark);
	--ff-color-brand: #176b78;
	--ff-color-brand-dark: #0f5965;
	--ff-color-focus: #52646d;
	--ff-color-focus-on-dark: var(--ff-color-surface-blue);
	--ff-color-success: #16715f;
	--ff-color-warning: #875100;
	--ff-color-error: #b3261e;
	--ff-color-logo-blue: #20affe;
	--ff-color-logo-violet: #d04de7;
	--ff-color-sun: var(--ff-color-surface-peach);
	--ff-color-footer: var(--ff-color-surface-blue);
	--ff-font-sans: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--ff-font-mono: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;
	--ff-container-width: 120rem;
	--ff-gutter: clamp(1rem, 3vw, 2.5rem);
	--ff-reading-width: 46rem;
	--ff-space-1: 0.25rem;
	--ff-space-2: 0.5rem;
	--ff-space-3: 0.75rem;
	--ff-space-4: 1rem;
	--ff-space-5: 1.5rem;
	--ff-space-6: 2rem;
	--ff-space-7: 3rem;
	--ff-space-8: 4rem;
	--ff-radius-sm: 0.375rem;
	--ff-radius-md: 0.75rem;
	--ff-radius-lg: 1.25rem;
	--ff-shadow-sm: 0 0.125rem 0.5rem rgb(36 52 59 / 8%);
	--ff-transition-fast: 160ms ease;
}

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

html {
	color-scheme: light;
	scroll-behavior: smooth;
}

body {
	min-width: 0;
	margin: 0;
	background: var(--ff-color-background);
	color: var(--ff-color-text);
	font-family: var(--ff-font-sans);
	font-size: 1rem;
	line-height: 1.65;
	overflow-wrap: anywhere;
	-webkit-font-smoothing: antialiased;
}

body :where(h1, h2, h3, h4, h5, h6) {
	margin-block: 0 0.6em;
	color: var(--ff-color-text);
	font-family: var(--ff-font-sans);
	font-weight: 700;
	line-height: 1.16;
	letter-spacing: -0.02em;
	text-wrap: balance;
}

body :where(p, ul, ol, blockquote) {
	margin-block: 0 1em;
}

/* Neutralize Divi's legacy blue border on search forms and quotations. */
body .et-search-form,
body blockquote {
	border: 0;
}

body :where(img, svg, video) {
	max-width: 100%;
	height: auto;
}

body a {
	color: var(--ff-color-brand);
	text-underline-offset: 0.18em;
}

body a:hover {
	color: var(--ff-color-brand-dark);
}

body :where(a, button, input, select, textarea, summary):focus-visible {
	outline: 1px solid var(--ff-color-focus);
	outline-offset: 0.125rem;
}

::selection {
	background: var(--ff-color-surface-blue);
	color: var(--ff-color-text);
}

.ff-container {
	width: min(100%, calc(var(--ff-container-width) + (2 * var(--ff-gutter))));
	margin-inline: auto;
	padding-inline: var(--ff-gutter);
}

.ff-reading-width {
	max-width: var(--ff-reading-width);
}

body .wp-element-button,
body .wp-block-button__link,
body .et_pb_button,
body .search-submit,
body .comment-form .submit {
	display: inline-flex;
	min-height: 2.75rem;
	align-items: center;
	justify-content: center;
	gap: var(--ff-space-2);
	padding: 0.7rem 1.15rem;
	border: 0.0625rem solid transparent;
	border-radius: var(--ff-radius-sm);
	background: var(--ff-color-accent);
	box-shadow: none;
	color: var(--ff-color-accent-contrast);
	font-family: var(--ff-font-sans);
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	touch-action: manipulation;
	transition:
		background-color var(--ff-transition-fast),
		border-color var(--ff-transition-fast),
		color var(--ff-transition-fast);
}

body .wp-element-button:hover,
body .wp-block-button__link:hover,
body .et_pb_button:hover,
body .search-submit:hover,
body .comment-form .submit:hover {
	border-color: transparent;
	background: var(--ff-color-accent-hover);
	color: var(--ff-color-accent-contrast);
}

.ff-button[aria-disabled="true"],
.ff-button:disabled,
body .wp-element-button:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

:where(.ff-form, .comment-form, .search-form, .et_pb_contact_form) label {
	display: inline-block;
	margin-block-end: var(--ff-space-2);
	color: var(--ff-color-text);
	font-weight: 650;
}

:where(.ff-form, .comment-form, .search-form, .et_pb_contact_form)
	:where(
		input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="hidden"]),
		select,
		textarea
	) {
	width: 100%;
	min-height: 2.75rem;
	padding: 0.7rem 0.8rem;
	border: 0.0625rem solid var(--ff-color-control-border);
	border-radius: var(--ff-radius-sm);
	background: var(--ff-color-surface);
	color: var(--ff-color-text);
	font: inherit;
	line-height: 1.35;
	transition:
		border-color var(--ff-transition-fast),
		box-shadow var(--ff-transition-fast);
}

:where(.ff-form, .comment-form, .search-form, .et_pb_contact_form)
	:where(
		input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="hidden"]),
		select,
		textarea
	):focus {
	border-color: var(--ff-color-focus);
	box-shadow: none;
}

:where(.ff-form, .comment-form, .search-form, .et_pb_contact_form) textarea {
	min-height: 8rem;
	resize: vertical;
}

/* Theme Builder system pages: product search results and 404 recovery. */
body.ff-system-page.et-tb-has-body .et-l--body {
	background: var(--ff-color-surface);
}

body.ff-system-page #page-container,
body.ff-system-page #et-boc {
	min-block-size: 100vh;
	min-block-size: 100dvh;
}

body.ff-system-page.et_fixed_nav.et_show_nav #page-container {
	padding-block-start: 0 !important;
}

body.ff-system-page #et-boc {
	display: flex;
	flex-direction: column;
}

body.ff-system-page #et-main-area {
	display: flex;
	min-block-size: 0;
	flex-direction: column;
}

body.ff-system-page #et-main-area,
body.ff-system-page #main-content {
	flex: 1 0 auto;
}

body.ff-system-page.et-tb-has-body .et-l--body .et_pb_section {
	padding-block: clamp(3rem, 6vw, 5.5rem);
}

body.ff-system-page.et-tb-has-body .et-l--body .et_pb_row {
	inline-size: min(calc(100% - (2 * var(--ff-gutter))), var(--ff-container-width)) !important;
	max-inline-size: none !important;
	padding: 0 !important;
	margin-inline: auto !important;
}

body.ff-system-page.et-tb-has-body .et-l--body .et_pb_column.et_flex_column,
body.ff-system-page.et-tb-has-body .et-l--body .et_pb_module.et_flex_module {
	--vertical-gap: 0px;
	row-gap: 0 !important;
}

body.ff-system-page.et-tb-has-body .et-l--body .et_pb_module {
	margin-block-end: 0;
}

/* 404: oversized, centered recovery content without requiring module classes. */
body.ff-not-found.et-tb-has-body .et-l--body .et_pb_section:first-child {
	min-block-size: clamp(26rem, 55vh, 36rem);
	padding-block: clamp(4rem, 7vw, 6rem);
}

body.ff-not-found.et-tb-has-body .et-l--body .et_pb_column {
	inline-size: min(100%, 52rem);
	max-inline-size: 52rem;
	margin-inline: auto !important;
	text-align: center;
}

body.ff-not-found.et-tb-has-body
	.et-l--body
	.et_pb_row:first-child
	> .et_pb_column:first-child {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) max-content max-content minmax(0, 1fr);
	column-gap: var(--ff-space-3);
	align-items: start;
}

body.ff-not-found.et-tb-has-body
	.et-l--body
	.et_pb_row:first-child
	> .et_pb_column:first-child
	> .et_pb_module {
	grid-column: 1 / -1;
}

body.ff-not-found.et-tb-has-body
	.et-l--body
	.et_pb_row:first-child
	> .et_pb_column:first-child
	> .et_pb_button_module_wrapper {
	grid-column: 2;
}

body.ff-not-found.et-tb-has-body
	.et-l--body
	.et_pb_row:first-child
	> .et_pb_column:first-child
	> .et_pb_button_module_wrapper
	+ .et_pb_button_module_wrapper {
	grid-column: 3;
}

body.ff-not-found.et-tb-has-body
	.et-l--body
	.et_pb_column
	> .et_pb_module:first-child
	:where(h1, h2, h3, h4, h5, h6, p):first-child {
	padding: 0 !important;
	margin: 0 !important;
	color: var(--ff-color-brand);
	font-family: var(--ff-font-sans);
	font-size: clamp(6rem, 16vw, 13rem) !important;
	font-weight: 800;
	line-height: 0.82;
	letter-spacing: -0.07em;
	text-align: center;
	text-transform: uppercase;
}

body.ff-not-found.et-tb-has-body .et-l--body h1,
body.ff-not-found.et-tb-has-body
	.et-l--body
	.et_pb_column
	> .et_pb_module:first-child
	+ .et_pb_heading
	:where(h1, h2),
body.ff-not-found.et-tb-has-body
	.et-l--body
	.et_pb_column
	> .et_pb_module:first-child
	+ .et_pb_text
	:where(h1, h2) {
	max-inline-size: 48rem;
	padding: 0 !important;
	margin: 0 auto !important;
	color: var(--ff-color-text);
	font-family: var(--ff-font-sans);
	font-size: clamp(2.5rem, 5vw, 4.75rem) !important;
	font-weight: 750;
	line-height: 1.04;
	letter-spacing: -0.045em;
	text-align: center;
	text-wrap: balance;
}

body.ff-not-found.et-tb-has-body
	.et-l--body
	.et_pb_column
	> .et_pb_module:first-child
	+ .et_pb_module {
	margin-block-start: var(--ff-space-5) !important;
}

body.ff-not-found.et-tb-has-body .et-l--body .et_pb_text {
	max-inline-size: 42rem;
	margin-block-start: var(--ff-space-5) !important;
	margin-inline: auto !important;
	color: var(--ff-color-text-muted);
	font-size: clamp(1rem, 1.4vw, 1.125rem);
	line-height: 1.65;
	text-align: center;
}

body.ff-not-found.et-tb-has-body .et-l--body .et_pb_text :last-child {
	margin-block-end: 0;
}

body.ff-not-found.et-tb-has-body .et-l--body .et_pb_button_module_wrapper {
	display: inline-block;
	margin-block-start: var(--ff-space-6) !important;
	margin-inline-end: 0;
}

body.ff-not-found.et-tb-has-body
	.et-l--body
	.et_pb_button_module_wrapper
	+ .et_pb_button_module_wrapper {
	margin-inline-end: 0;
}

body.ff-not-found.et-tb-has-body
	.et-l--body
	.et_pb_button_module_wrapper
	+ .et_pb_button_module_wrapper
	.et_pb_button {
	border-color: var(--ff-color-border);
	background: var(--ff-color-surface);
	color: var(--ff-color-brand-dark);
}

body.ff-not-found.et-tb-has-body
	.et-l--body
	.et_pb_button_module_wrapper
	+ .et_pb_button_module_wrapper
	.et_pb_button:hover {
	border-color: var(--ff-color-brand);
	background: var(--ff-color-surface-blue);
	color: var(--ff-color-brand-dark);
}

body.ff-not-found.et-tb-has-body .et-l--body .et_pb_blurb {
	padding: var(--ff-space-5);
	border: 0.0625rem solid var(--ff-color-border);
	border-radius: var(--ff-radius-md);
	background: var(--ff-color-surface);
	transition:
		border-color var(--ff-transition-fast),
		background-color var(--ff-transition-fast);
}

body.ff-not-found.et-tb-has-body .et-l--body .et_pb_blurb:hover {
	border-color: var(--ff-color-brand);
	background: var(--ff-color-surface-blue);
}

/* Product search: make Divi's current-loop Woo Products module match the storefront. */
body.ff-product-search.et-tb-has-body .et-l--body .et_pb_post_title {
	order: -3 !important;
	inline-size: 100%;
	padding: 0 !important;
}

body.ff-product-search.et-tb-has-body .et-l--body .et_pb_shop {
	order: -2 !important;
}

body.ff-product-search.et-tb-has-body
	.et-l--body
	:is(.et_pb_post_title .entry-title, h1) {
	inline-size: 100%;
	max-inline-size: none;
	padding: 0 !important;
	margin: 0 !important;
	color: var(--ff-color-text);
	font-family: var(--ff-font-sans);
	font-size: clamp(2rem, 2.75vw, 3rem) !important;
	font-weight: 750;
	line-height: 1.08;
	letter-spacing: -0.04em;
	text-wrap: balance;
}

body.ff-product-search.et-tb-has-body
	.et-l--body
	.et_pb_post_title
	:is(.et_pb_title_meta_container, .et_pb_title_featured_container) {
	display: none !important;
}

body.ff-product-search.et-tb-has-body .et-l--body .et_pb_shop {
	margin-block-start: clamp(2rem, 4vw, 3rem);
}

body.ff-product-search.et-tb-has-body
	.et-l--body
	.et_pb_shop
	> .woocommerce,
body.ff-product-search.et-tb-has-body
	.et-l--body
	.et_pb_shop
	> .et_pb_module_inner
	> .woocommerce {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: var(--ff-space-5) var(--ff-space-6);
}

body.ff-product-search.et-tb-has-body
	.et-l--body
	.et_pb_shop
	.woocommerce-result-count {
	align-self: center;
	margin: 0 !important;
	color: var(--ff-color-text-muted);
	font-size: 0.9375rem;
}

body.ff-product-search.et-tb-has-body
	.et-l--body
	.et_pb_shop
	.woocommerce-ordering {
	margin: 0 !important;
}

body.ff-product-search.et-tb-has-body
	.et-l--body
	.et_pb_shop
	.woocommerce-ordering
	select {
	min-block-size: 2.75rem;
	padding: 0.55rem 2.5rem 0.55rem 0.75rem;
	border: 0.0625rem solid var(--ff-color-control-border);
	border-radius: var(--ff-radius-sm);
	background-color: var(--ff-color-surface);
	color: var(--ff-color-text);
	font: inherit;
}

body.ff-product-search.et-tb-has-body .et-l--body .et_pb_shop ul.products,
body.ff-product-search.et-tb-has-body
	.et-l--body
	.et_pb_shop
	:is(.woocommerce-pagination, .woocommerce-info) {
	grid-column: 1 / -1;
}

body.ff-product-search.et-tb-has-body
	.et-l--body
	.et_pb_shop
	.woocommerce-info {
	padding: clamp(1rem, 2vw, 1.5rem) !important;
	margin: 0 !important;
	border: 0.0625rem solid var(--ff-color-border) !important;
	border-radius: var(--ff-radius-sm);
	box-shadow: none !important;
	background: var(--ff-color-surface-subtle, #f7f9fa) !important;
	color: var(--ff-color-text) !important;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.6;
	text-shadow: none !important;
}

body.ff-product-search.et-tb-has-body
	.et-l--body
	.et_pb_shop
	.woocommerce-info::before,
body.ff-product-search.et-tb-has-body
	.et-l--body
	.et_pb_shop
	.woocommerce-info::after {
	display: none !important;
	content: none !important;
}

body.ff-product-search.et-tb-has-body .et-l--body .et_pb_shop > .entry,
body.ff-product-search.et-tb-has-body
	.et-l--body
	.et_pb_shop
	> .et_pb_module_inner
	> .entry {
	inline-size: 100%;
	padding: clamp(1.5rem, 4vw, 2.5rem);
	border: 0.0625rem solid var(--ff-color-border);
	border-radius: var(--ff-radius-md);
	background: var(--ff-color-surface-blue);
	color: var(--ff-color-text);
}

body.ff-product-search.et-tb-has-body
	.et-l--body
	.et_pb_shop
	.entry
	.not-found-title {
	padding: 0 !important;
	margin: 0 !important;
	color: var(--ff-color-text);
	font-family: var(--ff-font-sans);
	font-size: clamp(1.5rem, 2.5vw, 2rem) !important;
	font-weight: 750;
	line-height: 1.2;
}

body.ff-product-search.et-tb-has-body .et-l--body .et_pb_shop .entry p {
	max-inline-size: 48rem;
	margin: var(--ff-space-3) 0 0 !important;
	color: var(--ff-color-text-muted);
	font-size: 1rem;
	line-height: 1.6;
}

body.ff-site-search.et-tb-has-body
	.et-l--body
	.et_pb_heading:has(+ .et_pb_blog) {
	order: -1 !important;
	margin-block-start: clamp(3rem, 6vw, 5rem) !important;
}

body.ff-site-search.et-tb-has-body
	.et-l--body
	.et_pb_heading:has(+ .et_pb_blog)
	:where(h2, .et_pb_module_heading) {
	padding: 0 !important;
	margin: 0 !important;
	color: var(--ff-color-text);
	font-family: var(--ff-font-sans);
	font-size: clamp(1.75rem, 2.5vw, 2.5rem) !important;
	font-weight: 750;
	line-height: 1.15;
	letter-spacing: -0.025em;
}

body.ff-site-search.et-tb-has-body .et-l--body .et_pb_blog {
	order: 0 !important;
	inline-size: 100%;
	margin-block-start: var(--ff-space-5) !important;
}

body.ff-site-search.et-tb-has-body
	.et-l--body
	.et_pb_blog:not(:has(.et_pb_post)) {
	display: none !important;
}

body.ff-site-search.et-tb-has-body
	.et-l--body
	.et_pb_heading:has(+ .et_pb_blog) {
	display: none !important;
}

body.ff-site-search.et-tb-has-body
	.et-l--body
	.et_pb_heading:has(+ .et_pb_blog .et_pb_post) {
	display: flex !important;
}

@media (max-width: 47.9375rem) {
	body.ff-system-page.et-tb-has-body .et-l--body .et_pb_section {
		padding-block: var(--ff-space-7);
	}

	body.ff-not-found.et-tb-has-body .et-l--body .et_pb_section:first-child {
		min-block-size: 0;
		padding-block: clamp(3rem, 14vw, 5rem);
	}

	body.ff-not-found.et-tb-has-body .et-l--body .et_pb_button_module_wrapper {
		display: block;
		inline-size: 100%;
		margin-block-start: var(--ff-space-4) !important;
		margin-inline-end: 0;
	}

	body.ff-not-found.et-tb-has-body
		.et-l--body
		.et_pb_row:first-child
		> .et_pb_column:first-child {
		grid-template-columns: minmax(0, 1fr);
	}

	body.ff-not-found.et-tb-has-body
		.et-l--body
		.et_pb_row:first-child
		> .et_pb_column:first-child
		> .et_pb_button_module_wrapper,
	body.ff-not-found.et-tb-has-body
		.et-l--body
		.et_pb_row:first-child
		> .et_pb_column:first-child
		> .et_pb_button_module_wrapper
		+ .et_pb_button_module_wrapper {
		grid-column: 1;
	}

	body.ff-not-found.et-tb-has-body
		.et-l--body
		.et_pb_button_module_wrapper
		.et_pb_button {
		inline-size: 100%;
	}

	body.ff-product-search.et-tb-has-body
		.et-l--body
		.et_pb_shop
		> .woocommerce,
	body.ff-product-search.et-tb-has-body
		.et-l--body
		.et_pb_shop
		> .et_pb_module_inner
		> .woocommerce {
		grid-template-columns: 1fr;
		gap: var(--ff-space-4);
	}

	body.ff-product-search.et-tb-has-body
		.et-l--body
		.et_pb_shop
		.woocommerce-ordering {
		inline-size: 100%;
	}

	body.ff-product-search.et-tb-has-body
		.et-l--body
		.et_pb_shop
		.woocommerce-ordering
		select {
		inline-size: 100%;
	}

}

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

	.ff-button,
	body .wp-element-button,
	body .wp-block-button__link,
	body .et_pb_button,
	body .search-submit,
	body .comment-form .submit,
	body.ff-not-found .et_pb_blurb,
	body.ff-site-search .et_pb_blog .entry-featured-image-url img,
	:where(.ff-form, .comment-form, .search-form, .et_pb_contact_form)
		:where(input, select, textarea) {
		transition-duration: 0.01ms;
	}
}