/* ============================================================
 * pages/lp-bizboot-meo.css ─ LP2 Googleマップ集客（MEO）専用スタイル
 *
 * 構成（CSS順）2026-05-04 v2.3 修正後：
 *  Page-level    : スキップリンク・main 設定
 *  Header        : lp-meo-header（最小化・sticky）
 *  Section 00    : lp-meo-hero（h1 機能名詞・対象者文・ミニ3点・LP専用SVG）
 *  Section 00.5  : trust-bar（共通仕様をローカル定義）
 *  Section 01    : lp-meo-shift（市場の事実）
 *  Section 02    : lp-meo-vs（SEO/SNS/MEO 比較表・SPは <table> grid再構成）
 *  Section 03    : lp-meo-service / lp-meo-strengths（提供範囲＋3強み）
 *  Section 04    : lp-meo-flow（5 Step・縦タイムライン型）
 *  Section 05    : Final CTA（about.css で完全定義済 → 上書きしない）
 *  Section 06    : lp-meo-faq（FAQ アコーディオン・contact-faq 流用構造）
 *  Section 07    : lp-meo-promise（ダーク強調・納品の範囲と運用支援の方針）
 *  Section 08    : lp-meo-form-section（CF7 placeholder・フォーム）
 *  Section 09    : lp-meo-privacy（個人情報・要約版）
 *  Footer        : lp-meo-footer（最小フッター）
 *  Sticky CTA    : lp-meo-sticky-cta（SP常時可視CTA）
 *  thanks ページ : lp-meo-thanks-* 一式（LP1 thanks の構造を踏襲）
 *
 * 設計：ライト基盤＋ダーク強調（lp-meo-promise）のハイブリッド
 * モバイルファースト：SPで第一印象品質を最優先（CLAUDE.md 1章末）
 *
 * 配色アクセント：LP1（Cyan/Rose 主役）から差し替え、Coral / Amber を主役に。
 *   - ヒーロー背景の柔らかい円：Coral 0.07
 *   - メガタイポは Coral 寄り（後述 .lp-meo-hero__bg-typo / bg-mega-typo--coral）
 *   - ブランド主役色 --color-brand: #067B7B は CTA・ロゴで継続使用
 * ============================================================ */


/* ============================================================
 * Page-level：アンカー位置のオフセット（固定ヘッダー分）
 * ============================================================ */
:root {
	scroll-padding-top: 80px;
}

/* ページ末尾は about-final-cta がダーク強調。直後の lp-meo-form / footer との
   間に白い余白が出ないよう、site-footer の margin-top を相殺 */
.site-footer {
	margin-top: 0;
}

/* スキップリンク */
.skip-link {
	position: absolute;
	top: var(--space-2);
	left: var(--space-2);
	z-index: 1000;
	padding: var(--space-3) var(--space-4);
	background: var(--color-brand);
	color: var(--color-text-on-brand);
	font-size: var(--fs-sm);
	font-weight: var(--fw-bold);
	border-radius: var(--radius-md);
	text-decoration: none;
	transform: translateY(-200%);
	transition: transform var(--duration-fast) var(--ease-out-expo);
}

.skip-link:focus {
	transform: translateY(0);
}

main {
	display: flex;
	flex-direction: column;
}

main > section {
	width: 100%;
}


/* ============================================================
 * LP 専用ヘッダー（最小化：ロゴ＋tel＋第一CTA）
 * sticky で常時可視。SP では tel と CTA をコンパクトに。
 * ============================================================ */
.lp-meo-header {
	position: fixed;
	inset: 0 0 auto 0;
	z-index: var(--z-header);
	background: rgba(250, 249, 247, 0.92);
	backdrop-filter: blur(var(--blur-md));
	-webkit-backdrop-filter: blur(var(--blur-md));
	border-bottom: 1px solid var(--color-border-subtle);
	transition: transform var(--duration-base) var(--ease-out-expo);
}

.lp-meo-header__inner {
	max-width: var(--container-wide);
	margin-inline: auto;
	padding: var(--space-3) var(--space-5);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-4);
	min-height: 64px;
}

@media (min-width: 768px) {
	.lp-meo-header__inner {
		padding: var(--space-3) var(--space-6);
	}
}

.lp-meo-header__logo img {
	height: 24px;
	width: auto;
}

@media (min-width: 768px) {
	.lp-meo-header__logo img {
		height: 28px;
	}
}

.lp-meo-header__actions {
	display: flex;
	align-items: center;
	gap: var(--space-3);
}

.lp-meo-header__tel {
	display: inline-flex;
	align-items: center;
	gap: var(--space-2);
	color: var(--color-text-primary);
	font-weight: var(--fw-bold);
	font-family: var(--font-sans-latin);
	font-size: var(--fs-sm);
	letter-spacing: var(--ls-tight);
	min-height: 44px;
	padding: var(--space-2) var(--space-3);
	border-radius: var(--radius-md);
	transition: color var(--duration-fast) var(--ease-out-expo), background var(--duration-fast) var(--ease-out-expo);
}

.lp-meo-header__tel:hover {
	color: var(--color-brand);
	background: var(--color-glass-brand);
}

.lp-meo-header__tel-icon {
	width: 18px;
	height: 18px;
	color: var(--color-brand);
	flex-shrink: 0;
}

@media (min-width: 768px) {
	.lp-meo-header__tel-icon {
		width: 20px;
		height: 20px;
	}
}

.lp-meo-header__tel-num {
	display: none;
}

@media (min-width: 768px) {
	.lp-meo-header__tel-num {
		display: inline;
		font-size: var(--fs-base);
	}
}

.lp-meo-header__cta {
	white-space: nowrap;
}


/* ============================================================
 * Section 00 ─ Hero（LP固有・h1 機能名詞）
 * ============================================================ */
.lp-meo-hero {
	position: relative;
	min-height: 80vh;
	display: flex;
	align-items: center;
	padding-top: calc(64px + var(--space-7));
	padding-bottom: var(--space-9);
	overflow: hidden;
	isolation: isolate;
	background: var(--color-bg-primary);
}

@media (min-width: 1024px) {
	.lp-meo-hero {
		min-height: 86vh;
	}
}

@keyframes lp-meo-hero-visual-in {
	from { opacity: 0; transform: translateY(-50%) scale(0.96); }
	to   { opacity: 1; transform: translateY(-50%) scale(1); }
}

@keyframes lp-meo-hero-visual-in-sp {
	from { opacity: 0; transform: scale(0.96); }
	to   { opacity: 1; transform: scale(1); }
}

@keyframes lp-meo-hero-fade-in {
	from { opacity: 0; transform: translateY(12px); }
	to   { opacity: 1; transform: translateY(0); }
}

/* ─── 背景の極薄メガタイポ（LP2 は Coral 寄せ） ─── */
.lp-meo-hero__bg-typo {
	position: absolute;
	inset: 0;
	z-index: 0;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	font-family: var(--font-sans-latin);
	font-size: clamp(5rem, 16vw, 16rem);
	font-weight: var(--fw-extrabold);
	/* LP2：Copper 寄せ（LP1 は text-primary） */
	color: #9E6743;
	opacity: 0.07;
	letter-spacing: var(--ls-tight);
	white-space: nowrap;
	user-select: none;
	overflow: hidden;
	pointer-events: none;
}

/* SP では bg-typo を一段薄くして本文の可読性を最優先 */
@media (max-width: 767px) {
	.lp-meo-hero__bg-typo {
		opacity: 0.04;
		font-size: clamp(4rem, 18vw, 8rem);
	}
}

.lp-meo-hero__bg-typo span {
	display: block;
}

.lp-meo-hero__bg-typo span:first-child {
	transform: translateX(-8%);
}

.lp-meo-hero__bg-typo span:last-child {
	transform: translateX(8%);
	text-align: right;
}

/* ─── ヒーロー右側の SVG コンポジション ─── */
.lp-meo-hero__visual {
	position: absolute;
	top: 50%;
	right: max(var(--space-7), calc((100vw - var(--container-wide)) / 2 + var(--space-7)));
	transform: translateY(-50%);
	width: 44%;
	max-width: 560px;
	z-index: 0;
	pointer-events: none;
	overflow: visible;
	opacity: 0;
	animation: lp-meo-hero-visual-in var(--duration-slowest) var(--ease-out-expo) 1.2s forwards;
}

.lp-meo-hero__visual svg {
	width: 100%;
	height: auto;
	display: block;
	overflow: visible;
}

/* SP・タブレット（〜1023px）：ヒーローSVGはテキストの「下」にフルサイズで段組み */
@media (max-width: 1023px) {
	.lp-meo-hero {
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		min-height: auto;
		padding-bottom: var(--space-7);
	}

	.lp-meo-hero__visual {
		position: static;
		top: auto;
		right: auto;
		transform: none;
		width: 100%;
		max-width: 480px;
		margin-inline: auto;
		margin-top: var(--space-7);
		padding-inline: var(--space-4);
		opacity: 0;
		animation-name: lp-meo-hero-visual-in-sp;
		order: 2;
	}

	.lp-meo-hero__inner {
		order: 1;
	}
}

/* タブレット（768〜1023px）：ヒーローSVG はワイドな視野を活かして大型化 */
@media (min-width: 768px) and (max-width: 1023px) {
	.lp-meo-hero__visual {
		max-width: 560px;
		margin-top: var(--space-8);
	}
}

/* ─── 中身コンテナ ─── */
.lp-meo-hero__inner {
	position: relative;
	z-index: 1;
}

.lp-meo-hero__content {
	display: flex;
	flex-direction: column;
	gap: var(--space-5);
	width: 100%;
	max-width: 640px;
}

@media (min-width: 1024px) {
	.lp-meo-hero__content {
		max-width: 720px;  /* h1 が 2行で確実に収まる幅 */
		margin-right: auto;
	}
}

.lp-meo-hero__overline {
	font-family: var(--font-sans-latin);
	font-size: var(--fs-xs);
	font-weight: var(--fw-semibold);
	letter-spacing: var(--ls-widest);
	text-transform: uppercase;
	color: var(--color-brand);
	margin: 0;
	opacity: 0;
	animation: lp-meo-hero-fade-in var(--duration-slow) var(--ease-out-expo) 0.4s forwards;
}

.lp-meo-hero__title {
	font-size: var(--fs-display-md);
	line-height: 1.15;
	letter-spacing: var(--ls-tighter);
	color: var(--color-text-primary);
	font-weight: var(--fw-extrabold);
	font-feature-settings: "palt";
	margin-top: var(--space-3);
	max-width: none;
	text-wrap: balance;
	opacity: 0;
	animation: lp-meo-hero-fade-in var(--duration-slow) var(--ease-out-expo) 0.6s forwards;
}

/* h1 の各行を inline-block で1かたまり扱い → 句点が孤立しないよう改行を制御 */
.lp-meo-hero__title-line {
	display: inline-block;
}

