/*
 * MOVER Corporate — HOME (front page) styles.
 *
 * 読み込み: フロントページ（固定ページ）でのみ inc/enqueue.php が自動で読み込む。
 * スコープ:  content/home.html のルート要素 .mv-home 配下だけに効かせる。
 *           ヘッダー・フッター・他ページには一切影響しない。
 *
 * 構成（縦のリズム）:
 *  1. 共通部品
 *  2. HERO          Canvas。左: コピー + CTA / 右: Concept A キービジュアル
 *  3. WHAT WE DO    White。大きな番号 + 3 列 + 細い罫線
 *  4. AI & WORKFLOW Ink。大きな業務フロー + よくある相談 + AI秘書
 *  5. EXPERIENCE    White。経歴の本文 + 固有名詞
 *  6. ABOUT         Canvas
 *  7. CONTACT       Ink
 *  8. Breakpoints   640 / 768 / 1024
 *
 * ルール: 値は theme.json 由来の変数のみ。アニメーションなし。カード UI・影なし。!important なし。
 */

/* ------------------------------------------------------------------
 * 1. Shared
 * ------------------------------------------------------------------ */
.mv-home {
	--mv-gap: var(--mover-space-2xl);
	--mv-num-size: var(--wp--preset--font-size--4xl);
}

.mv-home .mover-section {
	padding-block: var(--mover-space-section);
}

.mv-home .mv-section-head {
	max-width: var(--mover-reading);
	margin-block-end: var(--mv-gap);
}

/* ラベル: Signal の小さな点 + 英字。ロゴとは無関係の UI 要素 */
.mv-home .mover-label {
	display: flex;
	align-items: center;
	gap: var(--mover-space-xs);
	margin-block-end: var(--mover-space-md);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 700;
	letter-spacing: 0.1em;
	color: var(--mover-muted);
}

.mv-home .mover-label::before {
	content: "";
	flex: none;
	width: 8px;
	height: 8px;
	background-color: var(--mover-signal);
}

.mv-home .mover-section--dark .mover-label {
	color: var(--mover-border);
}

.mv-home .mv-section-title {
	margin-block-end: var(--mover-space-lg);
	font-size: var(--wp--preset--font-size--2xl);
	line-height: 1.3;
	letter-spacing: 0.01em;
}

.mv-home .mv-section-lead {
	margin: 0;
	font-size: var(--wp--preset--font-size--lg);
	line-height: 1.9;
}

.mv-home .mv-h3 {
	margin-block-end: var(--mover-space-lg);
	font-size: var(--wp--preset--font-size--lg);
	line-height: 1.4;
}

.mv-home .mv-h3--lg {
	font-size: var(--wp--preset--font-size--xl);
}

/* 短い Signal の罫線（ボードのコピー下のアクセントと同じ思想） */
.mv-home .mv-rule {
	display: block;
	width: 48px;
	height: 3px;
	margin-block: var(--mover-space-xl) var(--mover-space-lg);
	background-color: var(--mover-signal);
}

/* 矢印付きテキストリンク */
.mv-home .mv-link {
	display: inline-flex;
	align-items: center;
	gap: 0.35em;
	min-height: var(--mover-tap-size);
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 0.3em;
	text-decoration-thickness: 1px;
}

.mv-home .mv-link:hover,
.mv-home .mv-link:focus-visible {
	color: var(--mover-signal-dark);
}

.mv-home .mover-section--dark .mv-link:hover,
.mv-home .mover-section--dark .mv-link:focus-visible {
	color: var(--mover-signal);
}

/* ボタン + テキストリンクの並び */
.mv-home .mv-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--mover-space-md) var(--mover-space-lg);
}

/* 段落は短い行で区切る。最後の段落の下余白は消す */
.mv-home p + p {
	margin-block-start: 0;
}

.mv-home .mv-ai__body p,
.mv-home .mv-exp__body p,
.mv-home .mv-about__body p,
.mv-home .mv-contact__body p,
.mv-home .mv-ai__entry-body p {
	margin-block-end: var(--mover-space-md);
}

