/* Original TRU icon feedback. Shared by every page and editor preview, with no JavaScript dependency.
 * Animate the inner drawing so menu chevrons, FAQ plus/minus and burger open states keep their meaning.
 */
.tru-site .tru-i-motion {
	transform-box: fill-box;
	transform-origin: center;
	animation-name: var(--tru-icon-feedback, none);
	animation-duration: var(--tru-icon-feedback-duration, 420ms);
	animation-timing-function: var(--tru-ease);
	animation-fill-mode: both;
}

.tru-site .tru-i :is(path, circle, rect, ellipse) {
	transform-box: fill-box;
	transform-origin: center;
}

/* Narrow card/label groups make decorative icons respond without inventing extra keyboard stops. */
.tru-site :is(a, button, summary, [data-tru-hover], .tru-icon, .tru-hover-group, .tru-icon-card, .tru-contact__label, .tru-map__art):is(:hover, :focus-visible, :active) .tru-i,
.tru-site .tru-hover-group:focus-within .tru-i,
.tru-site .is-icon-pressed .tru-i,
.tru-site .tru-i:hover {
	--tru-icon-feedback: tru-icon-feedback;
	--tru-part-draw: tru-icon-draw;
	--tru-part-spark: tru-icon-spark;
	--tru-part-sway: tru-icon-sway;
	--tru-part-pulse: tru-icon-pulse;
	--tru-part-tick: tru-icon-tick;
	--tru-part-snip-a: tru-icon-snip-a;
	--tru-part-snip-b: tru-icon-snip-b;
}

.tru-i--arrow-right, .tru-i--chevron-right { --tru-icon-x: 3px; --tru-icon-y: 0px; }
.tru-i--arrow-up-right { --tru-icon-x: 3px; --tru-icon-y: -3px; }
.tru-i--chevron-left { --tru-icon-x: -3px; --tru-icon-y: 0px; }
.tru-i--chevron-down { --tru-icon-y: 2px; }

@keyframes tru-icon-feedback {
	0%, 100% { transform: translate(0, 0) scale(1); }
	45% { transform: translate(var(--tru-icon-x, 0px), var(--tru-icon-y, -2px)) scale(1.09); }
}

.tru-site .tru-i--scissors :is(.tru-i-blade-a, .tru-i-blade-b) {
	transform-box: view-box;
	transform-origin: 16px 14.3px;
}
.tru-site .tru-i--scissors :is(.tru-i-blade-a, .tru-i-blade-b) { animation-duration: 260ms; animation-timing-function: var(--tru-ease); animation-iteration-count: 2; }
.tru-site .tru-i--scissors .tru-i-blade-a { animation-name: var(--tru-part-snip-a, none); }
.tru-site .tru-i--scissors .tru-i-blade-b { animation-name: var(--tru-part-snip-b, none); }
@keyframes tru-icon-snip-a { 50% { transform: rotate(-9deg); } }
@keyframes tru-icon-snip-b { 50% { transform: rotate(9deg); } }

.tru-site :is(.tru-i-check, .tru-i-brow, .tru-i-sweep, .tru-i-outline, .tru-i-vein, .tru-i-glint, .tru-i-route, .tru-i-glow) {
	stroke-dasharray: 1;
	animation-name: var(--tru-part-draw, none);
	animation-duration: var(--tru-icon-draw-duration, 600ms);
	animation-timing-function: var(--tru-ease);
	animation-fill-mode: both;
}
@keyframes tru-icon-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }

.tru-site :is(.tru-i-spark, .tru-i-star) { animation-name: var(--tru-part-spark, none); animation-duration: 600ms; animation-timing-function: var(--tru-ease); animation-fill-mode: both; }
@keyframes tru-icon-spark { 40% { transform: scale(1.18); } 100% { transform: scale(1); } }

.tru-site :is(.tru-i--extensions, .tru-i--balayage) .tru-i-strand {
	animation-name: var(--tru-part-sway, none);
	animation-duration: 600ms;
	animation-timing-function: var(--tru-ease-in-out);
	animation-fill-mode: both;
	transform-origin: top center;
}
@keyframes tru-icon-sway { 35% { transform: skewX(-4deg); } 70% { transform: skewX(3deg); } }
.tru-site :is(.tru-i-wave, .tru-i-dot) { animation-name: var(--tru-part-pulse, none); animation-duration: 600ms; animation-timing-function: var(--tru-ease); animation-fill-mode: both; }
@keyframes tru-icon-pulse { 30% { opacity: 0.4; } 100% { opacity: 1; } }
.tru-site .tru-i--clock .tru-i-hand {
	transform-box: view-box;
	transform-origin: 16px 16px;
	animation-name: var(--tru-part-tick, none);
	animation-duration: 600ms;
	animation-timing-function: var(--tru-ease);
	animation-fill-mode: both;
}
@keyframes tru-icon-tick { from { transform: rotate(-25deg); } to { transform: rotate(0); } }

/* The menu trigger uses three stateful strokes, rather than a bundled icon. */
.tru-site .tru-nav__burger:is(:hover, :focus-visible, :active, .is-icon-pressed) .tru-burger {
	animation: tru-icon-feedback var(--tru-icon-feedback-duration, 420ms) var(--tru-ease) both;
}

.tru-site :is(a, button, .elementor-icon):is(:hover, :focus-visible, :active, .is-icon-pressed) :is(.elementor-icon i, .elementor-button-icon i, .elementor-icon-list-icon i) {
	animation: tru-icon-feedback var(--tru-icon-feedback-duration, 420ms) var(--tru-ease) both;
}

/* Preserve a deliberate owner opt-out and never animate disabled controls. */
.tru-site :is([data-tru-icon-motion="none"], button:disabled, [aria-disabled="true"]) .tru-i,
.tru-site [data-tru-icon-motion="none"].tru-i {
	--tru-icon-feedback: none !important;
	--tru-part-draw: none !important;
	--tru-part-spark: none !important;
	--tru-part-sway: none !important;
	--tru-part-pulse: none !important;
	--tru-part-tick: none !important;
	--tru-part-snip-a: none !important;
	--tru-part-snip-b: none !important;
}

@media (prefers-reduced-motion: reduce) {
	.tru-site .tru-i-motion,
	.tru-site .tru-i :is(path, circle, rect, ellipse),
	.tru-site :is(.elementor-icon i, .elementor-button-icon i, .elementor-icon-list-icon i),
	.tru-site .tru-nav__burger .tru-burger {
		animation: none !important;
	}
}