@media (min-width: 1024px) {
	.lp-meo-hero__title-line {
		white-space: nowrap;
	}
}

/* SP（〜767px）：h1 サイズと行間を調整。
   句点付き見出し「Googleマップで、最初に見つかる店舗へ。」は
   読点と句点で2行に分ける構造。SPでは横はみ出し回避を優先し、text-flow.css 側で折り返しを許可する。 */
@media (max-width: 767px) {
	.lp-meo-hero__title {
		font-size: clamp(1.875rem, 7.6vw, 2.5rem);  /* 30〜40px：MEO 名称が長いため LP1 より一段控えめ */
		line-height: 1.25;
		letter-spacing: -0.02em;
		max-width: none;
	}
}

/* 狭幅（〜380px：iPhone SE 等）では h1 を一段小さく：固有名詞「Googleマップ」の収まり優先 */
@media (max-width: 380px) {
	.lp-meo-hero__title {
		font-size: clamp(1.625rem, 7.2vw, 1.875rem);  /* 26〜30px */
		line-height: 1.3;
	}
}

/* 対象者文（h1 と lead の間）：誰のどの状況を扱うかを 1行で示す。 */
.lp-meo-hero__audience {
	margin-top: var(--space-3);
	font-size: var(--fs-md);
	color: var(--color-text-secondary);
	line-height: 1.7;
	max-width: 60ch;
	text-wrap: pretty;
	opacity: 0;
	animation: lp-meo-hero-fade-in var(--duration-slow) var(--ease-out-expo) 0.8s forwards;
}

@media (max-width: 767px) {
	.lp-meo-hero__audience {
		font-size: var(--fs-base);
	}
}

.lp-meo-hero__lead {
	font-size: var(--fs-lg);
	color: var(--color-text-secondary);
	line-height: var(--lh-loose);
	max-width: 60ch;
	text-wrap: pretty;
	opacity: 0;
	animation: lp-meo-hero-fade-in var(--duration-slow) var(--ease-out-expo) 1.0s forwards;
}

.lp-meo-hero__lead strong {
	color: var(--color-text-primary);
	font-weight: var(--fw-bold);
}

/* Hero 直下のミニ3点：「相談で確認すること」を CTA 直前に配置。
   塗り背景・全周枠線・角丸padding大は使わず、シンプルなチェック付きリスト。 */
.lp-meo-hero__mini {
	margin-top: var(--space-4);
	padding-top: var(--space-4);
	border-top: 1px solid var(--color-border-subtle);
	opacity: 0;
	animation: lp-meo-hero-fade-in var(--duration-slow) var(--ease-out-expo) 1.1s forwards;
}

.lp-meo-hero__mini-label {
	font-family: var(--font-sans-latin);
	font-size: var(--fs-xs);
	font-weight: var(--fw-extrabold);
	letter-spacing: var(--ls-widest);
	text-transform: uppercase;
	color: var(--color-brand);
	margin: 0 0 var(--space-2);
}

.lp-meo-hero__mini-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
	font-size: var(--fs-base);
	color: var(--color-text-primary);
	line-height: var(--lh-relaxed);
}

.lp-meo-hero__mini-list li {
	position: relative;
	padding-left: calc(var(--space-4) + var(--space-2));
}

/* チェックマーク（インラインSVG ではなく ::before で十分） */
.lp-meo-hero__mini-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.55em;
	width: 14px;
	height: 8px;
	border-left: 2px solid var(--color-brand);
	border-bottom: 2px solid var(--color-brand);
	transform: rotate(-45deg);
}

.lp-meo-hero__cta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3);
	margin-top: var(--space-4);
	opacity: 0;
	animation: lp-meo-hero-fade-in var(--duration-slow) var(--ease-out-expo) 1.3s forwards;
}

.lp-meo-hero__notes {
	margin-top: var(--space-3);
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
	font-size: var(--fs-sm);
	color: var(--color-text-muted);
	line-height: var(--lh-relaxed);
	opacity: 0;
	animation: lp-meo-hero-fade-in var(--duration-slow) var(--ease-out-expo) 1.4s forwards;
}

.lp-meo-hero__notes li {
	position: relative;
	padding-left: var(--space-4);
}

.lp-meo-hero__notes li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.7em;
	width: 8px;
	height: 1px;
	background: var(--color-brand);
}


/* ============================================================
 * Section 00.5 ─ Trust Bar（共通仕様：ローカル複製）
 * ============================================================ */
.trust-bar {
	position: relative;
	padding-block: var(--space-5);
	background: var(--color-bg-surface);
	border-block: 1px solid var(--color-border-subtle);
	z-index: 2;
}

.trust-bar__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--space-4);
}

.trust-bar__label {
	font-family: var(--font-sans-latin);
	font-size: var(--fs-xs);
	font-weight: var(--fw-semibold);
	letter-spacing: var(--ls-widest);
	text-transform: uppercase;
	color: var(--color-brand);
	margin: 0;
}

.trust-bar__metrics {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--space-3) var(--space-4);
	font-size: var(--fs-sm);
	color: var(--color-text-secondary);
}

.trust-bar__metrics strong {
	color: var(--color-text-primary);
	font-weight: var(--fw-bold);
}

.trust-bar__divider {
	display: inline-block;
	width: 1px;
	height: 1em;
	background: var(--color-border-default);
}


/* ============================================================
 * 共通：機能名詞 h2 セクションヘッダー
 * lp-meo-shift / lp-meo-vs / lp-meo-service / lp-meo-flow /
 * lp-meo-faq / lp-meo-form-section / lp-meo-privacy
 * ============================================================ */
.lp-meo-shift,
.lp-meo-vs,
.lp-meo-service,
.lp-meo-flow,
.lp-meo-faq,
.lp-meo-form-section,
.lp-meo-privacy {
	position: relative;
	padding-block: var(--space-9);
	background: var(--color-bg-primary);
	overflow: hidden;
	isolation: isolate;
}

@media (min-width: 1024px) {
	.lp-meo-shift,
	.lp-meo-vs,
	.lp-meo-service,
	.lp-meo-flow,
	.lp-meo-faq,
	.lp-meo-form-section,
	.lp-meo-privacy {
		padding-block: var(--space-10);
	}
}

@media (max-width: 767px) {
	.lp-meo-shift,
	.lp-meo-vs,
	.lp-meo-service,
	.lp-meo-flow,
	.lp-meo-faq,
	.lp-meo-form-section,
	.lp-meo-privacy {
		padding-block: var(--space-8);  /* 64px */
	}
}

.lp-meo-shift__header,
.lp-meo-vs__header,
.lp-meo-service__header,
.lp-meo-flow__header,
.lp-meo-faq__header,
.lp-meo-form-section__header,
.lp-meo-privacy__header,
.lp-meo-promise__header {
	margin-bottom: var(--space-7);
	max-width: 760px;
	position: relative;
}

@media (max-width: 767px) {
	.lp-meo-shift__header,
	.lp-meo-vs__header,
	.lp-meo-service__header,
	.lp-meo-flow__header,
	.lp-meo-faq__header,
	.lp-meo-form-section__header,
	.lp-meo-privacy__header,
	.lp-meo-promise__header {
		margin-bottom: var(--space-6);
	}
}

.lp-meo-shift__title,
.lp-meo-vs__title,
.lp-meo-service__title,
.lp-meo-flow__title,
.lp-meo-faq__title,
.lp-meo-form-section__title,
.lp-meo-privacy__title,
.lp-meo-promise__title {
	font-size: var(--fs-display-md);
	font-weight: var(--fw-extrabold);
	line-height: var(--lh-tight);
	letter-spacing: var(--ls-tight);
	color: var(--color-text-primary);
	font-feature-settings: "palt";
	margin-top: var(--space-3);
}

/* PC（≥1024px）：親 max-width に縛られず1行表示を確保 */
@media (min-width: 1024px) {
	.lp-meo-form-section__title {
		white-space: nowrap;
	}
}

/* 句点付き／改行制御 h2 の各行を inline-block で1かたまり扱い → 句点・助詞孤立を防ぐ */
.lp-meo-promise__title-line,
.lp-meo-shift__title-line {
	display: inline-block;
	white-space: nowrap;
}

@media (max-width: 360px) {
	.lp-meo-promise__title-line,
	.lp-meo-shift__title-line {
		white-space: normal;
	}
}

/* lp-meo-promise__lead の2文を句点で改行表示。
   各文を inline-block で1かたまり扱いにし、文の途中で割れないよう保護。
   ただし狭い画面（SP）では1文目が長く、横スクロール発生防止のため nowrap を解除する。 */
.lp-meo-promise__lead-line {
	display: inline-block;
}

@media (min-width: 768px) {
	.lp-meo-promise__lead-line {
		white-space: nowrap;
	}
}

@media (max-width: 767px) {
	.lp-meo-shift__title,
	.lp-meo-vs__title,
	.lp-meo-service__title,
	.lp-meo-flow__title,
	.lp-meo-faq__title,
	.lp-meo-form-section__title,
	.lp-meo-privacy__title {
		font-size: clamp(1.625rem, 7vw, 2rem);  /* 26〜32px */
		line-height: 1.3;
	}
}

/* Section 02・03 の h2 はタブレット以上のみ1行表示。
   SPでは横はみ出し回避を優先し、text-flow.css 側で折り返しを許可する。 */
@media (min-width: 768px) {
	.lp-meo-vs__title,
	.lp-meo-service__title {
		white-space: nowrap;
		word-break: keep-all;
	}
}

@media (max-width: 374px) {
	.lp-meo-vs__title,
	.lp-meo-service__title {
		font-size: clamp(1.375rem, 6vw, 1.625rem);  /* 22〜26px：iPhone SE 等の狭画面で1行収め */
	}
}

/* TL;DR：プレーンテキスト＋下マージン。box 化禁止 */
.lp-meo-shift__tldr,
.lp-meo-vs__tldr,
.lp-meo-service__tldr,
.lp-meo-flow__tldr,
.lp-meo-faq__tldr,
.lp-meo-form-section__tldr,
.lp-meo-privacy__tldr,
.lp-meo-promise__lead {
	margin-top: var(--space-4);
	font-size: var(--fs-base);
	color: var(--color-text-secondary);
	line-height: var(--lh-loose);
	max-width: 64ch;
	text-wrap: pretty;
}

.lp-meo-shift__tldr strong,
.lp-meo-vs__tldr strong,
.lp-meo-service__tldr strong,
.lp-meo-flow__tldr strong,
.lp-meo-faq__tldr strong,
.lp-meo-form-section__tldr strong,
.lp-meo-privacy__tldr strong,
.lp-meo-promise__lead strong {
	color: var(--color-text-primary);
	font-weight: var(--fw-semibold);
}


/* ============================================================
 * Section 01 ─ lp-meo-shift（市場の事実）
 * ============================================================ */
.lp-meo-shift__body {
	display: flex;
	flex-direction: column;
	gap: var(--space-4);
	max-width: 64ch;
	font-size: var(--fs-base);
	line-height: var(--lh-loose);
	color: var(--color-text-secondary);
	text-wrap: pretty;
}