.mv-home .mv-ai__body p:last-child,
.mv-home .mv-exp__body p:last-child,
.mv-home .mv-contact__body p:last-child {
	margin-block-end: 0;
}

/* PC でだけ改行する <br> */
.mv-home .mv-br-pc {
	display: none;
}

/* ------------------------------------------------------------------
 * 2. HERO — Concept A
 * ------------------------------------------------------------------ */
.mv-home .mv-hero {
	padding-block: var(--mover-space-2xl) var(--mover-space-section);
	background-color: var(--mover-canvas);
}

.mv-home .mv-hero__grid {
	display: grid;
	gap: var(--mover-space-xl);
	align-items: center;
}

.mv-home .mv-hero__title {
	margin-block-end: var(--mover-space-lg);
	font-size: var(--wp--preset--font-size--4xl);
	line-height: 1.12;
	letter-spacing: 0.01em;
}

.mv-home .mv-hero__lead {
	margin: 0;
	font-size: var(--wp--preset--font-size--lg);
	line-height: 1.9;
}

.mv-home .mv-hero__visual {
	margin: 0;
	width: 100%;
}

.mv-home .mv-hero__visual img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--mover-radius-md);
}

/* ------------------------------------------------------------------
 * 3. WHAT WE DO — 大きな番号 + 3 列
 * ------------------------------------------------------------------ */
.mv-home .mv-areas {
	display: grid;
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--mover-ink);
}

.mv-home .mv-area {
	padding: var(--mover-space-xl) 0;
	border-bottom: 1px solid var(--mover-border);
}

/* 01 / 02 / 03 — 番号の右に Signal の短い線 */
.mv-home .mv-area__num {
	display: flex;
	align-items: center;
	gap: var(--mover-space-md);
	margin: 0 0 var(--mover-space-lg);
	font-size: var(--mv-num-size);
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.02em;
	color: var(--mover-ink);
}

.mv-home .mv-area__num::after {
	content: "";
	width: 40px;
	height: 3px;
	background-color: var(--mover-signal);
}

.mv-home .mv-area__title {
	margin-block-end: var(--mover-space-md);
	font-size: var(--wp--preset--font-size--xl);
	line-height: 1.25;
	letter-spacing: 0.02em;
}

.mv-home .mv-area__desc {
	margin: 0 0 var(--mover-space-sm);
	line-height: 1.8;
}

.mv-home .mv-area__desc + .mv-area__desc {
	color: var(--mover-muted);
}

.mv-home .mv-area__list {
	margin: var(--mover-space-lg) 0 0;
	padding: 0;
	list-style: none;
}

.mv-home .mv-area__list li {
	padding: var(--mover-space-sm) 0;
	border-top: 1px solid var(--mover-border);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 700;
}

/* ------------------------------------------------------------------
 * 4. AI & WORKFLOW — ダーク + 大きなフロー
 * ------------------------------------------------------------------ */
.mv-home .mv-ai .mv-section-title {
	color: var(--mover-white);
}

.mv-home .mv-ai__body {
	font-size: var(--wp--preset--font-size--lg);
	line-height: 1.9;
	color: var(--mover-white);
}

/*
 * 業務フロー。
 * AI が担う 3 工程は Signal、人が担う 2 工程は White。
 * 各工程は「太い上線 + 大きな文字」。矢印は装飾（aria-hidden 相当の疑似要素）。
 */
.mv-home .mv-flow {
	display: grid;
	gap: var(--mover-space-xl);
	margin-block: var(--mv-gap);
	padding-block: var(--mover-space-xl);
	border-top: 1px solid var(--mover-muted);
	border-bottom: 1px solid var(--mover-muted);
}

.mv-home .mv-flow__group {
	min-width: 0;
}

.mv-home .mv-flow__who {
	margin: 0 0 var(--mover-space-md);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 700;
	letter-spacing: 0.1em;
}

