/* Hanwha-inspired motion layer for the homepage only.
 * TODO: Figma에 없음 — 한화 메인의 패럴랙스·순차 리빌 동작을 참고한 모션값. */

.home .tc-el-home.tc-motion-ready .tc-motion-reveal,
.home .tc-el-home.tc-motion-ready .tc-motion-card {
	opacity: 0;
	clip-path: inset(0 0 var(--wp--custom--motion--clip-inset) 0);
	transform: translate3d(0, var(--wp--custom--motion--reveal-distance), 0);
	transition:
		opacity var(--wp--custom--motion--reveal-duration) var(--wp--custom--motion--easing),
		transform var(--wp--custom--motion--reveal-duration) var(--wp--custom--motion--easing),
		clip-path var(--wp--custom--motion--reveal-duration) var(--wp--custom--motion--easing);
	transition-delay: var(--tc-motion-delay, 0ms);
	will-change: opacity, transform, clip-path;
}

.home .tc-el-home.tc-motion-ready .tc-motion-reveal.is-visible,
.home .tc-el-home.tc-motion-ready .tc-motion-card.is-visible {
	opacity: 1;
	clip-path: inset(0 0 0 0);
	transform: translate3d(0, 0, 0);
}

.home .tc-el-home .tc-motion-card:nth-child(2) {
	--tc-motion-delay: var(--wp--custom--motion--stagger-duration);
}

.home .tc-el-home .tc-motion-card:nth-child(3) {
	--tc-motion-delay: calc(var(--wp--custom--motion--stagger-duration) * 2);
}

.home .tc-el-home .tc-motion-card:nth-child(4) {
	--tc-motion-delay: calc(var(--wp--custom--motion--stagger-duration) * 3);
}

.home .tc-el-home .tc-motion-card:nth-child(5) {
	--tc-motion-delay: calc(var(--wp--custom--motion--stagger-duration) * 4);
}

.home .tc-el-home .tc-motion-card:nth-child(6) {
	--tc-motion-delay: calc(var(--wp--custom--motion--stagger-duration) * 5);
}

.home .tc-el-home .tc-motion-card:nth-child(7) {
	--tc-motion-delay: calc(var(--wp--custom--motion--stagger-duration) * 6);
}

.home .tc-el-home .tc-motion-card:nth-child(8) {
	--tc-motion-delay: calc(var(--wp--custom--motion--stagger-duration) * 7);
}

.home .tc-el-hero {
	position: relative;
	transform-origin: center top;
	will-change: transform;
}

@supports (animation-timeline: scroll()) {
	.home .tc-el-hero {
		animation: tc-home-hero-parallax linear both;
		animation-timeline: scroll(root block);
		animation-range: 0 var(--wp--custom--figma--hero-height);
	}
}

@keyframes tc-home-hero-parallax {
	to {
		transform: translate3d(0, var(--wp--custom--motion--hero-lift), 0) scale(var(--wp--custom--motion--hero-scale));
	}
}

.home .tc-el-header {
	transition: box-shadow var(--wp--custom--global-header--transition) ease;
}

.home .tc-el-home.tc-motion-scrolled .tc-el-header {
	box-shadow: var(--wp--custom--motion--header-shadow);
}

.home .tc-motion-media {
	overflow: hidden;
}

.home .tc-motion-media img,
.home .tc-motion-media::before,
.home .tc-motion-media::after {
	transition: transform var(--wp--custom--motion--reveal-duration) var(--wp--custom--motion--easing);
}

.home .tc-el-home.tc-motion-ready .tc-motion-media:not(.is-visible) img {
	transform: scale(var(--wp--custom--motion--image-scale));
}

@media (hover: hover) and (pointer: fine) {
	.home .tc-el-clinical-card,
	.home .tc-el-video-link,
	.home .tc-el-review,
	.home .tc-el-faq-row,
	.home .tc-el-section-link,
	.home .tc-el-review-summary__button {
		transition:
			transform var(--wp--custom--global-header--transition) var(--wp--custom--motion--easing),
			box-shadow var(--wp--custom--global-header--transition) var(--wp--custom--motion--easing),
			opacity var(--wp--custom--global-header--transition) ease;
	}

	.home .tc-el-clinical-card:hover,
	.home .tc-el-video-link:hover,
	.home .tc-el-review:hover {
		transform: translate3d(0, var(--wp--custom--motion--hover-lift), 0);
	}

	.home .tc-el-faq-row:hover {
		transform: translate3d(calc(var(--wp--custom--motion--hover-lift) * -1), 0, 0);
	}

	.home .tc-el-section-link:hover,
	.home .tc-el-review-summary__button:hover {
		opacity: 0.72;
	}
}

@media (max-width: 767px) {
	.home .tc-el-home.tc-motion-ready .tc-motion-reveal,
	.home .tc-el-home.tc-motion-ready .tc-motion-card {
		transform: translate3d(0, calc(var(--wp--custom--motion--reveal-distance) * 0.6), 0);
	}

	.home .tc-el-home.tc-motion-ready .tc-motion-reveal.is-visible,
	.home .tc-el-home.tc-motion-ready .tc-motion-card.is-visible {
		transform: translate3d(0, 0, 0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.home .tc-el-hero,
	.home .tc-el-home.tc-motion-ready .tc-motion-reveal,
	.home .tc-el-home.tc-motion-ready .tc-motion-card,
	.home .tc-motion-media img,
	.home .tc-el-clinical-card,
	.home .tc-el-video-link,
	.home .tc-el-review,
	.home .tc-el-faq-row,
	.home .tc-el-section-link,
	.home .tc-el-review-summary__button {
		animation: none;
		transition: none;
		transform: none;
	}

	.home .tc-el-home.tc-motion-ready .tc-motion-reveal,
	.home .tc-el-home.tc-motion-ready .tc-motion-card {
		opacity: 1;
		clip-path: none;
	}
}