.lp-meo-shift__body p {
	margin: 0;
	max-width: 64ch;
}

.lp-meo-shift__body strong {
	color: var(--color-text-primary);
	font-weight: var(--fw-semibold);
}

.lp-meo-shift__body a {
	color: var(--color-brand);
	font-weight: var(--fw-semibold);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	transition: color var(--duration-fast) var(--ease-out-expo);
}

.lp-meo-shift__body a:hover {
	color: var(--color-brand-700);
}

.lp-meo-shift__points {
	margin-top: var(--space-7);
	display: flex;
	flex-direction: column;
	gap: var(--space-4);
	list-style: none;
	padding: 0;
}

/* PC（≥1024px）：上下分離のレイアウト
   上：header（h2 + TL;DR）── フル幅
   下：body（説明文段落・出典付き）＝ 左カラム
       points（3ポイント・01/02/03）   ＝ 右カラム */
@media (min-width: 1024px) {
	.lp-meo-shift__inner {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		column-gap: var(--space-8);
		row-gap: var(--space-7);
		align-items: start;
	}

	.lp-meo-shift__header {
		grid-column: 1 / -1;
		grid-row: 1;
	}

	.lp-meo-shift__body {
		grid-column: 1;
		grid-row: 2;
		max-width: none;
	}

	.lp-meo-shift__body p {
		max-width: 60ch;
	}

	.lp-meo-shift__points {
		grid-column: 2;
		grid-row: 2;
		margin-top: 0;
		align-self: start;
	}
}

.lp-meo-shift__points li {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: var(--space-4);
	align-items: start;
	padding: var(--space-4) 0;
	border-top: 1px solid var(--color-border-subtle);
}

.lp-meo-shift__points li:first-child {
	border-top: none;
	padding-top: 0;
}

.lp-meo-shift__points-num {
	font-family: var(--font-sans-latin);
	font-size: var(--fs-xl);
	font-weight: var(--fw-extrabold);
	letter-spacing: var(--ls-tight);
	/* LP2 アクセント差し替え：ポイント番号は Copper（Web集客の温度をコッパー系で出す） */
	color: #9E6743;
	line-height: 1;
	font-feature-settings: "tnum";
	min-width: 2ch;
}

.lp-meo-shift__points-body {
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
}

.lp-meo-shift__points-body strong {
	font-size: var(--fs-lg);
	font-weight: var(--fw-bold);
	color: var(--color-text-primary);
	line-height: var(--lh-snug);
	letter-spacing: var(--ls-tight);
}

.lp-meo-shift__points-body span {
	font-size: var(--fs-sm);
	color: var(--color-text-secondary);
	line-height: var(--lh-loose);
	text-wrap: pretty;
}

.lp-meo-shift__points-body span strong {
	font-size: inherit;
	font-weight: var(--fw-bold);
	color: var(--color-text-primary);
}


/* ============================================================
 * Section 02 ─ lp-meo-vs（SEO/SNS/MEO 比較表・3カラム比較）
 *   a11y 改善：<table> 一本に統一。SP では各行を grid で縦再構成し、
 *   スクリーンリーダーでも観点 → SEO → SNS → MEO の順で読める構造。
 * ============================================================ */

.lp-meo-vs__table-wrap {
	-webkit-overflow-scrolling: touch;
}

.lp-meo-vs__table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--fs-sm);
	line-height: var(--lh-relaxed);
	background: var(--color-bg-surface);
	border-radius: var(--radius-lg);
	overflow: hidden;
}

.lp-meo-vs__table th,
.lp-meo-vs__table td {
	padding: var(--space-4) var(--space-5);
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid var(--color-border-subtle);
}

.lp-meo-vs__table thead th {
	background: var(--color-bg-elevated);
	color: var(--color-text-primary);
	font-weight: var(--fw-bold);
	font-size: var(--fs-base);
}

.lp-meo-vs__table tbody th {
	color: var(--color-text-primary);
	font-weight: var(--fw-bold);
	width: 18%;
}

.lp-meo-vs__table tbody td {
	color: var(--color-text-secondary);
}

.lp-meo-vs__col-highlight {
	background: var(--color-glass-brand);
	color: var(--color-text-primary);
}

.lp-meo-vs__table tbody td.lp-meo-vs__col-highlight {
	color: var(--color-text-primary);
	font-weight: var(--fw-semibold);
}

.lp-meo-vs__table tbody tr:last-child th,
.lp-meo-vs__table tbody tr:last-child td {
	border-bottom: none;
}

/* SP（767px以下）：table を block 化し、各 tr を grid で縦再構成 */
@media (max-width: 767px) {

	.lp-meo-vs__table {
		display: block;
		background: transparent;
		border-radius: 0;
		overflow: visible;
		font-size: var(--fs-sm);
	}

	.lp-meo-vs__table thead {
		/* 視覚的にのみ隠す。SR には不要（行ヘッダで十分文脈が伝わるため）。 */
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
		border: 0;
	}

	.lp-meo-vs__table tbody {
		display: flex;
		flex-direction: column;
		gap: var(--space-4);
	}

	.lp-meo-vs__table tbody tr {
		display: grid;
		grid-template-columns: 1fr;
		gap: var(--space-2);
		padding: var(--space-4);
		background: var(--color-bg-surface);
		border: 1px solid var(--color-border-subtle);
		border-radius: var(--radius-lg);
	}

	.lp-meo-vs__table tbody th[scope="row"] {
		width: auto;
		padding: 0 0 var(--space-2);
		border-bottom: 1px dashed var(--color-border-subtle);
		font-family: var(--font-sans-latin);
		font-size: var(--fs-xs);
		font-weight: var(--fw-extrabold);
		letter-spacing: var(--ls-widest);
		text-transform: uppercase;
		color: var(--color-brand);
	}

	.lp-meo-vs__table tbody td {
		padding: var(--space-2) 0;
		border-bottom: none;
		display: grid;
		grid-template-columns: 56px 1fr;
		gap: var(--space-3);
		align-items: baseline;
	}

	/* data-axis（SEO / SNS / MEO）の値を ::before で表示。
	   SEO/SNS はミュート色のチップ、MEO はブランド色のチップ。 */
	.lp-meo-vs__table tbody td::before {
		content: attr(data-axis);
		font-family: var(--font-sans-latin);
		font-size: var(--fs-xs);
		font-weight: var(--fw-bold);
		letter-spacing: var(--ls-wider);
		text-transform: uppercase;
		text-align: center;
		padding: var(--space-1) var(--space-2);
		background: var(--color-bg-elevated);
		color: var(--color-text-muted);
		border-radius: var(--radius-sm);
	}

	.lp-meo-vs__table tbody td.lp-meo-vs__col-highlight {
		background: transparent;
	}

	.lp-meo-vs__table tbody td.lp-meo-vs__col-highlight::before {
		background: var(--color-brand);
		color: var(--color-text-on-brand);
	}

	.lp-meo-vs__table tbody td.lp-meo-vs__col-highlight {
		color: var(--color-text-primary);
		font-weight: var(--fw-semibold);
	}

	.lp-meo-vs__table tbody tr:last-child {
		border-bottom: 1px solid var(--color-border-subtle);
	}

}

.lp-meo-vs__key-message {
	margin-top: var(--space-7);
	font-size: var(--fs-base);
	color: var(--color-text-secondary);
	line-height: var(--lh-loose);
	max-width: 64ch;
	text-wrap: pretty;
}

.lp-meo-vs__key-message strong {
	color: var(--color-text-primary);
	font-weight: var(--fw-semibold);
}

.lp-meo-vs__note {
	margin-top: var(--space-4);
	padding-left: var(--space-4);
	border-left: 2px solid var(--color-brand-300);
	font-size: var(--fs-sm);
	color: var(--color-text-muted);
	line-height: var(--lh-loose);
	max-width: 64ch;
	text-wrap: pretty;
}


/* ============================================================
 * Section 03 ─ lp-meo-service（提供範囲＋3強み）
 * ============================================================ */
.lp-meo-service__scope {
	margin-bottom: var(--space-9);
	max-width: 880px;
}

.lp-meo-service__scope-title {
	font-family: var(--font-sans-latin);
	font-size: var(--fs-base);
	font-weight: var(--fw-bold);
	letter-spacing: var(--ls-widest);
	text-transform: uppercase;
	color: var(--color-brand);
	margin-bottom: var(--space-4);
}

.lp-meo-service__scope-list {
	display: flex;
	flex-direction: column;
	gap: var(--space-4);
	list-style: none;
	padding: 0;
	margin: 0;
}

.lp-meo-service__scope-list li {
	display: flex;
	flex-direction: column;
	gap: var(--space-1);
	padding: var(--space-1) 0 var(--space-1) var(--space-5);
	position: relative;
}

.lp-meo-service__scope-list li::before {
	content: "";
	position: absolute;
	left: 4px;
	top: calc(var(--space-1) + 0.55em);
	width: 8px;
	height: 8px;
	border-radius: 50%;
	/* LP2 アクセント差し替え：スコープリストのドットを Copper（行動色）に */
	background: #C9885F;
}

.lp-meo-service__scope-list li strong {
	font-size: var(--fs-base);
	color: var(--color-text-primary);
	font-weight: var(--fw-bold);
}

.lp-meo-service__scope-list li span {
	font-size: var(--fs-sm);
	color: var(--color-text-secondary);
	line-height: var(--lh-relaxed);
	text-wrap: pretty;
}

/* ── 3つの強み（カードグリッド：POP アイコン付き） ── */
.lp-meo-strengths {
	margin-top: var(--space-7);
}

.lp-meo-strengths__title {
	font-family: var(--font-sans-latin);
	font-size: var(--fs-base);
	font-weight: var(--fw-bold);
	letter-spacing: var(--ls-widest);
	text-transform: uppercase;
	color: var(--color-brand);
	margin-bottom: var(--space-5);
}

.lp-meo-strengths__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-5);
	max-width: 640px;
	margin-inline: auto;
}

@media (min-width: 768px) and (max-width: 1023px) {
	.lp-meo-strengths__grid {
		grid-template-columns: repeat(2, 1fr);
		max-width: 920px;
	}
}

@media (min-width: 1024px) {
	.lp-meo-strengths__grid {
		grid-template-columns: repeat(3, 1fr);
		max-width: none;
	}
}

.lp-meo-strength {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	padding: var(--space-6);
	background: var(--color-bg-surface);
	border: 1px solid var(--color-border-subtle);
	border-radius: var(--radius-xl);
	transition:
		border-color var(--duration-base) var(--ease-out-expo),
		transform    var(--duration-base) var(--ease-out-expo),
		box-shadow   var(--duration-slow) var(--ease-out-expo),
		background   var(--duration-fast) var(--ease-out-expo);
}