.mv-home .mv-flow__group--ai .mv-flow__who {
	color: var(--mover-signal);
}

.mv-home .mv-flow__group--human .mv-flow__who {
	color: var(--mover-white);
}

.mv-home .mv-flow__steps {
	position: relative;
	display: grid;
	gap: var(--mover-space-lg);
	margin: 0;
	padding: 0;
	list-style: none;
}

.mv-home .mv-flow__step {
	position: relative;
	padding: var(--mover-space-md) 0 0;
	border-top: 4px solid var(--mover-white);
	font-size: var(--wp--preset--font-size--xl);
	font-weight: 700;
	line-height: 1.3;
	color: var(--mover-white);
}

.mv-home .mv-flow__group--ai .mv-flow__step {
	border-top-color: var(--mover-signal);
}

/* 工程の間の矢印。縦積み時は下向きで、工程間の余白（gap）の中に置く */
.mv-home .mv-flow__step + .mv-flow__step::before {
	content: "↓";
	content: "↓" / "";
	position: absolute;
	inset-block-start: calc(-1 * var(--mover-space-lg));
	inset-inline-start: 0;
	height: var(--mover-space-lg);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 400;
	line-height: var(--mover-space-lg);
	color: var(--mover-muted);
}

/* AI グループ → 人グループの間の矢印 */
.mv-home .mv-flow__group--human {
	position: relative;
	padding-block-start: var(--mover-space-xl);
}

.mv-home .mv-flow__group--human::before {
	content: "↓";
	content: "↓" / "";
	position: absolute;
	inset-block-start: 0;
	inset-inline-start: 0;
	height: var(--mover-space-xl);
	font-size: var(--wp--preset--font-size--sm);
	line-height: var(--mover-space-xl);
	color: var(--mover-muted);
}
/* よくある相談: 番号 + 罫線 + 短文 */
.mv-home .mv-ai__faq {
	margin-block-end: var(--mv-gap);
}

.mv-home .mv-faq {
	display: grid;
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--mover-muted);
}

.mv-home .mv-faq__item {
	display: grid;
	grid-template-columns: 3rem 1fr;
	gap: var(--mover-space-md);
	align-items: start;
	padding: var(--mover-space-md) 0;
	border-bottom: 1px solid var(--mover-muted);
}

.mv-home .mv-faq__num {
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 700;
	letter-spacing: 0.1em;
	color: var(--mover-signal);
}

.mv-home .mv-faq__item p {
	margin: 0;
	font-weight: 700;
	line-height: 1.6;
}

/* 経営者向けAI秘書 */
.mv-home .mv-ai__entry {
	display: grid;
	gap: var(--mover-space-lg);
}

.mv-home .mv-ai__entry-head .mv-h3 {
	margin-block-end: 0;
	color: var(--mover-white);
}

.mv-home .mv-ai__entry-body {
	color: var(--mover-border);
}

.mv-home .mv-ai__entry-body p:first-child {
	color: var(--mover-white);
	font-weight: 700;
	line-height: 1.9;
}

.mv-home .mv-ai__entry-body .mv-actions {
	margin-block-start: var(--mover-space-lg);
}

/* ------------------------------------------------------------------
 * 5. EXPERIENCE
 * ------------------------------------------------------------------ */
.mv-home .mv-exp__grid {
	display: grid;
	gap: var(--mv-gap);
	align-items: start;
}

.mv-home .mv-exp__body {
	line-height: 1.9;
}

.mv-home .mv-exp__body p:first-child {
	font-weight: 700;
}

.mv-home .mv-exp__list {
	margin: 0;
	padding-block-start: var(--mover-space-md);
	border-top: 1px solid var(--mover-ink);
	font-size: var(--wp--preset--font-size--sm);
}

.mv-home .mv-exp__list dt {
	margin-block-start: var(--mover-space-md);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 700;
	letter-spacing: 0.1em;
	color: var(--mover-muted);
}

