/* =========================================================================
   The location + service pages.

   Three bands these pages introduce that the rest of the site does not have:
   the two-card "basics" row, the key-features grid, and the three-across
   benefits grid. Everything else on the page is the site's existing furniture.

   Lifted from the approved mockups, which carry their CSS inline; only the
   `lsv-*` rules are taken, because the other 45KB of that inline block is the
   site's own stylesheet repeated back.
   ========================================================================= */

/* Two cards side by side: what the service means, and what it involves. */
.lsv-duo {
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:18px;
	margin-top:34px;
}

.lsv-card {
	background:#fff;
	border:1px solid var(--border-light);
	border-left:3px solid var(--accent);
	border-radius:14px;
	padding:28px 30px;
	box-shadow:0 14px 34px rgba(1,19,33,.08);
}

.lsv-card h3 {
	font-size:1.22rem;
	margin-bottom:10px;
}

.lsv-card p {
	color:var(--body-dark);
	font-size:.97rem;
	line-height:1.7;
	margin-bottom:10px;
}

.lsv-card p:last-child {
	margin-bottom:0;
}

.lsv-b3 {
	grid-template-columns:repeat(3,minmax(0,1fr));
}

.lsv-feat {
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:18px;
	margin-top:34px;
}

.lsv-intro-sub {
	max-width:820px;
	margin:-18px auto 0;
	text-align:center;
	color:var(--muted);
	font-size:1rem;
}

/* One column on a phone. minmax(0, 1fr) rather than 1fr, so a long unbroken
   word cannot push the column wider than the screen. */
@media (max-width: 900px) {
	.lsv-duo,
	.lsv-feat,
	.lsv-b3 {
		grid-template-columns: minmax(0, 1fr);
	}
}