/*
 * Marketing page templates (templates/template-{services,reviews,packages,
 * checklist,deals,faq}.php). Builds on tokens.css and the shared section
 * shells in home.css, which is enqueued alongside this file on these
 * templates.
 */

/* ---- Page head (reviews, packages, deals) ---- */

/* ---- Packages: contents list ---- */

.packages-toc {
	margin-top: var(--bhc-space-2);
}

.marketing .packages-toc__heading {
	margin: 0 0 var(--bhc-space-1);
	font-size: var(--bhc-size-h4);
	text-align: left;
}

.packages-toc ul {
	margin: 0;
	padding-left: 1.25em;
}

.packages-toc li {
	margin-bottom: 0.375em;
	color: var(--bhc-color-muted);
}

.packages-toc a {
	color: var(--bhc-color-brand-dark);
}

/* ---- Packages: checklist toggles ---- */

.marketing--packages .packages {
	padding-top: 0;
}

.packages__inner {
	max-width: var(--bhc-maxw-wide);
	margin-inline: auto;
}

.packages__toggle {
	border-bottom: 1px solid var(--bhc-color-line);
}

.packages__summary {
	position: relative;
	padding: var(--bhc-space-2) var(--bhc-space-4) var(--bhc-space-2) 0;
	list-style: none;
	cursor: pointer;
}

.packages__summary::-webkit-details-marker {
	display: none;
}

.packages__summary::after {
	content: "+";
	position: absolute;
	top: 50%;
	right: 0.25rem;
	color: var(--bhc-color-label);
	font-size: 1.75rem;
	font-weight: 400;
	line-height: 1;
	transform: translateY(-50%);
}

.packages__toggle[open] > .packages__summary::after {
	content: "\2212";
}

.marketing .packages__title {
	display: inline;
	margin: 0;
	font-size: var(--bhc-size-h2);
	text-align: left;
}

.packages__summary:hover .packages__title,
.packages__summary:focus-visible .packages__title {
	color: var(--bhc-color-brand-dark);
}

.packages__summary:focus-visible {
	outline: 2px solid var(--bhc-color-brand);
	outline-offset: 2px;
}

.packages__content {
	padding: 0 0 var(--bhc-space-3);
}

.packages__content p {
	max-width: var(--bhc-maxw-prose);
	text-align: left;
}

.marketing .packages__content h3 {
	margin: var(--bhc-space-3) 0 var(--bhc-space-1);
	text-align: left;
}

/* ---- Checklist items (packages toggles + checklist child pages) ---- */

.checklist__items {
	margin: 0 0 var(--bhc-space-2);
	padding-left: 1.25em;
	color: var(--bhc-color-muted);
	line-height: 1.75;
	columns: 2 22em;
	column-gap: var(--bhc-space-4);
}

.checklist__items li {
	margin-bottom: 0.25em;
	break-inside: avoid;
}

/* ---- Checklist child pages ---- */

.checklist__inner {
	max-width: var(--bhc-maxw-prose);
	margin-inline: auto;
}

.marketing .checklist__title {
	margin: 0 0 var(--bhc-space-3);
	color: var(--bhc-color-heading);
	font-size: var(--bhc-size-h1);
	font-weight: 700;
	line-height: 1.15;
	text-align: left;
}

.marketing .checklist h3 {
	margin: var(--bhc-space-3) 0 var(--bhc-space-1);
	text-align: left;
}

/* ---- Reviews: full-page collection ---- */

.marketing--reviews .page-head {
	padding-bottom: 0;
}

.reviews-page {
	padding-top: var(--bhc-space-3);
}

.reviews-page__embed {
	max-width: var(--bhc-maxw-mid);
	margin-inline: auto;
}

.reviews-page__embed img {
	max-width: 100%;
	height: auto;
}

/* ---- Estimate band ---- */

.estimate__inner {
	max-width: var(--bhc-maxw-mid);
	margin-inline: auto;
}

.estimate__form {
	margin-top: var(--bhc-space-3);
	padding: var(--bhc-space-3);
	background: var(--bhc-color-paper);
	border: 1px solid var(--bhc-color-line);
	border-radius: var(--bhc-radius);
	box-shadow: var(--bhc-shadow-card);
}

.estimate__fallback {
	margin-top: var(--bhc-space-3);
	text-align: center;
}

.estimate__fallback p {
	margin-bottom: var(--bhc-space-2);
}

.marketing .estimate__tagline {
	margin: var(--bhc-space-3) 0 0;
	color: var(--bhc-color-muted);
	font-size: var(--bhc-size-small);
	text-align: center;
}

.marketing .estimate__disclaimer {
	max-width: 62em;
	margin: var(--bhc-space-2) auto 0;
	color: var(--bhc-color-label);
	font-size: var(--bhc-size-fine);
	text-align: center;
}

.estimate__disclaimer a {
	color: inherit;
	text-decoration: underline;
}

/* ---- Deals ---- */

.deals {
	padding-top: var(--bhc-space-4);
}