.lp-meo-strength:hover {
	border-color: var(--color-border-brand);
	transform: translateY(-4px);
	box-shadow: var(--shadow-lg), var(--shadow-glow-brand);
	background: var(--color-bg-elevated);
}

.lp-meo-strength__icon {
	width: 72px;
	height: 72px;
	margin-bottom: var(--space-2);
}

.lp-meo-strength__icon svg {
	width: 100%;
	height: 100%;
}

.lp-meo-strength__number {
	font-family: var(--font-sans-latin);
	font-size: var(--fs-xs);
	font-weight: var(--fw-bold);
	letter-spacing: var(--ls-widest);
	text-transform: uppercase;
	color: var(--color-brand-300);
}

.lp-meo-strength__heading {
	font-size: var(--fs-xl);
	font-weight: var(--fw-bold);
	line-height: var(--lh-snug);
	letter-spacing: var(--ls-tight);
	color: var(--color-text-primary);
	margin: 0;
	text-wrap: balance;
}

.lp-meo-strength__desc {
	font-size: var(--fs-sm);
	color: var(--color-text-secondary);
	line-height: var(--lh-loose);
	margin: 0;
	text-wrap: pretty;
}

.lp-meo-strength__desc strong {
	color: var(--color-text-primary);
	font-weight: var(--fw-bold);
}


/* ============================================================
 * Section 04 ─ lp-meo-flow（5 Step・縦タイムライン型）
 *   AIっぽい callout box（塗り背景＋全周枠線＋border-left太枠線＋角丸padding大）
 *   は禁止。代わりに「左端1pxの縦ライン＋番号丸」を使うタイムライン型で実装。
 *   各ステップは塗りなし／全周枠線なし／角丸padding大なし。
 *
 *   【整列の単一情報源】
 *   flow と FAQ のテキスト本文（左端・右端・中心線）をピクセルパーフェクトで揃えるため、
 *   両セクションとも .lp-meo-stack（max-width 880px・margin-inline auto）を共通親とする。
 *   テキスト本文の左端 = .lp-meo-stack の content-box 左端。
 *   番号丸・縦線は .lp-meo-stack に対して absolute 配置し、テキスト本文の幅・中心に
 *   一切影響を与えない。
 *
 *   ※ LP1（lp-geo-stack）と並列のため独立定義。components.css には触れない（衝突回避）。
 * ============================================================ */

/* ─── 共通スタックラッパー：flow / FAQ で完全同一の幅・margin・padding ─── */
.lp-meo-stack {
	position: relative;
	max-width: 880px;
	margin-inline: auto;
	width: 100%;
}

/* ─── 共通定義の .lp-meo-flow__header / .lp-meo-faq__header に
       max-width: 760px が当たっているのを上書き。stack の幅 880px にフルで広げる ─── */
.lp-meo-stack > .lp-meo-flow__header,
.lp-meo-stack > .lp-meo-faq__header {
	max-width: none;
}

/* ─── flow 内部：max-width / margin はすべて .lp-meo-stack に集約 ─── */
.lp-meo-flow__header {
	position: relative;
}

.lp-meo-flow__list {
	list-style: none;
	padding: 0;
	margin: 0;
	position: relative;
	display: flex;
	flex-direction: column;
	gap: var(--space-6);
}

/* タイムラインの縦ライン：list の content-box 左端から 12px の位置（番号丸の中心）。 */
.lp-meo-stack--flow .lp-meo-flow__list::before {
	content: "";
	position: absolute;
	top: 12px;
	bottom: 12px;
	left: 12px;
	width: 1px;
	background: var(--color-border-brand);
}

.lp-meo-flow__step {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: var(--space-1);
	background: transparent;
	border: none;
	border-radius: 0;
	/* 番号丸 24px + gap 12px = 36px ぶん右にテキストをインデント */
	padding-left: 36px;
}

/* 番号丸：.lp-meo-flow__step を起点に absolute 配置 */
.lp-meo-flow__step::before {
	content: "";
	position: absolute;
	top: 4px;
	left: 0;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--color-brand);
	box-shadow: 0 0 0 3px var(--color-bg-primary);
}

/* 狭幅（〜380px）：番号丸を 20px に縮小、padding-left も 30px に。 */
@media (max-width: 380px) {
	.lp-meo-flow__step {
		padding-left: 30px;
	}

	.lp-meo-flow__step::before {
		width: 20px;
		height: 20px;
	}

	.lp-meo-stack--flow .lp-meo-flow__list::before {
		left: 10px;
	}
}

.lp-meo-flow__step-num {
	display: inline-flex;
	align-items: center;
	gap: var(--space-2);
	font-family: var(--font-sans-latin);
	font-size: var(--fs-xs);
	font-weight: var(--fw-extrabold);
	letter-spacing: var(--ls-widest);
	text-transform: uppercase;
	color: var(--color-brand);
	font-feature-settings: "tnum";
}

.lp-meo-flow__step-heading {
	font-size: var(--fs-xl);
	font-weight: var(--fw-bold);
	line-height: var(--lh-snug);
	letter-spacing: var(--ls-tight);
	color: var(--color-text-primary);
	margin: 0;
	text-wrap: balance;
}

.lp-meo-flow__step-desc {
	font-size: var(--fs-sm);
	color: var(--color-text-secondary);
	line-height: var(--lh-loose);
	/* 見出しの下の説明文を右にインデントして視覚階層を出す */
	margin: var(--space-2) 0 0 var(--space-6);
	max-width: 64ch;
	text-wrap: pretty;
}

.lp-meo-flow__step-desc strong {
	color: var(--color-text-primary);
	font-weight: var(--fw-bold);
}


/* ============================================================
 * Section 06 ─ lp-meo-faq（contact-faq 流用構造）
 *
 *   flow と幅・中心線を完全一致させるため、共通の .lp-meo-stack を親とする。
 * ============================================================ */
.lp-meo-faq__header {
	position: relative;
}

.lp-meo-faq__list {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	margin: 0;
}

.lp-meo-faq__item {
	background: var(--color-bg-surface);
	border: 1px solid var(--color-border-subtle);
	border-radius: var(--radius-lg);
	overflow: hidden;
	transition: border-color var(--duration-fast) var(--ease-out-expo);
}

.lp-meo-faq__item[open] {
	border-color: var(--color-border-brand);
}

.lp-meo-faq__q {
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: var(--space-4);
	align-items: center;
	padding: var(--space-5) var(--space-6);
	cursor: pointer;
	list-style: none;
	min-height: 56px;
}

.lp-meo-faq__q::-webkit-details-marker {
	display: none;
}

.lp-meo-faq__q-mark {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	flex-shrink: 0;
}

.lp-meo-faq__q-mark-svg {
	width: 32px;
	height: 32px;
}

.lp-meo-faq__q-mark-num {
	font-family: var(--font-sans-latin);
	font-size: 10px;
	font-weight: var(--fw-extrabold);
	letter-spacing: var(--ls-wider);
	color: var(--color-brand);
	line-height: 1;
}

.lp-meo-faq__q-text {
	font-size: var(--fs-base);
	font-weight: var(--fw-bold);
	color: var(--color-text-primary);
	line-height: var(--lh-snug);
	letter-spacing: var(--ls-tight);
}

.lp-meo-faq__q-icon {
	display: inline-block;
	width: 20px;
	height: 20px;
	position: relative;
	flex-shrink: 0;
	transition: transform var(--duration-fast) var(--ease-out-expo);
}

.lp-meo-faq__q-icon::before,
.lp-meo-faq__q-icon::after {
	content: "";
	position: absolute;
	inset: 0;
	margin: auto;
	background: var(--color-brand);
	border-radius: 1px;
}

.lp-meo-faq__q-icon::before {
	width: 14px;
	height: 2px;
}

.lp-meo-faq__q-icon::after {
	width: 2px;
	height: 14px;
	transition: transform var(--duration-fast) var(--ease-out-expo);
}

.lp-meo-faq__item[open] .lp-meo-faq__q-icon::after {
	transform: rotate(90deg);
}

.lp-meo-faq__a {
	padding: 0 var(--space-6) var(--space-5) calc(32px + var(--space-4) + var(--space-6));
	color: var(--color-text-secondary);
	font-size: var(--fs-sm);
	line-height: var(--lh-loose);
}

.lp-meo-faq__a p {
	margin: 0;
	max-width: 64ch;
	text-wrap: pretty;
}

.lp-meo-faq__a p + p {
	margin-top: var(--space-3);
}

.lp-meo-faq__a strong {
	color: var(--color-text-primary);
	font-weight: var(--fw-bold);
}


/* ============================================================
 * Section 07 ─ lp-meo-promise（ダーク強調・3つの約束）
 * services-strengths と統一トーン
 * ============================================================ */
.lp-meo-promise {
	position: relative;
	padding-block: var(--space-9);
	background: var(--color-bg-dark-primary);
	color: var(--color-text-dark-primary);
	overflow: hidden;
	isolation: isolate;
}

@media (min-width: 1024px) {
	.lp-meo-promise {
		padding-block: var(--space-10);
	}
}

@media (max-width: 767px) {
	.lp-meo-promise {
		padding-block: var(--space-8);
	}
}

.lp-meo-promise__header {
	margin-bottom: var(--space-8);
	text-align: center;
	max-width: 720px;
	margin-inline: auto;
}

@media (max-width: 767px) {
	.lp-meo-promise__header {
		text-align: left;
		margin-bottom: var(--space-6);
	}
}

/* ダーク背景上の装飾は明度を抑える */
.lp-meo-promise__header .section-decor {
	opacity: 0.55;
}

.lp-meo-promise__title {
	font-size: var(--fs-display-md);
	font-weight: var(--fw-extrabold);
	line-height: var(--lh-tight);
	letter-spacing: var(--ls-tight);
	color: var(--color-text-dark-primary);
	font-feature-settings: "palt";
	margin-top: var(--space-3);
}

@media (max-width: 767px) {
	.lp-meo-promise__title {
		font-size: clamp(1.625rem, 7vw, 2rem);
		line-height: 1.3;
	}
}

/* h2 内の各行：句点孤立防止 */
.lp-meo-promise__title-line {
	display: inline-block;
	white-space: nowrap;
}

@media (max-width: 360px) {
	.lp-meo-promise__title-line {
		white-space: normal;
	}
}

.lp-meo-promise__lead {
	color: var(--color-text-dark-secondary);
	max-width: 60ch;
	margin-inline: auto;
}

@media (max-width: 767px) {
	.lp-meo-promise__lead {
		margin-inline: 0;
	}
}

.lp-meo-promise__lead strong {
	color: var(--color-text-dark-primary);
}

/* ダーク内のセクションラベル */
.lp-meo-promise .section-label__num,
.lp-meo-promise .section-label__en {
	color: var(--color-brand-300);
}

.lp-meo-promise .section-label__line {
	background: var(--color-brand-300);
	opacity: 0.6;
}