.mv-home .mv-exp__list dt:first-child {
	margin-block-start: 0;
}

.mv-home .mv-exp__list dd {
	margin: var(--mover-space-xs) 0 0;
	padding-block-end: var(--mover-space-xs);
}

.mv-home .mv-exp__list dd + dt {
	padding-block-start: var(--mover-space-sm);
	border-top: 1px solid var(--mover-border);
}

/* ------------------------------------------------------------------
 * 6. ABOUT
 * ------------------------------------------------------------------ */
.mv-home .mv-about__grid {
	display: grid;
	gap: var(--mover-space-xl);
	align-items: start;
}

.mv-home .mv-about__head .mv-section-title {
	margin-block-end: 0;
}

.mv-home .mv-eq {
	color: var(--mover-signal);
}

.mv-home .mv-about__body {
	font-size: var(--wp--preset--font-size--md);
	line-height: 1.9;
}

.mv-home .mv-about__link {
	margin: var(--mover-space-lg) 0 0;
	font-size: var(--wp--preset--font-size--md);
}

/* ------------------------------------------------------------------
 * 7. CONTACT
 * ------------------------------------------------------------------ */
.mv-home .mv-contact__grid {
	display: grid;
	gap: var(--mover-space-xl);
	align-items: start;
}

.mv-home .mv-contact .mv-section-title {
	color: var(--mover-white);
}

.mv-home .mv-contact__body {
	font-size: var(--wp--preset--font-size--md);
	line-height: 1.9;
	color: var(--mover-border);
}

.mv-home .mv-contact__actions .mover-btn {
	width: 100%;
}

.mv-home .mv-contact__mail {
	margin: var(--mover-space-lg) 0 0;
	font-size: var(--wp--preset--font-size--sm);
	color: var(--mover-border);
}

.mv-home .mv-contact__mail a {
	font-weight: 700;
	color: var(--mover-white);
}

/* ------------------------------------------------------------------
 * 8. Breakpoints
 * ------------------------------------------------------------------ */
@media (min-width: 640px) {
	.mv-home .mv-contact__actions .mover-btn {
		width: auto;
	}

	/* よくある相談を 3 列に */
	.mv-home .mv-faq {
		grid-template-columns: repeat(3, 1fr);
		border-top: 0;
	}

	.mv-home .mv-faq__item {
		grid-template-columns: 1fr;
		gap: var(--mover-space-sm);
		padding: var(--mover-space-md) var(--mover-space-lg) var(--mover-space-lg) 0;
		border-top: 1px solid var(--mover-muted);
		border-bottom: 0;
	}

	.mv-home .mv-faq__item + .mv-faq__item {
		padding-inline-start: var(--mover-space-lg);
		border-inline-start: 1px solid var(--mover-muted);
	}
}

