/**
 * サイト共通：落ち着いたモーション（誠実・信頼感を損なわない程度の上品さ）
 */

:root {
	/* やや長めの減速＝落ち着いた止まり方（バウンスなし） */
	--motion-duration: 0.78s;
	--motion-duration-soft: 0.88s;
	--motion-duration-short: 0.48s;
	--motion-opacity-duration: 0.58s;
	--motion-ease: cubic-bezier(0.2, 0.65, 0.36, 1);
	--motion-ease-out: cubic-bezier(0.16, 0.72, 0.28, 1);
	--motion-ease-snappy: cubic-bezier(0.25, 0.46, 0.45, 0.94);
	/* 少し艶：長い減速（派手にしない用） */
	--motion-ease-luxe: cubic-bezier(0.33, 1, 0.68, 1);
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--motion-duration: 0.01ms;
		--motion-duration-soft: 0.01ms;
		--motion-duration-short: 0.01ms;
		--motion-opacity-duration: 0.01ms;
	}
}

/* ----- スクロールイン（IntersectionObserver で .is-inview） ----- */
.motion-reveal {
	opacity: 0;
	transform: translate3d(0, 0.9rem, 0) scale(0.994);
	transition:
		opacity var(--motion-opacity-duration) var(--motion-ease),
		transform var(--motion-duration) var(--motion-ease);
	transition-delay: 0s, 0s;
}

.motion-reveal.is-inview {
	opacity: 1;
	transform: translate3d(0, 0, 0) scale(1);
}

.motion-reveal--soft {
	transform: translate3d(0, 0.55rem, 0) scale(0.996);
	transition:
		opacity calc(var(--motion-opacity-duration) * 1.05) var(--motion-ease),
		transform var(--motion-duration-soft) var(--motion-ease);
}

/* トップ：イントロはセクション枠のフェードを使わず、行だけを遅延表示 */
.motion-reveal--stack {
	opacity: 1;
	transform: none;
	transition: none;
}