/* ダーク背景上の bg-mega-typo は明色＋薄め */
.lp-meo-promise .bg-mega-typo {
	color: var(--color-text-dark-primary);
	opacity: 0.04;
}

.lp-meo-promise__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-5);
	max-width: 640px;
	margin-inline: auto;
}

@media (min-width: 768px) and (max-width: 1023px) {
	.lp-meo-promise__grid {
		grid-template-columns: repeat(2, 1fr);
		max-width: 920px;
	}
}

@media (min-width: 1024px) {
	.lp-meo-promise__grid {
		grid-template-columns: repeat(3, 1fr);
		max-width: none;
	}
}

.lp-meo-promise__card {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	padding: var(--space-6);
	background: var(--color-bg-dark-surface);
	border: 1px solid var(--color-border-dark-subtle);
	border-radius: var(--radius-xl);
	transition:
		border-color var(--duration-base) var(--ease-out-expo),
		transform    var(--duration-base) var(--ease-out-expo),
		background   var(--duration-fast) var(--ease-out-expo);
}

.lp-meo-promise__card:hover {
	background: var(--color-bg-dark-elevated);
	border-color: var(--color-border-dark-default);
	transform: translateY(-4px);
}

.lp-meo-promise__card-num {
	font-family: var(--font-sans-latin);
	font-size: var(--fs-xs);
	font-weight: var(--fw-bold);
	letter-spacing: var(--ls-widest);
	text-transform: uppercase;
	color: var(--color-brand-300);
}

.lp-meo-promise__card-title {
	font-size: var(--fs-xl);
	font-weight: var(--fw-bold);
	line-height: var(--lh-snug);
	letter-spacing: var(--ls-tight);
	color: var(--color-text-dark-primary);
	margin: 0;
	text-wrap: balance;
}

.lp-meo-promise__card-desc {
	font-size: var(--fs-sm);
	color: var(--color-text-dark-secondary);
	line-height: var(--lh-loose);
	margin: 0;
	text-wrap: pretty;
}

.lp-meo-promise__card-desc strong {
	color: var(--color-text-dark-primary);
	font-weight: var(--fw-bold);
}


/* ============================================================
 * Section 08 ─ lp-meo-form-section（CF7 placeholder）
 * 本LPは contact.css を読まないので、フォーム関連の最小限スタイルを定義する。
 * ============================================================ */

.contact-form,
.lp-meo-form,
.wpcf7-form {
	display: flex;
	flex-direction: column;
	gap: var(--space-5);
	background: var(--color-bg-surface);
	border: 1px solid var(--color-border-subtle);
	border-radius: var(--radius-xl);
	padding: var(--space-6);
	max-width: 720px;
	margin-inline: auto;
	width: 100%;
}

@media (min-width: 768px) {
	.contact-form,
	.lp-meo-form,
	.wpcf7-form {
		padding: var(--space-7);
	}
}

.contact-form__field {
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
}

/* ─── CF7 自動 <p> / <br> の余白を打ち消す（Contact ページと同方針） ─── */
.wpcf7-form .contact-form__field > p:not(.contact-form__hint) {
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
}

.wpcf7-form .contact-form__field br,
.wpcf7-form .contact-form__label br {
	display: none;
}

.contact-form__label {
	font-size: var(--fs-sm);
	font-weight: var(--fw-bold);
	color: var(--color-text-primary);
	display: inline-flex;
	align-items: center;
	gap: var(--space-2);
	flex-wrap: wrap;
}

.contact-form__required {
	display: inline-block;
	padding: 2px var(--space-2);
	background: var(--color-accent);
	color: var(--color-text-on-accent);
	font-size: var(--fs-xs); /* 11px(0.6875rem)→12px：必須バッジ。最低フォントサイズ確保 */
	font-weight: var(--fw-bold);
	letter-spacing: var(--ls-wider);
	border-radius: var(--radius-sm);
	line-height: 1.4;
}

.contact-form__optional {
	display: inline-block;
	padding: 2px var(--space-2);
	background: var(--color-bg-elevated);
	color: var(--color-text-muted);
	font-size: var(--fs-xs); /* 11px(0.6875rem)→12px：任意バッジ。最低フォントサイズ確保 */
	font-weight: var(--fw-semibold);
	letter-spacing: var(--ls-wider);
	border-radius: var(--radius-sm);
	line-height: 1.4;
}

.contact-form__hint {
	font-size: var(--fs-xs);
	color: var(--color-text-muted);
	line-height: var(--lh-relaxed);
	margin: 0;
}

.contact-form__input,
.contact-form__textarea {
	width: 100%;
	padding: var(--space-3) var(--space-4);
	font-family: inherit;
	font-size: var(--fs-base);
	color: var(--color-text-primary);
	background: var(--color-bg-primary);
	border: 1px solid var(--color-border-default);
	border-radius: var(--radius-md);
	min-height: 48px;
	transition: border-color var(--duration-fast) var(--ease-out-expo),
		box-shadow var(--duration-fast) var(--ease-out-expo);
}

.contact-form__input::placeholder,
.contact-form__textarea::placeholder {
	color: var(--color-text-muted);
}

.contact-form__input:hover,
.contact-form__textarea:hover {
	border-color: var(--color-border-strong);
}

.contact-form__input:focus,
.contact-form__textarea:focus {
	outline: none;
	border-color: var(--color-brand);
	box-shadow: 0 0 0 3px rgba(6, 123, 123, 0.15);
}

.contact-form__textarea {
	resize: vertical;
	min-height: 140px;
	line-height: var(--lh-relaxed);
}

/* radio: ラジオボタン4項目（topic-options） */
.contact-form__topic-group {
	border: none;
	padding: 0;
	margin: 0;
	min-width: 0;  /* fieldset の min-content バグ回避 */
}

.contact-form__topic-options {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-3);
	margin-top: var(--space-2);
}

@media (min-width: 768px) {
	.contact-form__topic-options {
		grid-template-columns: repeat(2, 1fr);
	}
}

.contact-form__topic-option {
	display: flex;
	gap: var(--space-3);
	padding: var(--space-4);
	background: var(--color-bg-primary);
	border: 1px solid var(--color-border-default);
	border-radius: var(--radius-md);
	cursor: pointer;
	transition: border-color var(--duration-fast) var(--ease-out-expo),
		background var(--duration-fast) var(--ease-out-expo);
	min-height: 56px;
}

.contact-form__topic-option:hover {
	border-color: var(--color-border-brand);
	background: var(--color-glass-brand);
}

.contact-form__topic-option input[type="radio"] {
	margin-top: 2px;
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	accent-color: var(--color-brand);
}

.contact-form__topic-option:has(input:checked) {
	border-color: var(--color-brand);
	background: var(--color-glass-brand);
}

.contact-form__topic-option-body {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.contact-form__topic-option-title {
	font-size: var(--fs-sm);
	font-weight: var(--fw-bold);
	color: var(--color-text-primary);
	line-height: var(--lh-snug);
}

.contact-form__topic-option-desc {
	font-size: var(--fs-xs);
	color: var(--color-text-secondary);
	line-height: var(--lh-relaxed);
	text-wrap: pretty;
}

/* checkbox: 同意 */
.contact-form__field--consent {
	margin-top: var(--space-2);
}

.contact-form__consent {
	display: flex;
	gap: var(--space-3);
	cursor: pointer;
	font-size: var(--fs-sm);
	color: var(--color-text-secondary);
	line-height: var(--lh-relaxed);
	min-height: 44px;
	align-items: flex-start;
	padding: var(--space-2);
}

.contact-form__consent a {
	color: var(--color-brand);
	font-weight: var(--fw-semibold);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.contact-form__checkbox {
	margin-top: 4px;
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	accent-color: var(--color-brand);
}

/* 送信ボタン */
.contact-form__submit {
	margin-top: var(--space-3);
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	align-items: center;
}

.contact-form__submit-btn {
	width: 100%;
	max-width: 360px;
	min-height: 56px;
	font-size: var(--fs-lg);
}

.contact-form__submit-btn:disabled {
	opacity: 0.55;
	cursor: not-allowed;
}

.contact-form__submit-note {
	font-size: var(--fs-xs);
	color: var(--color-text-muted);
	line-height: var(--lh-relaxed);
	text-align: center;
	max-width: 60ch;
	margin: 0;
}

.contact-form__submit-note code {
	font-family: var(--font-mono);
	font-size: 0.75rem;
	background: var(--color-bg-elevated);
	padding: 1px 6px;
	border-radius: var(--radius-sm);
}

/* フォーム下部の補助テキスト */
.lp-meo-form-section__notes {
	margin-top: var(--space-5);
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
	font-size: var(--fs-sm);
	color: var(--color-text-muted);
	line-height: var(--lh-relaxed);
	max-width: 720px;
	margin-inline: auto;
	list-style: none;
	padding: 0;
}

.lp-meo-form-section__notes li {
	padding-left: var(--space-4);
	position: relative;
}

.lp-meo-form-section__notes li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.7em;
	width: 8px;
	height: 1px;
	background: var(--color-brand);
}


/* ============================================================
 * Section 09 ─ lp-meo-privacy（要約版）
 * ============================================================ */
.lp-meo-privacy__list {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	list-style: none;
	padding: 0;
	margin: 0;
	font-size: var(--fs-sm);
	color: var(--color-text-secondary);
	line-height: var(--lh-loose);
	max-width: 64ch;
}

.lp-meo-privacy__list li {
	position: relative;
	padding-left: var(--space-5);
	text-wrap: pretty;
}

.lp-meo-privacy__list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.7em;
	width: 12px;
	height: 1px;
	background: var(--color-brand);
}

.lp-meo-privacy__list strong {
	color: var(--color-text-primary);
	font-weight: var(--fw-semibold);
}

.lp-meo-privacy__list a {
	color: var(--color-brand);
	font-weight: var(--fw-semibold);
	text-decoration: underline;
	text-underline-offset: 3px;
}


/* ============================================================
 * LP 専用フッター（最小：法的情報＋会社情報）
 * ============================================================ */
.lp-meo-footer {
	background: var(--color-bg-surface);
	border-top: 1px solid var(--color-border-subtle);
	color: var(--color-text-secondary);
	margin-top: 0;
}

.lp-meo-footer__inner {
	padding-block: var(--space-7);
	display: flex;
	flex-direction: column;
	gap: var(--space-5);
}

@media (min-width: 1024px) {
	.lp-meo-footer__inner {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		gap: var(--space-6);
	}
}

.lp-meo-footer__brand {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
}

.lp-meo-footer__logo img {
	height: 24px;
	width: auto;
}

.lp-meo-footer__address {
	font-size: var(--fs-xs);
	color: var(--color-text-muted);
	line-height: var(--lh-relaxed);
	font-style: normal;
}

.lp-meo-footer__address a {
	color: var(--color-brand);
	font-weight: var(--fw-semibold);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.lp-meo-footer__legal {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3) var(--space-5);
	list-style: none;
	padding: 0;
	margin: 0;
	font-size: var(--fs-sm);
}

