/* Design-parity pass #8 (employer-side pages — Pricing) — Indeed.com clone
 * initiative. The 3 employer plan tiers ("Plans for employers") were flat
 * H3-then-list content with zero visual structure — just bare stacked text,
 * same category of bug as earlier passes' unstyled content. Content edit
 * (page 20) wrapped each tier in .gaj-pricing-card / .gaj-pricing-grid divs,
 * text unchanged; this stylesheet gives them a 3-column pricing-card layout
 * with the middle tier highlighted, matching the long-standing SaaS/employer-
 * marketing tiered-pricing pattern. CSS-only beyond the wrapper divs, gated
 * to this page ID only. */

.gaj-pricing-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	margin: 24px 0 32px;
	align-items: start;
}
.gaj-pricing-card {
	background: #fff;
	border: 1px solid #e6e8ee;
	border-radius: 8px;
	padding: 24px;
	box-shadow: 0 1px 2px rgba(26, 26, 46, 0.04);
}
.gaj-pricing-card h3 {
	margin-top: 0;
	color: #1a1a2e;
}
.gaj-pricing-card ul {
	margin-bottom: 20px;
}
.gaj-pricing-card-featured {
	border: 2px solid #675cff;
	box-shadow: 0 4px 14px rgba(103, 92, 255, 0.15);
	position: relative;
}
.gaj-pricing-badge {
	display: inline-block;
	background: #675cff;
	color: #fff;
	font-size: 0.75em;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	padding: 4px 10px;
	border-radius: 4px;
	margin: 0 0 12px;
}
.gaj-pricing-card .gaj-pricing-cta {
	display: block;
	text-align: center;
}

@media (max-width: 900px) {
	.gaj-pricing-grid {
		grid-template-columns: 1fr;
	}
}