.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.6rem;
	padding: 0.95rem 1.4rem;
	border-radius: 12px;
	text-decoration: none;
	font-weight: 700;
	letter-spacing: 0.02em;
	border: 1px solid transparent;
	transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease, border-color 0.18s ease;
	white-space: nowrap;
}

.btn-primary {
	background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
	color: var(--white);
	box-shadow: 0 14px 34px rgba(11, 45, 91, 0.22);
}

.btn-primary:hover {
	transform: translateY(-2px);
	box-shadow: 0 20px 46px rgba(11, 45, 91, 0.30);
}

.btn-secondary {
	background: var(--white);
	border-color: rgba(197, 207, 221, 0.95);
	color: var(--gray-900);
}

.btn-secondary:hover {
	transform: translateY(-2px);
	border-color: rgba(29, 78, 216, 0.45);
	box-shadow: 0 16px 36px rgba(11, 18, 32, 0.12);
}

.btn-outline {
	background: transparent;
	border-color: rgba(11, 45, 91, 0.55);
	color: var(--gray-900);
}

.btn-outline:hover {
	transform: translateY(-2px);
	background: rgba(11, 45, 91, 0.10);
	box-shadow: 0 18px 36px rgba(11, 45, 91, 0.14);
}

.btn-lg { padding: 1.05rem 1.75rem; font-size: 1.05rem; }

.badge {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.55rem 1rem;
	border-radius: 999px;
	background: linear-gradient(90deg, var(--primary-soft), var(--accent-soft));
	border: 1px solid rgba(197, 207, 221, 0.95);
	color: var(--gray-800);
	font-weight: 700;
	font-size: 0.85rem;
	letter-spacing: 0.03em;
}

/* Responsive Button Styles */
@media (max-width: 640px) {
	.btn {
		padding: 0.875rem 1.25rem;
		font-size: 0.9375rem;
	}
	
	.btn-lg {
		padding: 0.9375rem 1.5rem;
		font-size: 1rem;
	}
}

@media (max-width: 480px) {
	.btn {
		padding: 0.8125rem 1.125rem;
		font-size: 0.875rem;
		gap: 0.5rem;
	}
	
	.btn-lg {
		padding: 0.875rem 1.375rem;
		font-size: 0.9375rem;
	}
	
	.badge {
		padding: 0.5rem 0.875rem;
		font-size: 0.8125rem;
	}
}