.lp-meo-footer__legal a {
	color: var(--color-text-secondary);
	transition: color var(--duration-fast) var(--ease-out-expo);
}

.lp-meo-footer__legal a:hover {
	color: var(--color-brand);
}

.lp-meo-footer__copyright {
	font-size: var(--fs-xs);
	color: var(--color-text-muted);
	margin: 0;
	font-family: var(--font-sans-latin);
	letter-spacing: var(--ls-wide);
}


/* ============================================================
 * スティッキーCTA バー（SP のみ表示・常時可視で CV 最大化）
 * ============================================================ */
.lp-meo-sticky-cta {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: var(--z-sticky);
	padding: var(--space-3) var(--space-4) calc(var(--space-3) + env(safe-area-inset-bottom, 0));
	background: rgba(250, 249, 247, 0.96);
	backdrop-filter: blur(var(--blur-md));
	-webkit-backdrop-filter: blur(var(--blur-md));
	border-top: 1px solid var(--color-border-subtle);
	display: none;
}

@media (max-width: 1023px) {
	.lp-meo-sticky-cta {
		display: block;
	}
}

.lp-meo-sticky-cta__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-2);
	width: 100%;
	min-height: 56px;
	padding: var(--space-3) var(--space-5);
	background: var(--color-brand);
	color: var(--color-text-on-brand);
	font-weight: var(--fw-bold);
	font-size: var(--fs-base);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-lg);
	transition: background var(--duration-fast) var(--ease-out-expo),
		box-shadow var(--duration-base) var(--ease-out-expo);
}

.lp-meo-sticky-cta__btn:hover {
	background: var(--color-brand-700);
	color: var(--color-text-on-brand);
	box-shadow: var(--shadow-xl), var(--shadow-glow-brand);
}

.lp-meo-sticky-cta__btn svg {
	width: 18px;
	height: 18px;
	color: currentColor;
}

/* 固定CTAの受け余白はfooter内だけに持たせ、body最下部に空白を作らない。 */
@media (max-width: 1023px) {
	body {
		padding-bottom: 0;
	}

	body:has(.lp-meo-sticky-cta) :is(.lp-meo-footer, .site-footer) {
		padding-bottom: calc(56px + var(--space-5) + env(safe-area-inset-bottom, 0));
	}
}


/* ============================================================
 * Reveal アニメーション（IntersectionObserver で発火）
 * ============================================================ */
.reveal {
	opacity: 0;
	transform: translateY(16px);
	transition:
		opacity var(--duration-slow) var(--ease-out-expo),
		transform var(--duration-slow) var(--ease-out-expo);
}

.reveal.is-visible {
	opacity: 1;
	transform: translateY(0);
}


/* ============================================================
 * タッチ端末ではホバー前提の transform を抑制
 * ============================================================ */
@media (hover: none) {
	.lp-meo-strength:hover,
	.lp-meo-promise__card:hover,
	.lp-meo-sticky-cta__btn:hover,
	.lp-meo-hero__cta .btn:hover,
	.lp-meo-header__cta:hover {
		transform: none;
		box-shadow: none;
	}

	.lp-meo-thanks-next__card:hover .lp-meo-thanks-next__card-arrow {
		transform: none;
	}
}


/* ============================================================
 * SP（〜767px）：詰まり防止と読みやすさ調整
 * ============================================================ */
@media (max-width: 767px) {
	/* hero セクション全体の上下余白：詰まらず空きすぎない */
	.lp-meo-hero {
		padding-top: calc(64px + var(--space-6));
		padding-bottom: var(--space-8);
	}

	.lp-meo-hero__visual {
		max-width: 360px;
		margin-top: var(--space-6);
	}

	.lp-meo-hero__content {
		gap: var(--space-4);
	}

	.lp-meo-hero__lead {
		font-size: var(--fs-base);  /* SPは16px：本文同等で詰まり緩和 */
		line-height: 1.85;
	}

	.lp-meo-hero__overline {
		font-size: 0.8125rem;
	}

	.lp-meo-hero__cta {
		gap: var(--space-3);
		margin-top: var(--space-5);
	}

	/* ─── 主要CTA はフル幅・56px・18px ─── */
	.lp-meo-hero__cta .btn--primary,
	.lp-meo-form .contact-form__submit-btn {
		flex: 1 1 100%;
		min-height: 56px;
		font-size: var(--fs-lg);
		justify-content: center;
	}

	.lp-meo-hero__cta .btn--ghost {
		flex: 1 1 100%;
		min-height: 48px;
		justify-content: center;
	}

	/* ─── lp-meo-shift ─── */
	.lp-meo-shift__points-num {
		font-size: var(--fs-lg);
	}

	.lp-meo-shift__points-body strong {
		font-size: var(--fs-base);
	}

	/* ─── lp-meo-vs（SP テーブル：行カード padding 微調整） ─── */
	.lp-meo-vs__table tbody tr {
		padding: var(--space-3) var(--space-4);
	}

	/* ─── lp-meo-service ─── */
	.lp-meo-service__scope {
		margin-bottom: var(--space-7);
	}

	.lp-meo-strength {
		padding: var(--space-5);
		border-radius: var(--radius-lg);
	}

	.lp-meo-strength__icon {
		width: 64px;
		height: 64px;
	}

	.lp-meo-strength__heading {
		font-size: var(--fs-lg);
	}

	/* ─── lp-meo-flow（SP）───
	   ※ padding-left は .lp-meo-stack（共通親）に集約済み（36px）。
	      ここでは flow / FAQ 個別に padding-left を足さない（足すと整列が崩れる）。 */
	.lp-meo-flow__list {
		gap: var(--space-5);
	}

	.lp-meo-flow__step-heading {
		font-size: var(--fs-lg);
	}

	/* SP では説明文のインデントを抑える */
	.lp-meo-flow__step-desc {
		margin-left: var(--space-4);
	}

	/* ─── lp-meo-faq ─── */
	.lp-meo-faq__q {
		padding: var(--space-4);
		gap: var(--space-3);
	}

	.lp-meo-faq__q-text {
		font-size: var(--fs-base);
		line-height: 1.5;
	}

	/* SP の FAQ answer：左インデントは Q ボタンと同じ（var(--space-4)=16px）にして本文幅を確保 */
	.lp-meo-faq__a {
		padding: 0 var(--space-4) var(--space-4) var(--space-4);
		line-height: 1.85;
	}

	/* ─── lp-meo-promise（ダーク） ─── */
	.lp-meo-promise__grid {
		gap: var(--space-4);
	}

	.lp-meo-promise__card {
		padding: var(--space-5);
		border-radius: var(--radius-lg);
	}

	.lp-meo-promise__card-title {
		font-size: var(--fs-lg);
	}

	/* ─── lp-meo-form ─── */
	.contact-form,
	.lp-meo-form,
	.wpcf7-form {
		padding: var(--space-5);
	}

	.contact-form__topic-option {
		padding: var(--space-3);
		min-height: 64px;
	}
}


/* ============================================================
 * prefers-reduced-motion 対応
 * ============================================================ */
@media (prefers-reduced-motion: reduce) {
	.lp-meo-hero__overline,
	.lp-meo-hero__title,
	.lp-meo-hero__lead,
	.lp-meo-hero__cta,
	.lp-meo-hero__notes,
	.lp-meo-hero__visual {
		animation: none !important;
		opacity: 1 !important;
		transform: none !important;
	}

	@media (min-width: 1024px) {
		.lp-meo-hero__visual {
			transform: translateY(-50%) !important;
		}
	}

	.lp-meo-strength:hover,
	.lp-meo-promise__card:hover,
	.lp-meo-faq__item,
	.lp-meo-sticky-cta__btn:hover {
		transform: none !important;
		transition: none !important;
	}

	.reveal {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
}


/* ============================================================
 * ============================================================
 *
 *  /lp/bizboot-meo/thanks/ 専用スタイル
 *
 *  LP2（MEO）フォーム送信完了後の遷移先（CV計測URL）。
 *  構成：
 *    Section 1 :  lp-meo-thanks-hero（h1: お問い合わせを承りました。）
 *    Section 2 :  lp-meo-thanks-next（3カード：MEO 始め方ガイド / LINE / MEO コラム）
 *    Section 3 :  lp-meo-thanks-info（連絡先：電話・営業時間・所在地）
 *    Section 4 :  lp-meo-thanks-back（戻り導線：LP2 / トップ）
 *
 *  方針：
 *    - LP1 と同じライト基盤トーンを継承
 *    - thanks ページは sticky CTA を持たない（送信後の再CTAは過剰）
 *    - ヒーローはチェックマーク中心の落ち着いたコンポジション＋マップピン要素
 *    - モバイルファースト
 *    - callout box 化禁止
 *    - prefers-reduced-motion で全アニメ停止
 *
 * ============================================================
 * ============================================================ */


/* ============================================================
 * Section 1 ─ lp-meo-thanks-hero
 * ============================================================ */
.lp-meo-thanks-hero {
	position: relative;
	min-height: 60vh;
	display: flex;
	align-items: center;
	padding-top: calc(64px + var(--space-7));
	padding-bottom: var(--space-8);
	overflow: hidden;
	isolation: isolate;
	background: var(--color-bg-primary);
}

@media (min-width: 1024px) {
	.lp-meo-thanks-hero {
		min-height: 70vh;
		padding-bottom: var(--space-9);
	}
}

@keyframes lp-meo-thanks-fade-in {
	from { opacity: 0; transform: translateY(12px); }
	to   { opacity: 1; transform: translateY(0); }
}

@keyframes lp-meo-thanks-visual-in {
	from { opacity: 0; transform: translateY(-50%) scale(0.94); }
	to   { opacity: 1; transform: translateY(-50%) scale(1); }
}

@keyframes lp-meo-thanks-visual-in-sp {
	from { opacity: 0; transform: scale(0.94); }
	to   { opacity: 1; transform: scale(1); }
}

@keyframes lp-meo-thanks-check-pop {
	0%   { transform: scale(0.6); opacity: 0; }
	60%  { transform: scale(1.08); opacity: 1; }
	100% { transform: scale(1); opacity: 1; }
}

@keyframes lp-meo-thanks-spark-pulse {
	0%, 100% { opacity: 1; transform: scale(1); }
	50%      { opacity: 0.55; transform: scale(1.15); }
}

@keyframes lp-meo-thanks-bubble-float {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-5px); }
}

@keyframes lp-meo-thanks-pin-bounce {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-4px); }
}

/* ─── 背景の極薄メガタイポ（ライト基盤での階調を維持） ─── */
.lp-meo-thanks-hero__bg-typo {
	position: absolute;
	inset: 0;
	z-index: 0;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	font-family: var(--font-sans-latin);
	font-size: clamp(5rem, 16vw, 16rem);
	font-weight: var(--fw-extrabold);
	color: var(--color-text-primary);
	opacity: 0.045;
	letter-spacing: var(--ls-tight);
	white-space: nowrap;
	user-select: none;
	overflow: hidden;
	pointer-events: none;
}

