/* CTA Buttons ---------------------------------------------------------- */

.cta-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-top: 2rem;
}

.cta-buttons--align-center { justify-content: center; }
.cta-buttons--align-end    { justify-content: flex-end; }

.cta-buttons__primary,
.cta-buttons__secondary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	font-weight: 600;
	font-size: 0.95rem;
	letter-spacing: 0.02em;
	padding: 0.75rem 1.5rem;
	border-radius: 9999px;
	border: 1px solid transparent;
	text-decoration: none;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.cta-buttons__primary {
	background: var(--accent);
	color: var(--accent-contrast);
}

.cta-buttons__primary:hover,
.cta-buttons__primary:focus-visible {
	background: var(--accent-hover);
	color: var(--accent-contrast);
}

.cta-buttons--on-image .cta-buttons__secondary {
	border-color: #fff;
	color: #fff;
}

.cta-buttons--on-image .cta-buttons__secondary:hover,
.cta-buttons--on-image .cta-buttons__secondary:focus-visible {
	background: #fff;
	color: var(--darker);
}

.cta-buttons--on-light .cta-buttons__secondary {
	border-color: var(--darker);
	color: var(--darker);
}

.cta-buttons--on-light .cta-buttons__secondary:hover,
.cta-buttons--on-light .cta-buttons__secondary:focus-visible {
	background: var(--darker);
	color: #fff;
}

@media (max-width: 480px) {
	.cta-buttons {
		flex-direction: column;
		align-items: stretch;
	}

	.cta-buttons__primary,
	.cta-buttons__secondary {
		justify-content: center;
	}
}