/* site-form-pages.css */

/* The site's own rules for the form pages. Until May 2026 they lived in assets/css/form-pages.css; the form install
   replaced that file with the form product's stylesheet (never edit it per site), so they live here now, loaded right
   after form-pages.css on the pages that load it. Copied verbatim from the January file (restored 10-29-2026). */

.top-margin {
	margin-top: 6rem;
}

@media (max-width: 599px) {
	.top-margin {
		margin-top: 3rem;
	}
}

@media (min-width: 600px) and (max-width: 899px) {
	.top-margin {
		margin-top: 4rem;
	}
}

@media (min-width: 900px) {
	.top-margin {
		margin-top: 6rem;
	}
}

.button-red:hover,
.button-red:focus,
.button-red:active,
.button-red:visited {
	background-color: #dd4b39;
	border-color: #bb0000;
}

.services-list ul {
	color: #333333;
	font-size: 14px;
	font-size: 1.4rem;
	margin: 0;
	padding: 0 0 0 2em;
}

.services-list a:link {
	color: #0000cc;
	text-decoration: underline;
}

.services-list a:visited {
	color: #800080;
	text-decoration: underline;
}

.services-list a:hover {
	color: #0000ff;
	text-decoration: underline;
}

.services-list a:active {
	color: #cc0000;
	text-decoration: underline;
}

.CTA {
	font-family: "roboto_condensedregular", sans-serif;
	font-size: clamp(1.75rem, 2.4vw + 0.8rem, 2.5rem);
	font-weight: 600;
	line-height: clamp(1.2, 1.2 + 0.2vw, 1.5);
	color: #bb0000;
}

.CTA-phone {
	font-family: "roboto", sans-serif;
	font-size: clamp(2.5rem, 3vw + 1.2rem, 3rem);
	font-weight: 600;
	color: #bb0000;
	line-height: clamp(1, 1 + 0.5vw, 1.3);
}

.CTA-phone a:link {
	color: #3377bb;
	text-decoration: none;
}

.CTA-phone a:visited {
	color: #800080;
	text-decoration: none;
}

.CTA-phone a:hover {
	color: #0000ff;
	text-decoration: none;
}

.CTA-phone a:active {
	color: #cc0000;
	text-decoration: none;
}

.center {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/* Review card grid */
.reviews-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2rem;
	width: 100%;
	max-width: 1200px;
	margin: 2rem auto;
	padding: 0 1rem;
	box-sizing: border-box;
}

.review-card {
	border: 2px solid #ccc;
	border-radius: 10px;
	background: radial-gradient(circle at center, #ffffff 0%, #f5f5f5 100%);
	box-shadow: 0 2px 5px rgba(0,0,0,0.1);
	padding: 1.5rem;
	position: relative;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	overflow: visible;
}

.reviewer-name {
	font-weight: bold;
	font-size: 1.3rem;
	color: #5e5e5e;
	margin-bottom: 0.5rem;
}

.review-stars {
	color: #fbbc04;
	font-size: 1.8rem;
	margin-bottom: 1rem;
}

.review-text {
	font-size: 1.3rem;
	line-height: 1.6;
	color: #5e5e5e;
}

.full-text {
	display: none;
}

.review-text .more-link {
	color: #0000cc;
	text-decoration: none;
	font-weight: bold;
}

.review-text .more-link:hover {
	text-decoration: underline;
}

.review-card:hover {
	box-shadow: 0 4px 10px rgba(0,0,0,0.15);
}

@media (min-width: 600px) {
	.reviews-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 900px) {
	.reviews-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 520px) {
	.form-v2 .form-group.state-field,
	.form-v2 .form-group.zip-field,
	.form-v2 .form-group.budget-field {
		flex: 1;
	}
}