.lp-meo-thanks-hero__bg-typo span {
	display: block;
}

.lp-meo-thanks-hero__bg-typo span:first-child {
	transform: translateX(-8%);
}

.lp-meo-thanks-hero__bg-typo span:last-child {
	transform: translateX(8%);
	text-align: right;
}

/* ─── ヒーロー右側の装飾SVG（PC：絶対配置） ─── */
.lp-meo-thanks-hero__visual {
	position: absolute;
	top: 50%;
	right: max(var(--space-5), calc((100vw - var(--container-wide)) / 2 + var(--space-5)));
	transform: translateY(-50%);
	width: 38%;
	max-width: 480px;
	z-index: 0;
	pointer-events: none;
	overflow: visible;
	opacity: 0;
	animation: lp-meo-thanks-visual-in var(--duration-slowest) var(--ease-out-expo) 1.0s forwards;
}

.lp-meo-thanks-hero__visual svg {
	width: 100%;
	height: auto;
	display: block;
}

/* 装飾SVG内：チェックの登場アニメ・スパーク・吹き出し・マップピンの微アニメ */
@media (prefers-reduced-motion: no-preference) {
	.lp-meo-thanks-hero__visual-check {
		transform-origin: 240px 180px;
		animation: lp-meo-thanks-check-pop 0.8s var(--ease-out-expo) 1.4s backwards;
	}

	.lp-meo-thanks-hero__visual-spark1 {
		animation: lp-meo-thanks-spark-pulse 3.5s ease-in-out infinite;
		transform-origin: 110px 132px;
	}

	.lp-meo-thanks-hero__visual-spark2 {
		animation: lp-meo-thanks-spark-pulse 4s ease-in-out 0.5s infinite;
		transform-origin: 380px 104px;
	}

	.lp-meo-thanks-hero__visual-spark3 {
		animation: lp-meo-thanks-spark-pulse 4.5s ease-in-out 1s infinite;
		transform-origin: 400px 266px;
	}

	.lp-meo-thanks-hero__visual-bubble {
		animation: lp-meo-thanks-bubble-float 5s ease-in-out infinite;
		transform-origin: center;
	}

	/* マップピン（左下）：穏やかな上下浮遊。LP2 の文脈を継続 */
	.lp-meo-thanks-hero__visual-pin {
		animation: lp-meo-thanks-pin-bounce 4.2s ease-in-out 0.4s infinite;
		transform-origin: 90px 280px;
	}
}

/* SP・タブレット（〜1023px）：SVG はテキストの下にフルサイズで段組み配置 */
@media (max-width: 1023px) {
	.lp-meo-thanks-hero {
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		min-height: auto;
		padding-bottom: var(--space-7);
	}

	.lp-meo-thanks-hero__visual {
		position: static;
		top: auto;
		right: auto;
		transform: none;
		width: 100%;
		max-width: 360px;
		margin-inline: auto;
		margin-top: var(--space-6);
		padding-inline: var(--space-4);
		opacity: 0;
		animation-name: lp-meo-thanks-visual-in-sp;
		order: 2;
	}

	.lp-meo-thanks-hero__inner {
		order: 1;
	}
}

.lp-meo-thanks-hero__inner {
	position: relative;
	z-index: 1;
}

.lp-meo-thanks-hero__content {
	display: flex;
	flex-direction: column;
	gap: var(--space-5);
	width: 100%;
	max-width: 640px;
}

@media (min-width: 1024px) {
	.lp-meo-thanks-hero__content {
		max-width: 600px;
		margin-right: auto;
	}
}

.lp-meo-thanks-hero__overline {
	font-family: var(--font-sans-latin);
	font-size: var(--fs-xs);
	font-weight: var(--fw-semibold);
	letter-spacing: var(--ls-widest);
	text-transform: uppercase;
	color: var(--color-brand);
	margin: 0;
	opacity: 0;
	animation: lp-meo-thanks-fade-in var(--duration-slow) var(--ease-out-expo) 0.4s forwards;
}

.lp-meo-thanks-hero__title {
	font-size: var(--fs-display-md);
	line-height: 1.2;
	letter-spacing: var(--ls-tighter);
	color: var(--color-text-primary);
	font-weight: var(--fw-extrabold);
	font-feature-settings: "palt";
	margin-top: var(--space-3);
	text-wrap: balance;
	opacity: 0;
	animation: lp-meo-thanks-fade-in var(--duration-slow) var(--ease-out-expo) 0.6s forwards;
}

/* SP（〜767px）：h1 を 32〜44px に */
@media (max-width: 767px) {
	.lp-meo-thanks-hero__title {
		font-size: clamp(2rem, 8.5vw, 2.75rem);
		line-height: 1.25;
		letter-spacing: -0.02em;
	}
}

.lp-meo-thanks-hero__lead {
	font-size: var(--fs-lg);
	color: var(--color-text-secondary);
	line-height: var(--lh-loose);
	max-width: 60ch;
	text-wrap: pretty;
	opacity: 0;
	animation: lp-meo-thanks-fade-in var(--duration-slow) var(--ease-out-expo) 0.9s forwards;
}

.lp-meo-thanks-hero__lead strong {
	color: var(--color-text-primary);
	font-weight: var(--fw-semibold);
}


/* ============================================================
 * Section 3 ─ lp-meo-thanks-info（連絡先）
 * ============================================================ */
.lp-meo-thanks-info {
	position: relative;
	padding-block: var(--space-7);
	background: var(--color-bg-surface);
	overflow: hidden;
	isolation: isolate;
	border-top: 1px solid var(--color-border-subtle);
}

@media (min-width: 768px) {
	.lp-meo-thanks-info {
		padding-block: var(--space-9);
	}
}

@media (min-width: 1024px) {
	.lp-meo-thanks-info {
		padding-block: var(--space-10);
	}
}

.lp-meo-thanks-info__header {
	margin-bottom: var(--space-7);
	max-width: 720px;
	position: relative;
}

.lp-meo-thanks-info__title {
	font-size: var(--fs-display-md);
	font-weight: var(--fw-extrabold);
	color: var(--color-text-primary);
	letter-spacing: var(--ls-tighter);
	line-height: var(--lh-tight);
	margin: var(--space-4) 0 var(--space-4);
	font-feature-settings: "palt";
}

@media (max-width: 767px) {
	.lp-meo-thanks-info__title {
		font-size: clamp(1.75rem, 7vw, 2.25rem);
		line-height: 1.3;
	}
}

.lp-meo-thanks-info__tldr {
	font-size: var(--fs-lg);
	color: var(--color-text-secondary);
	line-height: var(--lh-loose);
	max-width: 60ch;
	text-wrap: pretty;
	margin: 0;
}

/* 連絡先カード */
.lp-meo-thanks-info__card {
	background: var(--color-bg-primary);
	border: 1px solid var(--color-border-subtle);
	border-radius: 16px;
	padding: var(--space-6) var(--space-5);
	font-style: normal;
	display: flex;
	flex-direction: column;
	gap: var(--space-5);
	align-items: flex-start;
}

@media (min-width: 768px) {
	.lp-meo-thanks-info__card {
		padding: var(--space-7);
		gap: var(--space-6);
	}
}

/* 受話器SVG ＋ 電話番号の横並びコンテナ */
.lp-meo-thanks-info__primary {
	display: flex;
	align-items: center;
	gap: var(--space-4);
	flex-wrap: wrap;
}

@media (max-width: 639px) {
	.lp-meo-thanks-info__primary {
		gap: var(--space-3);
	}
}

.lp-meo-thanks-info__icon {
	width: 56px;
	height: 56px;
	flex-shrink: 0;
}

@media (max-width: 639px) {
	.lp-meo-thanks-info__icon {
		width: 44px;
		height: 44px;
	}
}

.lp-meo-thanks-info__icon svg {
	width: 100%;
	height: 100%;
	display: block;
}

.lp-meo-thanks-info__number {
	font-family: var(--font-sans-latin);
	font-size: clamp(2rem, 7vw, 2.75rem);
	font-weight: var(--fw-extrabold);
	color: var(--color-brand);
	letter-spacing: var(--ls-tight);
	text-decoration: none;
	line-height: 1;
	transition: color var(--duration-fast) var(--ease-out-expo);
	min-height: 48px;
	display: inline-flex;
	align-items: center;
}

.lp-meo-thanks-info__number:hover {
	color: var(--color-brand-700);
}

.lp-meo-thanks-info__number:focus-visible {
	outline: 2px solid var(--color-brand);
	outline-offset: 4px;
	border-radius: 4px;
}

/* 連絡先リスト */
.lp-meo-thanks-info__list {
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--space-4);
	width: 100%;
	border-top: 1px solid var(--color-border-subtle);
	padding-top: var(--space-5);
}

.lp-meo-thanks-info__row {
	display: flex;
	flex-direction: column;
	gap: var(--space-1);
}

@media (min-width: 640px) {
	.lp-meo-thanks-info__row {
		flex-direction: row;
		gap: var(--space-4);
		align-items: flex-start;
	}
}

.lp-meo-thanks-info__row dt {
	font-size: var(--fs-xs);
	font-weight: var(--fw-bold);
	letter-spacing: var(--ls-wide);
	color: var(--color-brand);
	flex-shrink: 0;
	min-width: 80px;
	font-family: var(--font-sans-jp);
}

.lp-meo-thanks-info__row dd {
	margin: 0;
	font-size: var(--fs-sm);
	color: var(--color-text-primary);
	line-height: var(--lh-relaxed);
	text-wrap: pretty;
}

.lp-meo-thanks-info__row dd a {
	color: var(--color-brand);
	text-decoration: underline;
	text-underline-offset: 0.2em;
	text-decoration-thickness: 1px;
	transition: color var(--duration-fast) var(--ease-out-expo);
}

.lp-meo-thanks-info__row dd a:hover {
	color: var(--color-brand-700);
}


/* ============================================================
 * Section 4 ─ lp-meo-thanks-back（戻り導線：LP2 / トップ）
 * ============================================================ */
.lp-meo-thanks-back {
	position: relative;
	padding-block: var(--space-7);
	background: var(--color-bg-surface);
	border-top: 1px solid var(--color-border-subtle);
}

@media (min-width: 768px) {
	.lp-meo-thanks-back {
		padding-block: var(--space-8);
	}
}

.lp-meo-thanks-back__inner {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: stretch;
	gap: var(--space-3);
}

@media (min-width: 768px) {
	.lp-meo-thanks-back__inner {
		flex-direction: row;
		align-items: center;
		justify-content: center;
		gap: var(--space-4);
	}
}

/* SP では btn--lg をフル幅に（モバイル品質基準・タップ容易性） */
.lp-meo-thanks-back__btn {
	width: 100%;
	min-height: 56px;
	justify-content: center;
}

@media (min-width: 768px) {
	.lp-meo-thanks-back__btn {
		width: auto;
		min-width: 280px;
	}
}