@media (min-width: 768px) {
	.mv-home .mv-br-pc {
		display: inline;
	}

	/* HERO: 左コピー / 右ビジュアル */
	.mv-home .mv-hero {
		padding-block: var(--mover-space-section);
	}

	.mv-home .mv-hero__grid {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
		gap: var(--mover-space-2xl);
	}

	/* WHAT WE DO: 3 列 + 縦の罫線 */
	.mv-home .mv-areas {
		grid-template-columns: repeat(3, 1fr);
		border-bottom: 1px solid var(--mover-border);
	}

	.mv-home .mv-area {
		padding: var(--mover-space-xl) var(--mover-space-lg) var(--mover-space-xl) 0;
		border-bottom: 0;
	}

	.mv-home .mv-area + .mv-area {
		padding-inline-start: var(--mover-space-lg);
		border-inline-start: 1px solid var(--mover-border);
	}

	/* AI フロー: 横方向。AI 3 工程 | 人 2 工程 */
	.mv-home .mv-flow {
		grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
		gap: var(--mover-space-2xl);
	}

	.mv-home .mv-flow__steps {
		grid-auto-flow: column;
		grid-auto-columns: 1fr;
		gap: var(--mover-space-xl);
	}

	.mv-home .mv-flow__step {
		padding-inline-end: var(--mover-space-sm);
		font-size: var(--wp--preset--font-size--md);
	}

	/* 横並び時の矢印は右向き。工程間の余白の中央、1 行目の文字に揃える */
	.mv-home .mv-flow__step + .mv-flow__step::before {
		content: "→";
		content: "→" / "";
		inset-block-start: calc(var(--mover-space-md) + 4px);
		inset-inline-start: calc(-1 * var(--mover-space-xl));
		width: var(--mover-space-xl);
		height: auto;
		text-align: center;
		line-height: 1.3;
		font-size: var(--wp--preset--font-size--lg);
	}

	.mv-home .mv-flow__group--human {
		padding-block-start: 0;
	}

	/* グループ間の矢印は工程リストの左に置き、工程の矢印と高さを揃える */
	.mv-home .mv-flow__group--human::before {
		content: none;
	}

	.mv-home .mv-flow__group--human .mv-flow__steps::before {
		content: "→";
		content: "→" / "";
		position: absolute;
		inset-block-start: calc(var(--mover-space-md) + 4px);
		inset-inline-start: calc(-1 * var(--mover-space-2xl));
		width: var(--mover-space-2xl);
		text-align: center;
		line-height: 1.3;
		font-size: var(--wp--preset--font-size--lg);
		color: var(--mover-signal);
	}

	/* AI秘書: 見出し | 本文 */
	.mv-home .mv-ai__entry {
		grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
		gap: var(--mover-space-2xl);
	}

	/* EXPERIENCE / ABOUT / CONTACT の 2 列 */
	.mv-home .mv-exp__grid,
	.mv-home .mv-about__grid,
	.mv-home .mv-contact__grid {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
		gap: var(--mover-space-2xl);
	}

	.mv-home .mv-about__grid {
		grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	}

	.mv-home .mv-contact__actions {
		justify-self: end;
		text-align: end;
		padding-block-start: var(--mover-space-2xl);
	}

	/* 本文は 768px 以上で一段大きく */
	.mv-home .mv-about__body,
	.mv-home .mv-contact__body {
		font-size: var(--wp--preset--font-size--lg);
	}
}

@media (min-width: 1024px) {
	.mv-home .mv-hero__grid {
		grid-template-columns: minmax(0, 6fr) minmax(0, 6fr);
	}

	.mv-home .mv-hero__title {
		font-size: var(--wp--preset--font-size--4xl);
	}

	.mv-home .mv-hero__visual {
		justify-self: end;
		max-width: 520px;
	}

	/* WHAT WE DO の見出し行: タイトル | 導入文 */
	.mv-home .mv-what .mv-section-head {
		max-width: none;
		display: grid;
		grid-template-columns: minmax(0, 6fr) minmax(0, 6fr);
		gap: 0 var(--mover-space-2xl);
		align-items: end;
	}

	.mv-home .mv-what .mover-label {
		grid-column: 1 / -1;
	}

	.mv-home .mv-what .mv-section-title {
		grid-column: 1;
		margin-block-end: 0;
	}

	.mv-home .mv-what .mv-section-lead {
		grid-column: 2;
		padding-block-end: 0.4em;
	}

	/* AI: 見出し | 本文 */
	.mv-home .mv-ai .mv-section-head {
		max-width: none;
		display: grid;
		grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
		gap: 0 var(--mover-space-2xl);
		align-items: start;
	}

	.mv-home .mv-ai .mover-label {
		grid-column: 1 / -1;
	}

	.mv-home .mv-ai .mv-section-title {
		grid-column: 1;
		margin-block-end: 0;
	}

	.mv-home .mv-ai .mv-ai__body {
		grid-column: 2;
		max-width: var(--mover-reading);
	}

	.mv-home .mv-flow__step {
		font-size: var(--wp--preset--font-size--xl);
	}
}