/* LASPNET Values */
.lsp-values { padding: 1rem 0; }

.lsp-values__head { max-width: 42rem; margin: 0 auto 3rem; text-align: center; }
.lsp-values__eyebrow {
	display: inline-flex; align-items: center; gap: .75rem; margin: 0 0 .75rem;
	font-size: .85rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
	color: var(--lsp-brand, #8f1d2c);
}
.lsp-values__eyebrow::before, .lsp-values__eyebrow::after { content: ""; width: 2rem; height: 3px; background: var(--lsp-gold, #f4b400); }
.lsp-values__heading {
	margin: 0 0 1rem; font-family: var(--lsp-font-display, Georgia, serif); font-weight: 400;
	font-size: clamp(1.8rem, 3.4vw, 2.6rem); line-height: 1.2; color: var(--lsp-ink, #241a1c);
}
.lsp-values__intro { margin: 0; font-size: 1.1rem; line-height: 1.6; color: color-mix(in srgb, var(--lsp-ink, #241a1c) 75%, #fff); }

.lsp-values__grid {
	display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.75rem;
	list-style: none; margin: 0; padding: 0;
}

.lsp-value {
	position: relative; display: flex; flex-direction: column; margin: 0; padding: 2.25rem 1.75rem 2rem; overflow: hidden;
	background: #fcfafa; border: 1px solid var(--lsp-line, #ddd9da); border-radius: 24px;
	box-shadow: 0 2px 8px rgba(38, 9, 15, .05);
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
/* Gold-to-brand accent bar that grows on hover */
.lsp-value::after {
	content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 5px;
	background: linear-gradient(90deg, var(--lsp-gold, #f4b400), var(--lsp-brand, #8f1d2c));
	transform: scaleX(.18); transform-origin: left; transition: transform .35s ease;
}
.lsp-value:hover, .lsp-value:focus-within {
	transform: translateY(-5px); border-color: transparent; box-shadow: 0 18px 36px rgba(38, 9, 15, .16);
}
.lsp-value:hover::after, .lsp-value:focus-within::after { transform: scaleX(1); }

.lsp-value__num {
	position: absolute; top: 1.1rem; right: 1.5rem;
	font-family: var(--lsp-font-display, Georgia, serif); font-size: 2.6rem; line-height: 1;
	color: var(--lsp-brand, #8f1d2c); opacity: .12; transition: opacity .25s ease;
}
.lsp-value:hover .lsp-value__num { opacity: .25; }

.lsp-value__icon {
	display: grid; place-items: center; width: 4.25rem; height: 4.25rem; margin-bottom: 1.4rem;
	border-radius: 50%; color: var(--lsp-brand, #8f1d2c); background: var(--lsp-brand-tint, #f6eaec);
	border: 3px solid var(--lsp-gold, #f4b400);
	transition: background .25s ease, color .25s ease;
}
.lsp-value:hover .lsp-value__icon { background: var(--lsp-brand-deep, #6b1521); color: #fff; }

.lsp-value__title {
	margin: 0 0 .6rem; font-family: var(--lsp-font-display, Georgia, serif); font-weight: 400;
	font-size: clamp(1.2rem, 1.8vw, 1.45rem); line-height: 1.25; color: var(--lsp-ink, #241a1c);
}
.lsp-value__text { margin: 0; line-height: 1.65; color: color-mix(in srgb, var(--lsp-ink, #241a1c) 78%, #fff); }

@media (max-width: 1024px) { .lsp-values__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
	.lsp-values__grid { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
	.lsp-values__head { margin-bottom: 2rem; }
}
@media (prefers-reduced-motion: reduce) {
	.lsp-value, .lsp-value::after, .lsp-value__icon, .lsp-value__num { transition: none; }
	.lsp-value:hover, .lsp-value:focus-within { transform: none; }
}