/* ============================================================
 * thanks ページ専用：prefers-reduced-motion 対応
 * ============================================================ */
@media (prefers-reduced-motion: reduce) {
	.lp-meo-thanks-hero__overline,
	.lp-meo-thanks-hero__title,
	.lp-meo-thanks-hero__lead,
	.lp-meo-thanks-hero__visual,
	.lp-meo-thanks-hero__visual-check,
	.lp-meo-thanks-hero__visual-spark1,
	.lp-meo-thanks-hero__visual-spark2,
	.lp-meo-thanks-hero__visual-spark3,
	.lp-meo-thanks-hero__visual-bubble,
	.lp-meo-thanks-hero__visual-pin {
		animation: none !important;
		opacity: 1 !important;
		transform: none !important;
	}

	@media (min-width: 1024px) {
		.lp-meo-thanks-hero__visual {
			transform: translateY(-50%) !important;
		}
	}
}


/* LP Opening final override：旧ミニリスト指定より後で診断ボードを確定 */
.lp-hero-diagnostic {
	position: relative;
	display: grid;
	gap: var(--space-3);
	margin-top: var(--space-5);
	padding: clamp(var(--space-4), 3vw, var(--space-5));
	border: 1px solid var(--lp-opening-accent-border, var(--color-border-brand));
	border-radius: var(--radius-lg);
	background:
		linear-gradient(135deg, rgba(255, 255, 255, 0.74) 0%, rgba(255, 255, 255, 0.42) 58%, var(--lp-opening-accent-soft, rgba(6, 123, 123, 0.10)) 100%),
		var(--color-bg-base);
	box-shadow: 0 18px 46px rgba(26, 40, 38, 0.08);
	overflow: hidden;
}

.lp-hero-diagnostic > p {
	position: relative;
	z-index: 1;
	margin: 0;
	color: var(--lp-opening-accent, var(--color-brand));
}

.lp-hero-diagnostic ul {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}

.lp-hero-diagnostic li {
	position: static;
	display: flex;
	align-items: flex-start;
	gap: var(--space-2);
	padding-left: 0;
	font-size: var(--fs-sm);
	font-weight: var(--fw-semibold);
}

.lp-hero-diagnostic li::before {
	content: "";
	position: static;
	width: 8px;
	height: 8px;
	margin-top: 0.55em;
	border: 0;
	border-radius: 50%;
	background: var(--lp-opening-accent, var(--color-brand));
	transform: none;
	flex: 0 0 auto;
}

@media (min-width: 768px) {
	.lp-hero-diagnostic ul {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* ============================================================
 * LP refinement：Shift cards / Scope cards
 * 来店判断の変化を、箇条書きではなく地図上の候補カードのように見せる。
 * ============================================================ */
.lp-meo-shift__points {
	--lp-shift-accent: var(--color-accent);
	--lp-shift-accent-deep: var(--color-accent-700);
	--lp-shift-accent-soft: rgba(158, 103, 67, 0.11);
	gap: var(--space-3);
}

.lp-meo-shift__points li {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	grid-template-columns: clamp(56px, 7vw, 76px) minmax(0, 1fr);
	align-items: center;
	gap: var(--space-4);
	min-height: 132px;
	padding: clamp(var(--space-4), 2.6vw, var(--space-5));
	border: 1px solid rgba(158, 103, 67, 0.20);
	border-radius: var(--radius-xl);
	background:
		linear-gradient(135deg, rgba(255, 255, 255, 0.84), rgba(255, 255, 255, 0.52) 56%, var(--lp-shift-accent-soft)),
		var(--color-bg-base);
	box-shadow: 0 18px 42px rgba(26, 40, 38, 0.08);
}

.lp-meo-shift__points li:first-child {
	padding: clamp(var(--space-4), 2.6vw, var(--space-5));
	border-top: 1px solid rgba(158, 103, 67, 0.20);
}

.lp-meo-shift__points li::after {
	content: "";
	position: absolute;
	top: -42px;
	right: -30px;
	z-index: -1;
	width: 118px;
	aspect-ratio: 1;
	border: 1px solid rgba(158, 103, 67, 0.18);
	border-radius: 50%;
	background: radial-gradient(circle, rgba(158, 103, 67, 0.12), transparent 64%);
}

.lp-meo-shift__points-num {
	display: grid;
	align-self: center;
	place-items: center;
	width: clamp(52px, 6vw, 68px);
	aspect-ratio: 1;
	border: 1px solid rgba(158, 103, 67, 0.24);
	border-radius: 22px;
	background:
		linear-gradient(145deg, rgba(158, 103, 67, 0.18), rgba(201, 136, 95, 0.13)),
		rgba(255, 255, 255, 0.72);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.70);
	color: var(--lp-shift-accent-deep);
	font-size: clamp(1.35rem, 2vw, 1.8rem);
	letter-spacing: 0;
}

.lp-meo-shift__points-body {
	padding-top: 0.1em;
}

.lp-meo-shift__points-body strong {
	font-size: clamp(1.05rem, 1.3vw, 1.28rem);
	letter-spacing: 0;
}

.lp-meo-shift__points-body span {
	font-size: var(--fs-base);
	line-height: var(--lh-relaxed);
}

.lp-meo-service__scope {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	max-width: none;
	padding: clamp(var(--space-5), 4vw, var(--space-7));
	border: 1px solid rgba(158, 103, 67, 0.16);
	border-radius: var(--radius-2xl);
	background:
		linear-gradient(135deg, rgba(255, 255, 255, 0.82), rgba(255, 255, 255, 0.50) 56%, rgba(158, 103, 67, 0.08)),
		var(--color-bg-base);
	box-shadow: 0 22px 54px rgba(26, 40, 38, 0.09);
}

.lp-meo-service__scope--guardrails {
	margin-top: var(--space-8);
}

.lp-meo-service__scope::after {
	content: "";
	position: absolute;
	right: -70px;
	bottom: -86px;
	z-index: -1;
	width: 220px;
	aspect-ratio: 1;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(158, 103, 67, 0.12), transparent 64%);
}

.lp-meo-service__scope-title {
	display: inline-flex;
	align-items: center;
	gap: var(--space-2);
	padding: var(--space-2) var(--space-3);
	border: 1px solid rgba(158, 103, 67, 0.18);
	border-radius: var(--radius-full);
	background: rgba(158, 103, 67, 0.07);
	margin-bottom: var(--space-5);
	letter-spacing: var(--ls-wider);
}

.lp-meo-service__scope-list {
	counter-reset: scope-card;
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-3);
}

@media (min-width: 768px) {
	.lp-meo-service__scope-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.lp-meo-service__scope-list li {
	counter-increment: scope-card;
	position: relative;
	min-height: 164px;
	padding: var(--space-5);
	border: 1px solid rgba(26, 40, 38, 0.10);
	border-radius: var(--radius-xl);
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.76), rgba(255, 255, 255, 0.42)),
		rgba(255, 255, 255, 0.54);
	box-shadow: 0 14px 30px rgba(26, 40, 38, 0.07);
}

.lp-meo-service__scope-list li::before {
	content: counter(scope-card, decimal-leading-zero);
	position: static;
	display: inline-flex;
	width: fit-content;
	height: auto;
	border-radius: 0;
	background: transparent;
	color: var(--color-accent-700);
	font-family: var(--font-sans-latin);
	font-size: var(--fs-sm);
	font-weight: var(--fw-extrabold);
	letter-spacing: var(--ls-wider);
}

.lp-meo-service__scope-list li::after {
	content: "";
	position: absolute;
	top: var(--space-5);
	right: var(--space-5);
	width: 34px;
	height: 2px;
	border-radius: var(--radius-full);
	background: linear-gradient(90deg, var(--color-accent), var(--color-action));
}

.lp-meo-service__scope-list li strong {
	margin-top: var(--space-2);
	font-size: var(--fs-lg);
	line-height: var(--lh-snug);
	letter-spacing: 0;
}

.lp-meo-service__scope-list li span {
	font-size: var(--fs-base);
	line-height: var(--lh-relaxed);
}

/* 2026-05-31: SP表と提供範囲カード内の線装飾を整理 */
@media (max-width: 767px) {
	.lp-meo-vs__table-wrap {
		overflow: visible;
	}

	.lp-meo-vs__table tbody {
		display: grid;
		gap: var(--space-3);
	}

	.lp-meo-vs__table tbody tr {
		display: grid;
		gap: var(--space-3);
		padding: var(--space-4);
		border: 0;
		border-radius: var(--radius-md);
		background: linear-gradient(180deg, #fff, rgba(250, 249, 247, 0.82));
		box-shadow:
			inset 0 0 0 1px rgba(26, 40, 38, 0.08),
			0 10px 24px rgba(26, 40, 38, 0.07);
	}

	.lp-meo-vs__table tbody th[scope="row"] {
		padding: 0;
		border-bottom: 0;
		color: var(--color-text-primary);
		font-family: inherit;
		font-size: var(--fs-lg);
		font-weight: var(--fw-extrabold);
		letter-spacing: 0;
		line-height: var(--lh-snug);
		text-transform: none;
	}

	.lp-meo-vs__table tbody td {
		display: grid;
		grid-template-columns: minmax(4.5rem, auto) 1fr;
		gap: var(--space-3);
		align-items: start;
		padding: var(--space-3);
		border: 0;
		border-radius: var(--radius-sm);
		background: rgba(26, 40, 38, 0.035);
		color: var(--color-text-primary);
		line-height: var(--lh-relaxed);
	}

	.lp-meo-vs__table tbody td::before {
		justify-self: start;
		padding: 0.28rem 0.62rem;
		border-radius: var(--radius-full);
		background: rgba(26, 40, 38, 0.08);
		color: var(--color-text-secondary);
		font-family: inherit;
		font-size: var(--fs-xs);
		font-weight: var(--fw-bold);
		letter-spacing: 0;
		line-height: 1.3;
		text-align: left;
		text-transform: none;
	}

	.lp-meo-vs__table tbody td.lp-meo-vs__col-highlight {
		background: rgba(158, 103, 67, 0.10);
		color: var(--color-text-primary);
	}
}

@media (max-width: 420px) {
	.lp-meo-vs__table tbody td {
		grid-template-columns: 1fr;
		gap: var(--space-2);
	}
}

.lp-meo-service__scope-list li {
	min-height: auto;
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: var(--space-3);
	padding: var(--space-4);
}

.lp-meo-service__scope-list li::before {
	grid-row: 1 / span 2;
	display: inline-grid;
	place-items: center;
	width: 2.25rem;
	height: 2.25rem;
	border-radius: var(--radius-sm);
	background: rgba(158, 103, 67, 0.13);
	color: var(--color-accent-700);
	font-size: 0.78rem;
	line-height: 1;
}

.lp-meo-service__scope-list li::after {
	display: none;
}

.lp-meo-service__scope-list li strong {
	margin-top: 0;
}