/* Visit Exhibition — CTA button linking to the Event Gate page. Self-contained
   component (mirrors components/event-detail.css). Prefixed
   nxtorigin-visit-exhibition- so it never collides with other styles. */

.nxtorigin-visit-exhibition {
	display: inline-block;
}

.nxtorigin-visit-exhibition-link {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 14px 26px;
	background: linear-gradient(135deg, var(--nx-emerald, #06d6a0) 0%, var(--nx-cyan, #22d3ee) 100%);
	border: 1px solid rgba(255, 255, 255, 0.34);
	border-radius: 12px;
	box-sizing: border-box;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.03em;
	color: var(--nx-text-soft, #03131a);
	text-decoration: none;
	box-shadow: 0 6px 20px rgba(6, 214, 160, 0.28);
	transition: transform 0.25s ease, box-shadow 0.25s ease, filter 0.25s ease;
}

.nxtorigin-visit-exhibition-link:hover,
.nxtorigin-visit-exhibition-link:focus {
	transform: translateY(-2px);
	box-shadow: 0 10px 26px rgba(6, 214, 160, 0.4);
	filter: brightness(1.05);
	text-decoration: none;
	color: var(--nx-text-soft, #03131a);
}

/* Arrow affordance so the button reads as a forward action. */
.nxtorigin-visit-exhibition-link::after {
	content: "";
	flex: 0 0 auto;
	width: 8px;
	height: 8px;
	border-right: 2px solid var(--nx-text-soft, #03131a);
	border-bottom: 2px solid var(--nx-text-soft, #03131a);
	transform: rotate(-45deg);
	transition: transform 0.25s ease;
}

.nxtorigin-visit-exhibition-link:hover::after,
.nxtorigin-visit-exhibition-link:focus::after {
	transform: rotate(-45deg) translate(2px, 2px);
}

@media (max-width: 600px) {
	.nxtorigin-visit-exhibition-link {
		font-size: 15px;
		padding: 13px 22px;
	}
}