/* スクリプト未使用時は常に表示（中身が消えたままにならないように） */
@media (scripting: none) {
	.motion-reveal--stack .home-intro__stack > * {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
}

@media (scripting: enabled) {
	.motion-reveal--stack:not(.is-inview) .home-intro__stack > * {
		opacity: 0;
		transform: translate3d(0, 0.45rem, 0);
	}

	.motion-reveal--stack.is-inview .home-intro__stack > * {
		opacity: 1;
		transform: translate3d(0, 0, 0);
		transition:
			opacity var(--motion-opacity-duration) var(--motion-ease),
			transform var(--motion-duration-soft) var(--motion-ease);
	}

	.motion-reveal--stack.is-inview .home-intro__stack > *:nth-child(1) {
		transition-delay: 0.04s, 0.04s;
	}

	.motion-reveal--stack.is-inview .home-intro__stack > *:nth-child(2) {
		transition-delay: 0.1s, 0.1s;
	}
}

/* トップヒーロー：見出し行だけを短い遅延で順に（親ラッパーはフェードしない） */
.home-hero__inner.motion-reveal--hero-lines {
	opacity: 1;
	transform: none;
	transition: none;
}

.home-hero__inner.motion-reveal--hero-lines:not(.is-inview) .home-hero__title-row {
	opacity: 0;
	transform: translate3d(0, 0.6rem, 0);
}

.home-hero__inner.motion-reveal--hero-lines.is-inview .home-hero__title-row {
	opacity: 1;
	transform: translate3d(0, 0, 0);
	transition:
		opacity calc(var(--motion-opacity-duration) * 1.08) var(--motion-ease),
		transform var(--motion-duration-soft) var(--motion-ease);
}

.home-hero__inner.motion-reveal--hero-lines.is-inview .home-hero__title-row--start {
	transition-delay: 0.07s, 0.07s;
}

.home-hero__inner.motion-reveal--hero-lines.is-inview .home-hero__title-row--end {
	transition-delay: 0.17s, 0.17s;
}

/* 事業内容：タイルだけ段階表示 */
.section--services.motion-reveal-tiles .service-tile {
	opacity: 0;
	transform: translate3d(0, 0.85rem, 0) scale(0.992);
	transition:
		opacity 0.62s var(--motion-ease-out),
		transform 0.72s var(--motion-ease-out);
}

.section--services.motion-reveal-tiles.is-inview .service-tile:nth-child(1) {
	transition-delay: 0.05s;
}

.section--services.motion-reveal-tiles.is-inview .service-tile:nth-child(2) {
	transition-delay: 0.11s;
}

.section--services.motion-reveal-tiles.is-inview .service-tile:nth-child(3) {
	transition-delay: 0.17s;
}

.section--services.motion-reveal-tiles.is-inview .service-tile:nth-child(4) {
	transition-delay: 0.23s;
}

.section--services.motion-reveal-tiles.is-inview .service-tile {
	opacity: 1;
	transform: translate3d(0, 0, 0) scale(1);
}

@media (prefers-reduced-motion: reduce) {
	.motion-reveal,
	.motion-reveal.is-inview,
	.motion-reveal--soft,
	.motion-reveal--soft.is-inview,
	.motion-reveal--stack:not(.is-inview) .home-intro__stack > *,
	.motion-reveal--stack.is-inview .home-intro__stack > *,
	.home-hero__inner.motion-reveal--hero-lines:not(.is-inview) .home-hero__title-row,
	.home-hero__inner.motion-reveal--hero-lines.is-inview .home-hero__title-row,
	.section--services.motion-reveal-tiles .service-tile,
	.section--services.motion-reveal-tiles.is-inview .service-tile {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
}

/* ----- ヘッダー：スクロール時に極薄の奥行きだけ ----- */
.site-header {
	transition:
		box-shadow 0.5s var(--motion-ease),
		background-color 0.45s ease;
}

.site-header.is-scrolled {
	box-shadow: 0 4px 22px rgba(15, 23, 42, 0.055);
}

@media (prefers-reduced-motion: reduce) {
	.site-header {
		transition: none;
	}
}

/* ----- ボタン：わずかな浮き＋影（主張しすぎない） ----- */
.btn {
	transition:
		transform 0.28s var(--motion-ease-snappy),
		box-shadow 0.32s var(--motion-ease),
		background-color 0.28s ease,
		color 0.28s ease,
		border-color 0.28s ease;
}

.btn:hover {
	transform: translateY(-1.5px);
}

.btn:active {
	transform: translateY(-0.5px);
	transition-duration: 0.1s;
}

@media (prefers-reduced-motion: reduce) {
	.btn:hover,
	.btn:active {
		transform: none;
	}
}

/* ----- ページヒーロー：帯のフェード ----- */
.page-hero .page-hero__band .container {
	transition:
		opacity 0.72s var(--motion-ease) 0.14s,
		transform 0.78s var(--motion-ease) 0.14s;
}

.page-hero.motion-reveal-hero:not(.is-inview) .page-hero__band .container {
	opacity: 0;
	transform: translate3d(0, 0.55rem, 0) scale(0.997);
}

.page-hero.motion-reveal-hero.is-inview .page-hero__band .container {
	opacity: 1;
	transform: translate3d(0, 0, 0) scale(1);
}

@media (prefers-reduced-motion: reduce) {
	.page-hero .page-hero__band .container {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
}

/* --------------------------------------------------------------------------
 * 細部の仕上げ（目立たせすぎない艶：ナビ下線のドロー、安心リストの階層、戻るボタン等）
 * -------------------------------------------------------------------------- */

/* PC ナビ：下線を左から伸ばす */
@media (min-width: 900px) and (prefers-reduced-motion: no-preference) {
	.site-nav__list .menu-item a {
		position: relative;
		border-bottom: none;
	}

	.site-nav__list .menu-item a::after {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0.2rem;
		height: 2px;
		border-radius: 1px;
		background: var(--color-primary);
		opacity: 0.5;
		transform: scaleX(0);
		transform-origin: left center;
		transition: transform 0.35s var(--motion-ease-luxe), opacity 0.2s ease;
	}

	.site-nav__list .menu-item a:hover::after,
	.site-nav__list .menu-item a:focus-visible::after,
	.site-nav__list .menu-item.current-menu-item > a::after {
		transform: scaleX(1);
	}

	.site-nav__list .menu-item.current-menu-item > a::after {
		opacity: 0.6;
	}
}

@media (min-width: 900px) and (prefers-reduced-motion: reduce) {
	.site-nav__list .menu-item a::after {
		display: none;
	}

	/* 従来の下線表現（アニメなし版） */
	.site-nav__list .menu-item a {
		border-bottom: 2px solid transparent;
	}

	.site-nav__list .menu-item a:hover,
	.site-nav__list .menu-item a:focus-visible,
	.site-nav__list .menu-item.current-menu-item > a {
		border-bottom-color: rgba(234, 88, 12, 0.45);
	}
}

/* スマホ・タブレット（ハンバーガーパネル）：PC と同じ左から伸びるオレンジ下線（タッチは :active でも表示） */
@media (max-width: 899px) and (prefers-reduced-motion: no-preference) {
	.site-nav__list .menu-item a {
		position: relative;
		border-bottom: none;
	}

	.site-nav__list .menu-item a::after {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0.75rem;
		height: 2px;
		border-radius: 1px;
		background: var(--color-primary);
		opacity: 0.5;
		transform: scaleX(0);
		transform-origin: left center;
		transition: transform 0.35s var(--motion-ease-luxe), opacity 0.2s ease;
		pointer-events: none;
		z-index: 1;
	}

	.site-nav__list .menu-item a:hover::after,
	.site-nav__list .menu-item a:focus-visible::after,
	.site-nav__list .menu-item a:active::after,
	.site-nav__list .menu-item.current-menu-item > a::after {
		transform: scaleX(1);
	}

	.site-nav__list .menu-item.current-menu-item > a::after {
		opacity: 0.6;
	}
}

@media (max-width: 899px) and (prefers-reduced-motion: reduce) {
	.site-nav__list .menu-item a::after {
		display: none;
	}
}

/* トップ：安心のチェック行を、表示後にほんの少し段に */
@media (prefers-reduced-motion: no-preference) {
	@keyframes home-check-stagger {
		from {
			opacity: 0;
			transform: translate3d(0, 0.35rem, 0);
		}
		to {
			opacity: 1;
			transform: translate3d(0, 0, 0);
		}
	}

	.site-main--front .section.motion-reveal.is-inview .check-list--home li {
		animation: home-check-stagger 0.5s var(--motion-ease-out) both;
	}

	.site-main--front .section.motion-reveal.is-inview .check-list--home li:nth-child(1) {
		animation-delay: 0.06s;
	}

	.site-main--front .section.motion-reveal.is-inview .check-list--home li:nth-child(2) {
		animation-delay: 0.11s;
	}

	.site-main--front .section.motion-reveal.is-inview .check-list--home li:nth-child(3) {
		animation-delay: 0.16s;
	}

	.site-main--front .section.motion-reveal.is-inview .check-list--home li:nth-child(4) {
		animation-delay: 0.21s;
	}

	.site-main--front .section.motion-reveal.is-inview .check-list--home li:nth-child(5) {
		animation-delay: 0.26s;
	}
}

@media (prefers-reduced-motion: reduce) {
	.site-main--front .section.motion-reveal.is-inview .check-list--home li {
		animation: none !important;
	}
}

/* 先頭へ戻る：影とイージングを整えた軽い浮き */
@media (prefers-reduced-motion: no-preference) {
	a.back-to-top {
		transition:
			transform 0.4s var(--motion-ease-luxe),
			background 0.22s ease,
			box-shadow 0.4s var(--motion-ease),
			opacity 0.2s ease;
	}

	a.back-to-top:hover {
		transform: translate3d(0, -3px, 0) scale(1.02);
		box-shadow:
			0 10px 28px rgba(0, 0, 0, 0.18),
			0 0 0 1px rgba(255, 255, 255, 0.06) inset;
	}

	a.back-to-top:active {
		transform: translate3d(0, -0.5px, 0) scale(1);
	}
}

@media (prefers-reduced-motion: reduce) {
	a.back-to-top:hover,
	a.back-to-top:active {
		transform: none;
	}
}
