/* "Application CTA" (id="applcation-cta" - real typo already baked into the
   anchor name in the page content itself, not ours to fix here without
   breaking the anchor) is a mobile-only sticky duplicate of the "Apply Now"
   button that already sits in the page's normal content flow
   (.is-style-outline--10). Positioned fully off-screen below the viewport
   by default via transform (not display:none - display can't be animated,
   and the requirement is a smooth slide, not an instant cut) - script.js
   adds/removes .cuhk-cta-visible to slide it in/out, only in the 1-column
   mobile layout, and only while the bar hasn't yet reached the
   .wp-block-column containing the real button. */
#applcation-cta {
	min-width: 320px;
	position: fixed;
	left: 20px;
	right: 20px;
	bottom: 20px;
	z-index: 40; /* below .cuhk-header's z-index:50 */
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.15);
	/* 100% of its own height clears it completely; +40px is a small buffer
	   so no edge is ever left peeking into view. */
	transform: translateY(calc(100% + 40px));
	transition: transform 0.3s ease;
	pointer-events: none; /* not interactable while off-screen */
	/* Promotes this fixed element to its own compositor layer. Without
	   this, mobile Safari defers repainting position:fixed elements while
	   a touch-scroll gesture is actively in progress and only "catches up"
	   once the scroll momentum settles - so a transition triggered mid-
	   scroll can end up snapping straight to its end state right as
	   scrolling stops, instead of visibly sliding, even though the same
	   transition plays correctly on desktop/non-fixed elements. */
	will-change: transform;
}
#applcation-cta.cuhk-cta-visible {
	transform: translateY(0);
	pointer-events: auto;
}
@media (prefers-reduced-motion: reduce) {
	#applcation-cta {
		transition: none;
	}
}