/* Freshen Homes — service-tabs presentation.
 *
 * Visual treatment for Bold Builder "filled / round" tabs, applied site-wide so
 * every service page (AC & HVAC, Deep Cleaning, Home Maintenance, Prices, …)
 * shares the same card. HVAC-only accents — the icon set and the bottom strip
 * tagline — stay scoped to the AC & HVAC page (.page-id-2134) at the end. */

/* ============================================================================
 * Shared styling — all filled/round service-tabs blocks, any page.
 * ========================================================================== */

/* Section background: soft white so the white service card floats on its shadow.
 * The eyebrow + headline in these sections are white by default on the original
 * dark scheme, so they're re-colored dark/brand below to stay legible. */
.bt_bb_section:has(.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round) {
	background-color: #eef4f1 !important;
	background-image:
		radial-gradient(120% 80% at 50% -12%, #ffffff 0%, transparent 60%),
		radial-gradient(90% 70% at 92% 112%, rgba(85, 190, 181, .10) 0%, transparent 55%),
		linear-gradient(160deg, #f1f6f3 0%, #e6efea 100%) !important;
}

.bt_bb_section:has(.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round) .bt_bb_headline_superheadline {
	color: #2f9c93 !important;
}

.bt_bb_section:has(.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round) > .bt_bb_port > .bt_bb_cell .bt_bb_headline_tag,
.bt_bb_section:has(.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round) > .bt_bb_port > .bt_bb_cell .bt_bb_headline_tag .bt_bb_headline_content,
.bt_bb_section:has(.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round) > .bt_bb_port > .bt_bb_cell .bt_bb_headline_tag .bt_bb_headline_content span {
	color: #16302b !important;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round {
	--fh-green: #98c93f;
	--fh-green-dark: #78bd66;
	--fh-teal: #55beb5;
	--fh-teal-dark: #42aca8;
	--fh-ink: #20282b;
	--fh-copy: #465458;
	--fh-line: #dce9e5;
	box-sizing: border-box;
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 30px 30px;
	background: #fbfcf9 !important;
	border: 1px solid rgba(25, 53, 43, .08);
	border-radius: 54px;
	box-shadow: 0 22px 55px rgba(25, 53, 43, .16);
	overflow: hidden;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round ul.bt_bb_tabs_header {
	display: flex;
	align-items: stretch;
	gap: 6px;
	margin: 0 0 8px !important;
	padding: 0 12px !important;
	background: transparent !important;
	border: 0 !important;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round ul.bt_bb_tabs_header::after {
	display: none !important;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round ul.bt_bb_tabs_header li {
	flex: 0 1 auto;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
}

/* Remove Qleen's decorative green/teal wings around the selected tab. */
.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round ul.bt_bb_tabs_header li::before,
.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round ul.bt_bb_tabs_header li::after {
	display: none !important;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round ul.bt_bb_tabs_header li span.bt_bb_tab_title {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 70px;
	padding: 15px 26px !important;
	color: var(--fh-ink) !important;
	font-size: 17px !important;
	font-weight: 700 !important;
	line-height: 1.15;
	background: #fff !important;
	border: 1px solid #d8dfda !important;
	border-bottom: 0 !important;
	border-radius: 12px 12px 0 0 !important;
	box-shadow: 0 -2px 8px rgba(25, 53, 43, .04);
	transition: color .2s ease, background .2s ease, border-color .2s ease;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round ul.bt_bb_tabs_header li.on span.bt_bb_tab_title,
.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round ul.bt_bb_tabs_header li:hover span.bt_bb_tab_title {
	color: #fff !important;
	background: linear-gradient(100deg, var(--fh-teal) 0%, #72c687 48%, var(--fh-green) 100%) !important;
	border-color: #70c39a !important;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tabs_tabs {
	position: relative;
	background: #fff !important;
	border: 1px solid rgba(25, 53, 43, .08);
	border-radius: 16px 16px 34px 34px;
	box-shadow: 0 10px 28px rgba(25, 53, 43, .09);
	overflow: hidden;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item {
	padding: 12px 28px 10px !important;
	background: #fff !important;
}

/* Bold Builder uses height: 0 for inactive panels. Padding on a zero-height
 * panel can still expose clipped content, so remove it from layout entirely. */
.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tabs_tabs > .bt_bb_tab_item:not(.on) {
	display: none !important;
	height: 0 !important;
	padding: 0 !important;
	visibility: hidden !important;
	overflow: hidden !important;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tabs_tabs > .bt_bb_tab_item.on {
	display: block !important;
	height: auto !important;
	visibility: visible !important;
	overflow: visible !important;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item > .bt_bb_row_inner {
	position: relative;
	box-sizing: border-box;
	min-height: 118px;
	padding: 17px 0 17px 112px;
	align-items: center;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item > .bt_bb_row_inner::before {
	content: "\2302";
	position: absolute;
	left: 4px;
	top: 50%;
	display: grid;
	place-items: center;
	width: 78px;
	height: 78px;
	color: var(--fh-teal);
	font-size: 39px;
	font-weight: 400;
	line-height: 1;
	background: #f2f8f7;
	border-radius: 50%;
	transform: translateY(-50%);
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item > .bt_bb_row_inner::after {
	content: "";
	position: absolute;
	left: 96px;
	top: 28px;
	bottom: 28px;
	width: 2px;
	background: linear-gradient(#a8d567, var(--fh-green));
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item > .bt_bb_row_inner .bt_bb_column_inner {
	display: flex;
	align-items: center;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item > .bt_bb_row_inner .bt_bb_column_inner_content,
.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item > .bt_bb_row_inner .bt_bb_column_inner_content_inner {
	width: 100%;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item .bt_bb_headline h4 {
	color: var(--fh-ink) !important;
	font-size: 18px !important;
	font-weight: 750 !important;
	line-height: 1.25 !important;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item .bt_bb_icon {
	--primary-color: var(--fh-copy) !important;
	--secondary-color: var(--fh-teal) !important;
	color: var(--fh-copy) !important;
	font-size: 14px !important;
	line-height: 1.38 !important;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item .bt_bb_icon_holder {
	color: var(--fh-teal) !important;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item .bt_bb_icon_holder span {
	color: var(--fh-copy) !important;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item > .bt_bb_separator_v2 {
	margin: 0 !important;
	opacity: 1 !important;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item > .bt_bb_separator_v2 .bt_bb_separator_v2_inner_before,
.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item > .bt_bb_separator_v2 .bt_bb_separator_v2_inner_after {
	border-color: var(--fh-line) !important;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_price {
	text-align: center;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_price .bt_bb_price_container {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	min-width: 190px;
	padding: 0 !important;
	background: linear-gradient(100deg, var(--fh-green-dark) 0%, #61be86 48%, var(--fh-teal-dark) 100%) !important;
	border-radius: 999px !important;
	box-shadow: 0 7px 16px rgba(66, 172, 168, .22);
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_price .bt_bb_price_price {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 22px !important;
	color: #fff !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_price .bt_bb_price_price::before {
	content: "";
	box-sizing: border-box;
	width: 16px;
	height: 19px;
	border: 2px solid currentColor;
	border-radius: 2px;
	background:
		linear-gradient(currentColor, currentColor) 50% 5px / 8px 2px no-repeat,
		linear-gradient(currentColor, currentColor) 50% 9px / 8px 2px no-repeat,
		linear-gradient(currentColor, currentColor) 50% 13px / 8px 2px no-repeat;
	flex: 0 0 16px;
}

.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_price .bt_bb_price_price::after {
	display: none !important;
}

@media (max-width: 900px) {
	.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round {
		padding: 0 18px 22px;
		border-radius: 32px;
	}

	.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round ul.bt_bb_tabs_header {
		overflow-x: auto;
		padding: 0 !important;
		scrollbar-width: thin;
	}

	.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round ul.bt_bb_tabs_header li {
		flex: 0 0 auto;
	}

	.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round ul.bt_bb_tabs_header li span.bt_bb_tab_title {
		min-height: 60px;
		padding: 12px 18px !important;
		font-size: 15px !important;
	}

	.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item {
		padding: 8px 18px !important;
	}

	.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item > .bt_bb_row_inner {
		display: grid;
		grid-template-columns: 1fr;
		gap: 8px;
		padding: 24px 0 24px 82px;
	}

	.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item > .bt_bb_row_inner::before {
		left: 0;
		width: 62px;
		height: 62px;
		font-size: 30px;
	}

	.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item > .bt_bb_row_inner::after {
		display: none;
	}

	.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item > .bt_bb_row_inner .bt_bb_column_inner {
		width: 100% !important;
		max-width: none !important;
	}

	.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_price {
		text-align: left;
	}

	.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_price .bt_bb_price_container {
		min-width: 170px;
	}
}

@media (max-width: 520px) {
	.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round {
		padding: 0 10px 14px;
		border-radius: 22px;
	}

	.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tabs_tabs {
		border-radius: 12px 12px 18px 18px;
	}

	.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item {
		padding: 4px 14px !important;
	}

	.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item > .bt_bb_row_inner {
		padding-left: 0;
		padding-top: 92px;
		text-align: center;
	}

	.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_tab_item > .bt_bb_row_inner::before {
		left: 50%;
		top: 18px;
		transform: translateX(-50%);
	}

	.bt_bb_tabs.bt_bb_style_filled.bt_bb_shape_round .bt_bb_price {
		text-align: center;
	}
}

/* ============================================================================
 * HVAC-only accents — AC & HVAC Services page (ID 2134) only.
 * The tab icon set and the bottom tagline strip are specific to that page's
 * three services; other service pages keep their own labels and stay clean.
 * ========================================================================== */

.page-id-2134 .bt_bb_tabs ul.bt_bb_tabs_header li span.bt_bb_tab_title::before {
	display: grid;
	place-items: center;
	width: 28px;
	height: 28px;
	color: var(--fh-teal);
	font-size: 25px;
	font-weight: 400;
	line-height: 1;
}

.page-id-2134 .bt_bb_tabs ul.bt_bb_tabs_header li:nth-child(1) span::before { content: "\2744"; }
.page-id-2134 .bt_bb_tabs ul.bt_bb_tabs_header li:nth-child(2) span::before { content: "\2692"; }
.page-id-2134 .bt_bb_tabs ul.bt_bb_tabs_header li:nth-child(3) span::before { content: "\2747"; }

.page-id-2134 .bt_bb_tabs ul.bt_bb_tabs_header li.on span.bt_bb_tab_title::before,
.page-id-2134 .bt_bb_tabs ul.bt_bb_tabs_header li:hover span.bt_bb_tab_title::before {
	color: #fff;
}

.page-id-2134 .bt_bb_tabs .bt_bb_tabs_tabs::after {
	content: "\25C7  Cleaner Air. Better Health. Greater Comfort.";
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: 38px;
	padding: 8px 20px;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .01em;
	background: linear-gradient(100deg, var(--fh-teal) 0%, #69c49a 52%, var(--fh-green) 100%);
}