/* Northern Sky - Intro Text + Button
   Structural / layout CSS only. Colors, typography, spacing and the icon
   rotation angles are controlled per-instance from the Elementor Style tab
   (see the widget's "selectors" in class-intro-cta-widget.php). */

.nsm-intro-cta,
.nsm-intro-cta *,
.nsm-intro-cta *::before,
.nsm-intro-cta *::after {
	box-sizing: border-box;
}

.nsm-intro-cta {
	display: block;
	width: 100%;
}

.nsm-intro-text-wrap {
	width: 100%;
}

.nsm-intro-text {
	margin: 0;
}

/* Each word starts dim and is switched to the active color as the scroll
   position of the section changes - see intro-cta.js. The fill continually
   tracks scroll position both scrolling down and back up. */
.nsm-intro-word {
	display: inline-block;
	transition-property: color;
	transition-timing-function: ease;
}

.nsm-intro-no-anim .nsm-intro-word {
	transition: none;
}

.nsm-intro-btn {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	padding-bottom: 6px;
	width: fit-content;
	transition-property: border-color;
	transition-timing-function: ease;
}

.nsm-intro-btn-text {
	display: inline-block;
	transition-property: color;
	transition-timing-function: ease;
}

.nsm-intro-btn-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	border-radius: 50%;
	line-height: 1;
	transition-property: transform, background-color, color;
	transition-timing-function: ease;
}

.nsm-intro-btn-icon svg,
.nsm-intro-btn-icon i {
	display: block;
}

@media (prefers-reduced-motion: reduce) {
	.nsm-intro-word,
	.nsm-intro-btn,
	.nsm-intro-btn-text,
	.nsm-intro-btn-icon {
		transition: none !important;
	}
}
