/*    5. BUTTONS
   ------------------------------------------- */
.btn {
	display: inline-block;
	padding: 14px 32px;
	font-family: var(--font-body);
	font-size: var(--text-sm);
	font-weight: 600;
	text-align: center;
	border: 2px solid transparent;
	border-radius: var(--radius-md);
	cursor: pointer;
	transition: all var(--transition-base);
	line-height: 1.4;
}

.btn-primary {
	background-color: var(--color-accent);
	color: var(--color-bg-dark);
	border-color: var(--color-accent);
}

.btn-primary:hover {
	background-color: var(--color-accent-light);
	border-color: var(--color-accent-light);
	color: var(--color-bg-dark);
	transform: translateY(-2px);
	box-shadow: var(--shadow-accent);
}

.btn-glow {
	position: relative;
	overflow: hidden;
}

.btn-glow::before {
	content: '';
	position: absolute;
	top: -50%;
	left: -50%;
	width: 200%;
	height: 200%;
	background: radial-gradient(circle, rgba(255, 255, 255, 0.15) 0%, transparent 60%);
	opacity: 0;
	transition: opacity var(--transition-base);
}

.btn-glow:hover::before {
	opacity: 1;
}

.btn-outline {
	background: transparent;
	color: var(--color-text-primary);
	border-color: var(--color-glass-border);
}

.btn-outline:hover {
	border-color: var(--color-accent);
	color: var(--color-accent);
	transform: translateY(-2px);
}

.btn-lg {
	padding: 18px 44px;
	font-size: var(--text-base);
	font-weight: 700;
}

.btn-submit {
	width: 100%;
	padding: 16px 32px;
	font-size: var(--text-base);
}
