/* =========================================================================
   LOCAL PAYMENTS
   ========================================================================= */
.lp-bg { background: linear-gradient(160deg, var(--bg-3) 0%, var(--bg) 60%, var(--bg-2) 100%); }
.lp-ring { width: 700px; height: 700px; top: 50%; left: 50%; transform: translate(-50%,-50%); border: 1px solid rgba(4,120,87,0.04); }
.lp-glow { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 800px; height: 400px; border-radius: var(--r-pill); background: radial-gradient(ellipse, rgba(4,120,87,0.06) 0%, transparent 65%); pointer-events: none; }

.lp-grid { display: grid; grid-template-columns: 1fr; gap: 1.25rem; }
@media (min-width: 640px) { .lp-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .lp-grid { grid-template-columns: repeat(3, 1fr); } }

.lp-card { padding: 1.5rem; display: flex; flex-direction: column; gap: 1rem; height: 100%; position: relative; overflow: hidden; }
.lp-card::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 2px; background: linear-gradient(to right, var(--c, #047857), transparent); opacity: 0.4; }
.lp-card:hover { border-color: color-mix(in srgb, var(--c) 30%, transparent); }

.lp-card-head { display: flex; align-items: center; gap: 0.75rem; }
.lp-card-info { flex: 1; min-width: 0; }
.lp-name { font-weight: 700; color: var(--text-strong); font-size: var(--text-md); }
.lp-type { font-size: var(--text-xs); color: var(--text-2); }

.lp-badge {
	font-size: var(--text-2xs); font-weight: 700; text-transform: uppercase; letter-spacing: var(--ls-wide);
	padding: 0.2rem 0.5rem; border-radius: var(--r-pill);
	background: color-mix(in srgb, var(--c) 10%, transparent);
	color: var(--c);
	border: 1px solid color-mix(in srgb, var(--c) 20%, transparent);
	white-space: nowrap;
}

.lp-meta { display: flex; gap: 0.75rem; }
.lp-meta-item { display: flex; align-items: center; gap: 0.35rem; font-size: var(--text-xs); color: var(--text-2); }
.lp-meta-item svg { color: var(--c, var(--green)); }

.lp-steps { display: flex; flex-direction: column; gap: 0.5rem; margin: 0; padding: 0; list-style: none; }
.lp-steps li { display: flex; align-items: flex-start; gap: 0.5rem; font-size: var(--text-xs); color: var(--text); line-height: 1.4; }
.lp-step-num {
	width: 1.25rem; height: 1.25rem; border-radius: var(--r-circle); flex-shrink: 0;
	display: flex; align-items: center; justify-content: center;
	font-size: var(--text-2xs); font-weight: 700;
	background: color-mix(in srgb, var(--c) 12%, transparent);
	color: var(--c); border: 1px solid color-mix(in srgb, var(--c) 20%, transparent);
}

.lp-note { display: flex; align-items: flex-start; gap: 0.625rem; margin-top: 2.5rem; padding: 1rem 1.25rem; border-radius: var(--r); background: rgba(4,120,87,0.04); border: 1px solid rgba(4,120,87,0.1); color: var(--text-2); font-size: var(--text-sm); line-height: 1.6; }
.lp-note svg { color: var(--green); flex-shrink: 0; margin-top: 2px; }