.deals__inner {
	max-width: var(--bhc-maxw-mid);
	margin-inline: auto;
}

.marketing .deals__empty {
	margin: 0;
	color: var(--bhc-color-muted);
	font-size: var(--bhc-size-lead);
	text-align: center;
}

.deal-card {
	display: grid;
	grid-template-columns: minmax(0, 3fr) minmax(0, 7fr);
	overflow: hidden;
	margin-bottom: var(--bhc-space-3);
	background: var(--bhc-color-paper);
	border: 1px solid var(--bhc-color-line);
	border-radius: var(--bhc-radius);
	box-shadow: var(--bhc-shadow-card);
}

.deal-card__visual {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-height: 220px;
	padding: var(--bhc-space-3);
	background: var(--bhc-color-surface);
	text-align: center;
}

.deal-card__visual--image {
	padding: 0;
}

.deal-card__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.deal-card__percent {
	color: var(--bhc-color-brand);
	font-size: var(--bhc-size-h1);
	font-weight: 800;
	line-height: 1;
}

.deal-card__percent-label {
	margin-top: var(--bhc-space-1);
	color: var(--bhc-color-brand-dark);
	font-size: var(--bhc-size-h4);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.deal-card__icon {
	width: 128px;
	height: auto;
}

.deal-card__body {
	padding: var(--bhc-space-4);
	text-align: left;
}

.marketing .deal-card__title {
	margin: 0 0 var(--bhc-space-1);
	color: var(--bhc-color-brand-dark);
	font-size: var(--bhc-size-h2);
	text-align: left;
}

.marketing .deal-card__sub {
	margin: 0 0 var(--bhc-space-2);
	color: var(--bhc-color-heading);
	font-size: var(--bhc-size-body);
	font-weight: 700;
}

.deal-card__desc {
	color: var(--bhc-color-muted);
}

.deal-card__desc p {
	max-width: none;
	margin: 0 0 var(--bhc-space-2);
	text-align: left;
}

.deal-card__claim {
	margin: var(--bhc-space-2) 0;
}

.deal-card__claim form {
	display: flex;
	flex-wrap: wrap;
	gap: var(--bhc-space-2);
	align-items: flex-start;
}

.deal-card__claim .gform-body {
	flex: 1 1 260px;
	min-width: 0;
}

.deal-card__claim .gform-theme--framework .gform_footer {
	flex: 0 0 auto;
	margin: 0;
	padding: 0;
}

.deal-card__claim .gform-theme.gform-theme--framework .gform_footer:not(:has(.gform_previous_button, .gform_next_button)) button[type="submit"].gform_button {
	width: auto;
}

.deal-card__tags {
	display: flex;
	flex-wrap: wrap;
	gap: var(--bhc-space-1);
	margin: 0 0 var(--bhc-space-2);
	padding: 0;
	list-style: none;
}

.deal-card__tags li {
	padding: 0.2em 0.7em;
	background: var(--bhc-color-surface);
	border-radius: 999px;
	color: var(--bhc-color-label);
	font-size: var(--bhc-size-label);
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.marketing .deal-card__terms {
	max-width: none;
	margin: var(--bhc-space-2) 0 0;
	color: var(--bhc-color-label);
	font-size: var(--bhc-size-fine);
	line-height: 1.5;
	text-align: left;
}

@media (max-width: 767px) {
	.deal-card {
		grid-template-columns: minmax(0, 1fr);
	}

	.deal-card__visual {
		min-height: 150px;
	}

	.deal-card__visual--image {
		aspect-ratio: 16 / 9;
		min-height: 0;
	}

	.deal-card__body {
		padding: var(--bhc-space-3);
	}

	.deal-card__claim .gform-theme--framework .gform_footer {
		flex-basis: 100%;
	}

	.deal-card__claim .gform-theme.gform-theme--framework .gform_footer:not(:has(.gform_previous_button, .gform_next_button)) button[type="submit"].gform_button {
		width: 100%;
	}
}

.deals-signup__card {
	max-width: 720px;
	margin-inline: auto;
	padding: var(--bhc-space-4) var(--bhc-space-3);
	background: var(--bhc-color-paper);
	border: 1px solid var(--bhc-color-line);
	border-radius: var(--bhc-radius);
	box-shadow: var(--bhc-shadow-card);
	text-align: center;
}

.marketing .deals-signup__title {
	margin-bottom: var(--bhc-space-1);
	color: var(--bhc-color-brand-dark);
}

.deals-signup__card p {
	max-width: 34em;
	margin-inline: auto;
}

.deals-signup__form {
	margin-top: var(--bhc-space-3);
	text-align: left;
}

.deals-signup__cta {
	margin-top: var(--bhc-space-3);
}

/* ---- FAQ ---- */

.faq-intro {
	padding-bottom: 0;
}

.faq-intro p {
	max-width: var(--bhc-maxw-prose);
	margin-inline: auto;
	text-align: left;
}

.faq-intro a {
	color: var(--bhc-color-brand-dark);
}

.marketing--faq .faqs__answer p {
	max-width: none;
	text-align: left;
}