﻿
.quick-answers {
	background: rgba(42,157,143,0.08);
	border-left: 4px solid var(--clr-accent);
	border-radius: 0.75rem;
	box-shadow: 0 2px 12px rgba(42,157,143,0.08);
	max-width: 470px;
	margin: 2rem auto 2.8rem auto;
	padding: 1.3rem 1.4rem 1.3rem 2rem;
	color: var(--clr-text);
}

	.quick-answers h2 {
		color: var(--clr-head);
		margin-bottom: 0.6rem;
		font-size: 1.08rem;
		font-weight: 700;
	}

	.quick-answers strong {
		color: var(--clr-accent);
		font-weight: 600;
		font-size: large;
	}

	.quick-answers ul {
		margin-left: 0;
		padding-left: 0.5rem;
		list-style: none;
	}

	.quick-answers li {
		margin-bottom: 0.5rem;
		font-size: 1rem;
		color: var(--clr-text);
	}

/* ────── Service Detail Card ────── */
.service-details {
	background: rgba(255,255,255,0.035);
	border-radius: 0.75rem;
	box-shadow: 0 4px 24px 0 rgba(0,0,0,0.18);
	max-width: 700px;
	margin: 2rem auto;
	padding: 2.2rem 1.6rem 2.1rem 1.6rem;
	font-size: 1.08rem;
}

	.service-details h2 {
		color: var(--clr-head);
		font-size: 1.18rem;
		font-weight: 700;
		margin-top: 2rem;
		margin-bottom: 0.85rem;
		border-bottom: 1px solid rgba(42,157,143,0.14);
		padding-bottom: 0.2rem;
		letter-spacing: 0.01em;
	}

		.service-details h2:first-child {
			margin-top: 0;
		}

	.service-details p {
		font-size: 1.08rem;
		color: var(--clr-text);
		margin-bottom: 1.15rem;
		line-height: 1.6;
	}

	/* Bulleted and numbered lists */
	.service-details ol,
	.service-details ul {
		margin: 0 0 1.5rem 1.5rem;
		padding-left: 0;
	}

	.service-details li {
		margin-bottom: 0.5rem;
		font-size: 1.04rem;
		color: var(--clr-text);
	}

	/* Special outcomes box */
	.service-details .outcomes-box {
		background: rgba(42,157,143,0.06);
		border-left: 4px solid var(--clr-accent);
		border-radius: 0.5rem;
		padding: 1rem 1.2rem;
		margin-top: 2.2rem;
		color: var(--clr-text);
	}

/* Included Features Grid (optional, for “What’s Included”) */
.included-services {
	margin: 2rem 0 2.5rem 0;
	max-width: 700px;
	padding: 1.1rem 0;
}

	.included-services h2 {
		color: var(--clr-head);
		margin-bottom: 1.1rem;
		font-size: 1.15rem;
		font-weight: 700;
		text-align: left;
	}

.included-services-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px,1fr));
	gap: 1.1rem;
}

.feature-card {
	background: rgba(255,255,255,0.025);
	border-radius: 0.5rem;
	box-shadow: 0 2px 10px rgba(42,157,143,0.07);
	padding: 1.1rem 1rem;
	text-align: left;
	color: var(--clr-text);
	border-left: 4px solid var(--clr-accent);
	transition: box-shadow 0.14s, transform 0.14s;
}

	.feature-card:hover {
		box-shadow: 0 4px 18px 0 rgba(42,157,143,0.18);
		transform: translateY(-2px) scale(1.013);
	}

.feature-icon {
	font-size: 1.1rem;
	margin-bottom: 0.5rem;
	color: var(--clr-accent);
}

.feature-card h3 {
	color: var(--clr-head);
	margin: 0 0 0.3rem 0;
	font-size: 1.05rem;
	font-weight: 600;
}

.feature-card p {
	font-size: 0.98rem;
	margin: 0;
	color: var(--clr-text);
}

/* CTA Buttons (reuse main style) */
.cta-button {
	background: var(--clr-accent);
	color: #fff;
	border-radius: 999px;
	border: none;
	font-weight: 700;
	letter-spacing: 0.01em;
	transition: background 0.2s, transform 0.18s;
	padding: 0.77rem 2.25rem;
	display: block;
	width: max-content;
	margin: 2.2rem auto 0 auto;
	box-shadow: 0 2px 12px 0 rgba(42,157,143,0.12);
	font-size: 1rem;
}

	.cta-button:hover,
	.cta-button:focus {
		background: #21867a;
		color: #fff;
		transform: translateY(-2px) scale(1.04);
	}

/* Responsive */
@media (max-width: 700px) {
	.service-hero,
	.service-details,
	.quick-answers {
		padding: 1.3rem 0.6rem;
		max-width: 99vw;
	}

	.included-services-grid {
		grid-template-columns: 1fr;
	}
}
body, h1, h2, h3, h4, h5, h6, p, li, input, textarea, button {
	font-family: 'Inter', system-ui, sans-serif !important;
}
.service-details ul li {
	position: relative;
	padding-left: 1.5rem;
	margin-bottom: 0.6rem;
}

	.service-details ul li::before {
		content: '';
		position: absolute;
		left: 0.2rem;
		top: 0.7em;
		transform: translateY(-50%);
		width: 0.55em; /* Smaller */
		height: 0.55em; /* Smaller */
		border-radius: 50%;
		background: var(--clr-accent);
		box-shadow: 0 0 0 2px rgba(42,157,143,0.08);
	}

.service-details ol {
	counter-reset: step;
	list-style: none;
	padding-left: 0;
	margin-left: 0;
}

	.service-details ol li {
		position: relative;
		padding-left: 1.7em;
		margin-bottom: 0.65em;
	}

		.service-details ol li::before {
			counter-increment: step;
			content: counter(step) ".";
			position: absolute;
			left: 0;
			top: 0;
			color: var(--clr-accent);
			font-weight: 700;
			font-size: 1.15em;
			font-family: 'Inter', system-ui, sans-serif;
			letter-spacing: 0.01em;
			/* Optional underline for style: */
			/* text-decoration: underline; */
		}

