/**
 * Page: 企業向けAIリテラシー研修「AI業務パスポート」（/ai-literacy-training/）
 *
 * 2026-06-01 新規。services.css / home-creative.css のトンマナを踏襲した自己完結CSS。
 *  - クールホワイト地・フラット罫線（box-shadow 不使用）・明朝見出し
 *  - editorial-index 採番（番号＋英ラベル＋/ 08）／section-movement 製図グリッド帯
 *  - 紙↔ダークの楽章：02 Program と 06 Subsidy をダーク反転（case-study 配色を再利用）
 *  - ティール #067B7B × コッパー #C9885F の2色アクセント
 *  - editorial-index / section-movement は共有CSSに無いため本ファイルで定義
 */

/* ════════════════════════════════════════════════════════════
 * 0. ページスコープでクールホワイト基盤を確定
 *    base.css の `main { --color-bg-primary:#FAF9F7 … }`（旧ウォーム）を、
 *    トップ（home-creative）と同じクール系トークンへローカル上書きする。
 *    .ailit-page（0,1,0）は main（0,0,1）より優先されるため確実に勝つ。
 *    ※ 全ページ一括の base.css 置換は「トップ確定後の継承」フェーズで行う。
 * ════════════════════════════════════════════════════════════ */
.ailit-page {
	--color-bg-primary:  #FAF9F7;  /* クールホワイト（紙地） */
	--color-bg-surface:  #FFFFFF;  /* 純白（カード面） */
	--color-bg-elevated: #EAF3F1;  /* 淡アクアグレー（強調面） */
	--color-bg-base:     #FFFFFF;  /* 浮かせる面・白ボタン用 */
}


/* ════════════════════════════════════════════════════════════
 * 0.5 フィルムグレイン（services.css と同一定義）
 *     このページは services.css を読まないため定義が欠落していた。
 *     質感（紙のざらつき）を他ページと揃える。
 * ════════════════════════════════════════════════════════════ */
.film-grain {
	position: fixed;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	opacity: 0.5;
	mix-blend-mode: multiply;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.32'/%3E%3C/svg%3E");
	background-size: 160px 160px;
}
@media (max-width: 767px) { .film-grain { opacity: 0.36; } }
@media (prefers-reduced-motion: reduce) { .film-grain { opacity: 0.30; } }


/* ════════════════════════════════════════════════════════════
 * 1. editorial-index（services.css と同一定義）
 * ════════════════════════════════════════════════════════════ */
.editorial-index {
	display: inline-flex;
	align-items: baseline;
	gap: var(--space-3);
	margin-bottom: var(--space-5);
	line-height: 1;
}
.editorial-index__num {
	font-family: var(--font-serif-jp);
	font-size: clamp(2.75rem, 7vw, 4.5rem);
	font-weight: var(--fw-semibold);
	color: var(--color-brand);
	letter-spacing: var(--ls-tighter);
	font-feature-settings: "tnum";
	line-height: 0.8;
}
.editorial-index__en {
	font-family: var(--font-mono);
	font-size: var(--fs-xs);
	font-weight: var(--fw-medium);
	letter-spacing: var(--ls-widest);
	text-transform: uppercase;
	color: var(--color-text-secondary);
	align-self: flex-end;
	padding-bottom: 0.4em;
}
.editorial-index__total {
	font-family: var(--font-mono);
	font-size: var(--fs-xs);
	letter-spacing: var(--ls-wide);
	color: var(--color-text-secondary);
	align-self: flex-end;
	padding-bottom: 0.4em;
}
.editorial-index--invert .editorial-index__num   { color: var(--color-brand-300); }
.editorial-index--invert .editorial-index__en    { color: var(--color-text-dark-secondary); }
.editorial-index--invert .editorial-index__total { color: var(--color-text-dark-secondary); }
.editorial-index--center {
	display: flex;
	justify-content: center;
	margin-inline: auto;
	margin-bottom: var(--space-5);
}
.editorial-index--center .editorial-index__en {
	padding-bottom: 0;
	letter-spacing: var(--ls-widest);
	color: var(--color-brand-300);
}
@media (max-width: 767px) {
	.editorial-index { gap: var(--space-3); margin-bottom: var(--space-4); }
	.editorial-index__num { font-size: clamp(2rem, 9vw, 2.5rem); }
}


/* ════════════════════════════════════════════════════════════
 * 2. section-movement：紙地セクション上端のブループリント帯（ダークには出さない）
 * ════════════════════════════════════════════════════════════ */
.section-movement { position: relative; }
.ailit-section.section-movement:not(.ailit-section--dark)::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: clamp(160px, 28vh, 320px);
	background-image:
		linear-gradient(rgba(6, 123, 123, 0.07) 1px, transparent 1px),
		linear-gradient(90deg, rgba(6, 123, 123, 0.07) 1px, transparent 1px);
	background-size: var(--space-7) var(--space-7);
	-webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,0.45), transparent);
	mask-image: linear-gradient(180deg, rgba(0,0,0,0.45), transparent);
	pointer-events: none;
	z-index: 0;
	opacity: 0.7;
}
.section-movement > .container { position: relative; z-index: 1; }


/* ════════════════════════════════════════════════════════════
 * 3. Hero（KV：判断基準ゲートの線画ダイアグラム）
 * ════════════════════════════════════════════════════════════ */
.ailit-hero {
	position: relative;
	min-height: auto;
	padding-top: var(--page-hero-top-offset);
	padding-bottom: var(--space-9);
	overflow: hidden;
	isolation: isolate;
	background: var(--color-bg-primary);
}
@media (min-width: 1024px) {
	.ailit-hero {
		min-height: 78vh;
		display: flex;
		align-items: center;
	}
}

.ailit-hero__visual {
	width: 100%;
	max-width: 600px;
	justify-self: end;
	z-index: 1;
	pointer-events: none;
	/* LPのONE WORK図と同じく、フレーム/グリッド箱を外して図そのものを浮かせる（でぐ指示・2026-06-03） */
	padding: 0;
	opacity: 0;
	animation: ailit-hero-visual-in var(--duration-slowest) var(--ease-out-expo) 0.6s forwards;
}
.ailit-hero__diagram { width: 100%; height: auto; display: block; }

@keyframes ailit-hero-visual-in {
	from { opacity: 0; transform: translateY(16px) scale(0.97); }
	to   { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes ailit-hero-visual-in-sp {
	from { opacity: 0; transform: scale(0.97); }
	to   { opacity: 0.96; transform: scale(1); }
}
.ailit-hero__links {
	stroke-dasharray: 260;
	stroke-dashoffset: 260;
	animation: ailit-hero-draw 1400ms var(--ease-out-expo) forwards;
}
.ailit-hero__links:nth-of-type(1) { animation-delay: 1.0s; }
@keyframes ailit-hero-draw { to { stroke-dashoffset: 0; } }

@media (max-width: 1023px) {
	.ailit-hero { padding-bottom: var(--space-7); }
	.ailit-hero__visual {
		max-width: 520px;
		justify-self: center;
		margin-top: var(--space-7);
		padding: var(--space-5);
		animation-name: ailit-hero-visual-in-sp;
	}
}

.ailit-hero__inner {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-8);
	align-items: center;
}
@media (min-width: 1024px) {
	.ailit-hero__inner {
		grid-template-columns: minmax(0, 0.95fr) minmax(360px, 0.8fr);
		min-height: calc(78vh - var(--page-hero-top-offset) - var(--space-9));
	}
}
.ailit-hero__content {
	display: flex; flex-direction: column; gap: var(--space-5);
	width: 100%; max-width: 640px;
}
@media (min-width: 1024px) { .ailit-hero__content { max-width: 600px; } }
@media (max-width: 1023px) { .ailit-hero__content { max-width: none; } }

.ailit-hero__overline {
	font-family: var(--font-mono);
	font-size: var(--fs-xs);
	font-weight: var(--fw-medium);
	letter-spacing: var(--ls-widest);
	text-transform: uppercase;
	color: var(--color-brand);
	margin: 0;
	opacity: 0;
	animation: ailit-hero-fade-in var(--duration-slow) var(--ease-out-expo) 0.2s forwards;
}
.ailit-hero__title {
	font-family: var(--font-serif-jp);
	font-size: var(--fs-display-md);
	line-height: 1.18;
	letter-spacing: var(--ls-tight);
	color: var(--color-text-primary);
	font-weight: var(--fw-semibold);
	font-feature-settings: "palt";
	margin: 0;
	opacity: 0;
	animation: ailit-hero-fade-in var(--duration-slow) var(--ease-out-expo) 0.5s forwards;
}
.ailit-hero__title-line { display: inline-block; }
@media (min-width: 768px) { .ailit-hero__title-line { white-space: nowrap; } }
@media (max-width: 767px) { .ailit-hero__title .br-pc { display: none; } }

.ailit-hero__lead {
	font-size: var(--fs-lg);
	color: var(--color-text-secondary);
	line-height: var(--lh-loose);
	max-width: 58ch;
	margin: 0;
	opacity: 0;
	animation: ailit-hero-fade-in var(--duration-slow) var(--ease-out-expo) 0.8s forwards;
}
.ailit-hero__lead strong { color: var(--color-text-primary); font-weight: var(--fw-bold); }
.ailit-hero__lead + .ailit-hero__lead { font-size: var(--fs-md); }

.ailit-hero__cta {
	display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-2);
	opacity: 0;
	animation: ailit-hero-fade-in var(--duration-slow) var(--ease-out-expo) 1.05s forwards;
}
@media (min-width: 640px) { .ailit-hero__cta { gap: var(--space-4); } }

.ailit-hero__sub-link {
	font-size: var(--fs-sm);
	color: var(--color-text-secondary);
	line-height: var(--lh-relaxed);
	margin: 0;
	opacity: 0;
	animation: ailit-hero-fade-in var(--duration-slow) var(--ease-out-expo) 1.25s forwards;
}
.ailit-hero__sub-link + .ailit-hero__sub-link { margin-top: var(--space-2); }
.ailit-hero__sub-link a { color: var(--color-brand); border-bottom: 1px solid var(--color-border-brand); }
.ailit-hero__sub-link a:hover { color: var(--color-brand-700); }

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


/* ════════════════════════════════════════════════════════════
 * 4. 共通：セクション余白・見出し
 * ════════════════════════════════════════════════════════════ */
.ailit-section {
	position: relative;
	padding-block: var(--space-9);
	overflow: hidden;
	isolation: isolate;
}
@media (min-width: 1024px) {
	.ailit-section { padding-block: var(--space-9); }
}
.ailit-section__inner { position: relative; }

.ailit-section__header {
	border-bottom: 1px solid var(--color-decor-hairline);
	padding-bottom: var(--space-5);
	margin-bottom: var(--space-7);
}
@media (min-width: 1024px) {
	.ailit-section--dark .ailit-section__header {
		margin-bottom: var(--space-8);
	}
}
.ailit-section__title {
	font-family: var(--font-serif-jp);
	font-size: clamp(1.875rem, 4.5vw, 3rem);
	font-weight: var(--fw-semibold);
	line-height: var(--lh-snug);
	letter-spacing: var(--ls-tight);
	color: var(--color-text-primary);
	font-feature-settings: "palt";
	margin: 0;
}
.ailit-section__title-line { display: inline-block; }
@media (min-width: 768px) { .ailit-section__title-line { white-space: nowrap; } }
@media (max-width: 767px) { .ailit-section__title .br-pc { display: none; } }

.ailit-section__lead {
	margin-top: var(--space-4);
	font-size: var(--fs-md);
	color: var(--color-text-secondary);
	line-height: var(--lh-loose);
	max-width: 68ch;
}
.ailit-section__lead strong { color: var(--color-text-primary); font-weight: var(--fw-bold); }
@media (min-width: 1024px) {
	.ailit-section--dark .ailit-section__lead {
		max-width: 78ch;
		font-size: var(--fs-lg);
	}
}

.ailit-section__sub-link {
	margin-top: var(--space-5);
	font-size: var(--fs-sm);
}
.ailit-section__sub-link a {
	display: inline-flex;
	align-items: center;
	gap: var(--space-2);
	font-family: var(--font-mono);
	font-weight: var(--fw-medium);
	letter-spacing: var(--ls-wide);
	color: var(--color-brand);
}
.ailit-section__sub-link a::after { content: "→"; transition: transform var(--duration-fast) var(--ease-spring); }
.ailit-section__sub-link a:hover { color: var(--color-brand-700); }
.ailit-section__sub-link a:hover::after { transform: translateX(4px); }


/* ════════════════════════════════════════════════════════════
 * 5. 本文プロセス（プルクオート的な大組み・ボックス化しない）
 * ════════════════════════════════════════════════════════════ */
.ailit-prose {
	/* 長文本文は読みやすさ優先で行長を制限（でぐ判断・2026-06-03 元に戻す）。
	   全幅だと1行が長すぎて読みにくいため reading width を維持。
	   split 内は .ailit-split__main の max-width:780px が優先。 */
	max-width: 70ch;
	display: flex;
	flex-direction: column;
	gap: var(--space-4);
}
.ailit-prose p {
	font-size: var(--fs-md);
	color: var(--color-text-secondary);
	line-height: var(--lh-loose);
	margin: 0;
}
.ailit-prose p strong { color: var(--color-text-primary); font-weight: var(--fw-bold); }
@media (min-width: 1024px) {
	.ailit-section--dark .ailit-prose {
		gap: var(--space-5);
		max-width: 76ch;
	}
	.ailit-section--dark .ailit-prose p {
		font-size: var(--fs-lg);
		line-height: 1.95;
	}
	.ailit-section--dark .ailit-prose__note {
		font-size: var(--fs-base) !important;
		line-height: var(--lh-loose);
	}
}
.ailit-prose__lead-out {
	margin-top: var(--space-2);
	padding-top: var(--space-4);
	border-top: 1px solid var(--color-decor-hairline);
}
.ailit-prose__lead-out strong {
	font-family: var(--font-serif-jp);
	font-size: var(--fs-lg);
	color: var(--color-text-primary);
}
.ailit-prose__note {
	font-size: var(--fs-sm) !important;
	color: var(--color-text-muted) !important;
}


/* ════════════════════════════════════════════════════════════
 * 6. 主に扱う内容（has-brackets パネル＋2カラムリスト）
 * ════════════════════════════════════════════════════════════ */
.ailit-scope {
	padding: var(--space-6) var(--space-5);
	background: var(--color-bg-surface);
	border: 1px solid var(--color-border-subtle);
}
.ailit-scope__title {
	font-family: var(--font-serif-jp);
	font-size: var(--fs-xl);
	font-weight: var(--fw-semibold);
	color: var(--color-text-primary);
	margin-bottom: var(--space-5);
}
.ailit-scope__list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0;
	border-top: 1px solid var(--color-decor-hairline);
}
@media (min-width: 768px) { .ailit-scope__list { grid-template-columns: repeat(2, 1fr); column-gap: var(--space-6); } }
.ailit-scope__list li {
	position: relative;
	padding: var(--space-4) 0 var(--space-4) var(--space-5);
	border-bottom: 1px solid var(--color-decor-hairline);
	font-size: var(--fs-md);
	color: var(--color-text-secondary);
	line-height: var(--lh-relaxed);
}
.ailit-scope__list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: calc(var(--space-4) + 0.7em);
	width: 8px;
	height: 8px;
	border: 1px solid var(--color-brand);
}


/* ════════════════════════════════════════════════════════════
 * 7. 受講後に残るもの（番号つき罫線リスト）
 * ════════════════════════════════════════════════════════════ */
.ailit-keeps {
	display: grid;
	grid-template-columns: 1fr;
	border-top: 1px solid var(--color-border-subtle);
	margin-bottom: var(--space-7);
}
@media (min-width: 768px) {
	.ailit-keeps { grid-template-columns: repeat(2, 1fr); column-gap: var(--space-8); }
}
.ailit-keeps__item {
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: baseline;
	gap: var(--space-4);
	padding: var(--space-4) 0;
	border-bottom: 1px solid var(--color-border-subtle);
	font-size: var(--fs-md);
	color: var(--color-text-primary);
	line-height: var(--lh-relaxed);
}
.ailit-keeps__num {
	font-family: var(--font-serif-jp);
	font-size: var(--fs-xl);
	font-weight: var(--fw-semibold);
	color: var(--color-brand);
	letter-spacing: var(--ls-tighter);
	font-feature-settings: "tnum";
}


/* ════════════════════════════════════════════════════════════
 * 8. こんな会社に向いています（チェック罫線リスト）
 * ════════════════════════════════════════════════════════════ */
.ailit-fit {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0;
	border-top: 1px solid var(--color-border-subtle);
	border-left: 1px solid var(--color-border-subtle);
}
@media (min-width: 768px)  { .ailit-fit { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .ailit-fit { grid-template-columns: repeat(3, 1fr); } }
.ailit-fit__item {
	position: relative;
	padding: var(--space-5) var(--space-5) var(--space-5) calc(var(--space-5) + var(--space-5));
	border-right: 1px solid var(--color-border-subtle);
	border-bottom: 1px solid var(--color-border-subtle);
	font-size: var(--fs-md);
	color: var(--color-text-secondary);
	line-height: var(--lh-loose);
	transition: background var(--duration-base) var(--ease-out-expo);
}
.ailit-fit__item:hover { background: var(--color-glass-brand); }
.ailit-fit__item::before {
	content: "✓";
	position: absolute;
	left: var(--space-5);
	top: var(--space-5);
	font-family: var(--font-mono);
	font-weight: var(--fw-bold);
	color: var(--color-brand);
}
@media (max-width: 767px) {
	.ailit-fit__item { padding-left: calc(var(--space-4) + var(--space-4)); }
	.ailit-fit__item::before { left: var(--space-4); }
}


/* ════════════════════════════════════════════════════════════
 * 9. プラン（3グループ・罫線カード・フラット／メイン1枚格上げ）
 * ════════════════════════════════════════════════════════════ */
.ailit-plans__group + .ailit-plans__group { margin-top: var(--space-8); }
.ailit-plans__group-title {
	display: flex;
	flex-direction: column;
	gap: var(--space-1);
	margin-bottom: var(--space-5);
	padding-left: var(--space-4);
	border-left: 3px solid var(--color-brand);
	font-family: var(--font-serif-jp);
	font-size: var(--fs-xl);
	font-weight: var(--fw-semibold);
	color: var(--color-text-primary);
	line-height: var(--lh-snug);
}
.ailit-plans__group-title span {
	font-family: var(--font-mono);
	font-size: var(--fs-xs);
	font-weight: var(--fw-medium);
	letter-spacing: var(--ls-wide);
	color: var(--color-text-secondary);
}
.ailit-plans__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0;
	border-top: 1px solid var(--color-border-subtle);
	border-left: 1px solid var(--color-border-subtle);
}
@media (min-width: 640px)  { .ailit-plans__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .ailit-plans__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1180px) { .ailit-plans__grid { grid-template-columns: repeat(4, 1fr); } }
.ailit-plans__grid--3 { }
@media (min-width: 1024px) { .ailit-plans__grid--3 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .ailit-plans__grid--2 { grid-template-columns: repeat(2, 1fr); } }

.ailit-plan {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	height: 100%;
	padding: var(--space-6) var(--space-5);
	border-right: 1px solid var(--color-border-subtle);
	border-bottom: 1px solid var(--color-border-subtle);
	transition: background var(--duration-base) var(--ease-out-expo);
}
.ailit-plan:hover { background: var(--color-glass-brand); }
.ailit-plan__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--space-3);
}
.ailit-plan__num {
	font-family: var(--font-serif-jp);
	font-size: clamp(1.5rem, 3vw, 2rem);
	font-weight: var(--fw-semibold);
	line-height: 0.9;
	color: var(--color-brand);
	letter-spacing: var(--ls-tighter);
	font-feature-settings: "tnum";
}
.ailit-plan__tag {
	align-self: flex-start;
	font-family: var(--font-mono);
	font-size: var(--fs-xs);
	letter-spacing: var(--ls-wide);
	color: var(--color-text-secondary);
	padding: var(--space-1) var(--space-3);
	border: 1px solid var(--color-border-default);
	white-space: nowrap;
}
.ailit-plan__tag--ax { color: var(--color-brand); border-color: var(--color-border-brand); }
.ailit-plan__tag--featured {
	color: var(--color-bg-surface);
	background: var(--color-brand);
	border-color: var(--color-brand);
}
.ailit-plan__title {
	font-family: var(--font-serif-jp);
	font-size: var(--fs-lg);
	font-weight: var(--fw-semibold);
	color: var(--color-text-primary);
	line-height: var(--lh-snug);
}
.ailit-plan__meta {
	margin: 0;
	font-family: var(--font-mono);
	font-size: var(--fs-xs);
	letter-spacing: var(--ls-wide);
	color: var(--color-text-secondary);
}
.ailit-plan__desc {
	font-size: var(--fs-sm);
	color: var(--color-text-secondary);
	line-height: var(--lh-relaxed);
	margin-bottom: auto;
}
.ailit-plan__link {
	margin-top: var(--space-3);
	display: inline-flex;
	align-items: center;
	gap: var(--space-2);
	font-family: var(--font-mono);
	font-size: var(--fs-sm);
	font-weight: var(--fw-medium);
	letter-spacing: var(--ls-wide);
	color: var(--color-brand);
}
.ailit-plan__link::after { content: "→"; transition: transform var(--duration-fast) var(--ease-spring); }
.ailit-plan__link:hover { color: var(--color-brand-700); }
.ailit-plan__link:hover::after { transform: translateX(4px); }
.ailit-plan--featured {
	border: 1px solid var(--color-border-brand);
	background: var(--color-glass-brand);
}
.ailit-plan--bridge { background: var(--color-glass-brand); }
@media (max-width: 767px) {
	.ailit-plan__num { font-size: clamp(1.375rem, 6vw, 1.625rem); }
}


/* ════════════════════════════════════════════════════════════
 * 10. ダーク反転（02 Program / 06 Subsidy）
 *     case-study / services-detail--dark の配色を再利用
 * ════════════════════════════════════════════════════════════ */
.ailit-section--dark {
	background: var(--color-bg-dark-primary);
	color: var(--color-text-dark-primary);
}
.ailit-section--dark .ailit-section__header { border-bottom-color: var(--color-border-dark-subtle); }
.ailit-section--dark .ailit-section__title {
	color: var(--color-text-dark-primary);
	mix-blend-mode: normal;
}
@media (min-width: 1024px) {
	.ailit-section--dark .ailit-section__title {
		font-size: clamp(3rem, 4.1vw, 4.25rem);
		line-height: 1.28;
	}
}
.ailit-section--dark .ailit-section__lead { color: var(--color-text-dark-secondary); }
.ailit-section--dark .ailit-section__lead strong { color: var(--color-text-dark-primary); }
.ailit-section--dark .ailit-prose p { color: var(--color-text-dark-secondary); }
.ailit-section--dark .ailit-prose p strong { color: var(--color-text-dark-primary); }
.ailit-section--dark .ailit-prose__note { color: var(--color-text-dark-secondary) !important; }
.ailit-section--dark .ailit-prose__lead-out { border-top-color: var(--color-border-dark-subtle); }

/* scope パネル（02 で使用） */
.ailit-section--dark .ailit-scope {
	background: var(--color-bg-dark-surface);
	border-color: var(--color-border-dark-default);
}
.ailit-section--dark .ailit-scope__title { color: var(--color-text-dark-primary); }
.ailit-section--dark .ailit-scope__list { border-top-color: var(--color-border-dark-subtle); }
.ailit-section--dark .ailit-scope__list li {
	color: var(--color-text-dark-secondary);
	border-bottom-color: var(--color-border-dark-subtle);
}
.ailit-section--dark .ailit-scope__list li::before { border-color: var(--color-brand-300); }
.ailit-section--dark .has-brackets::before,
.ailit-section--dark .has-brackets::after { border-color: var(--color-brand-300); }


/* ════════════════════════════════════════════════════════════
 * 11. FAQ（罫線リスト）
 * ════════════════════════════════════════════════════════════ */
.ailit-faq__list { border-top: 1px solid var(--color-border-subtle); }
.ailit-faq__item { padding: var(--space-6) 0; border-bottom: 1px solid var(--color-border-subtle); }
.ailit-faq__q {
	display: flex;
	gap: var(--space-3);
	font-family: var(--font-serif-jp);
	font-size: var(--fs-lg);
	font-weight: var(--fw-semibold);
	color: var(--color-text-primary);
	line-height: var(--lh-snug);
	margin-bottom: var(--space-3);
}
.ailit-faq__q::before {
	content: "Q";
	font-family: var(--font-serif-latin);
	font-size: var(--fs-xl);
	font-weight: var(--fw-semibold);
	color: var(--color-brand);
	line-height: 1;
	flex: none;
}
.ailit-faq__a {
	font-size: var(--fs-md);
	color: var(--color-text-secondary);
	line-height: var(--lh-loose);
	padding-left: calc(var(--fs-xl) + var(--space-3));
}


/* ════════════════════════════════════════════════════════════
 * 12. 注意事項（ファインプリント帯）
 * ════════════════════════════════════════════════════════════ */
.ailit-disclaimer {
	padding-block: var(--space-6);
	background: var(--color-bg-elevated);
	border-top: 1px solid var(--color-decor-hairline);
}
.ailit-disclaimer .container {
	max-width: 880px;
}
.ailit-disclaimer__title {
	font-family: var(--font-mono);
	font-size: var(--fs-xs);
	font-weight: var(--fw-medium);
	letter-spacing: var(--ls-widest);
	text-transform: uppercase;
	color: var(--color-text-secondary);
	margin-bottom: var(--space-3);
}
.ailit-disclaimer__list {
	display: grid;
	gap: var(--space-2);
	list-style: none;
	margin: 0;
	padding: var(--space-4) 0 0;
	border-top: 1px solid var(--color-border-subtle);
}
.ailit-disclaimer__list li {
	position: relative;
	padding-left: 1.25em;
	font-size: var(--fs-xs);
	line-height: var(--lh-relaxed);
	color: var(--color-text-secondary);
}
.ailit-disclaimer__list li::before {
	content: "";
	position: absolute;
	top: 0.8em;
	left: 0.15em;
	width: 4px;
	height: 4px;
	border-radius: 999px;
	background: rgba(6, 123, 123, 0.58);
}
@media (min-width: 1024px) {
	.ailit-disclaimer {
		padding-block: var(--space-6);
	}
	.ailit-disclaimer__list {
		gap: var(--space-2);
	}
	.ailit-disclaimer__list li {
		font-size: var(--fs-sm);
	}
}


/* ════════════════════════════════════════════════════════════
 * 13. 相談フォーム（Contact Form 7）
 * ════════════════════════════════════════════════════════════ */
.ailit-form-section {
	scroll-margin-top: 96px;
	padding-top: var(--space-8);
	border-top: 1px solid var(--color-border-subtle);
}
.ailit-form-section .container {
	max-width: 880px;
}
.ailit-form-section__header {
	text-align: center;
	margin-inline: auto;
}
.ailit-form-section__title {
	font-family: var(--font-serif-jp);
	/* PCで2行目が container--narrow を超えて中央寄せが破綻していたため上限を縮小
	   （でぐ指摘・2026-06-03）。2.4rem で 16文字行が器内に収まり両行が中央に揃う。 */
	font-size: clamp(1.9rem, 5vw, 2.4rem);
	font-weight: var(--fw-semibold);
	line-height: 1.32;
	letter-spacing: 0;
	white-space: normal;
}
.ailit-form-section__title-line {
	display: inline;
}
.ailit-form-section__lead {
	max-width: 42rem;
	font-size: var(--fs-sm);
	line-height: var(--lh-loose);
	text-align: left;
	margin-inline: auto;
}
.ailit-form-section__notes a {
	color: var(--color-brand);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}
@media (min-width: 1024px) {
	.ailit-form-section {
		padding-top: var(--space-9);
	}
	.ailit-form-section .contact-form-section__title {
		white-space: normal;
	}
	.ailit-form-section__title-line {
		display: inline-block;
		white-space: nowrap;
	}
}


/* ════════════════════════════════════════════════════════════
 * 14. scroll-driven（@supports 隔離）＋ reduced-motion 停止
 * ════════════════════════════════════════════════════════════ */
@supports (animation-timeline: view()) {
	@media (prefers-reduced-motion: no-preference) {
		.ailit-section.section-movement:not(.ailit-section--dark)::before {
			animation: ailit-blueprint-draw linear both;
			animation-timeline: view();
			animation-range: entry 0% entry 70%;
		}
		.ailit-section__header .editorial-index {
			animation: ailit-index-rise linear both;
			animation-timeline: view();
			animation-range: entry 5% cover 22%;
		}
	}
}
@keyframes ailit-blueprint-draw {
	from { clip-path: inset(0 0 100% 0); opacity: 0; }
	60%  { opacity: 0.7; }
	to   { clip-path: inset(0 0 0 0); opacity: 0.7; }
}
@keyframes ailit-index-rise {
	from { transform: translateY(24px); opacity: 0; }
	to   { transform: translateY(0); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
	.ailit-hero__visual,
	.ailit-hero__overline,
	.ailit-hero__title,
	.ailit-hero__lead,
	.ailit-hero__cta,
	.ailit-hero__sub-link {
		opacity: 1 !important;
		transform: none !important;
		animation: none !important;
	}
	.ailit-hero__links { stroke-dashoffset: 0 !important; animation: none !important; }
	.ailit-section.section-movement:not(.ailit-section--dark)::before {
		clip-path: none !important;
		opacity: 0.55 !important;
		animation: none !important;
	}
	.editorial-index { animation: none !important; transform: none !important; opacity: 1 !important; }
}


/* ════════════════════════════════════════════════════════════
 * 14.5 デザイン密度レイヤー（2026-06-01 リデザイン）
 *      右側の空白を「図・カリキュラム・カード」で埋め、services 水準の密度へ。
 * ════════════════════════════════════════════════════════════ */

/* パンくずをKV背景となじませる（白帯を出さない） */
body.page--ai-literacy .breadcrumb::before { background: transparent; }

/* 2カラム（本文＋図） */
.ailit-split {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-7);
	width: 100%;
}
@media (min-width: 1024px) {
	.ailit-split {
		grid-template-columns: minmax(0, 1.45fr) minmax(360px, 0.95fr);
		gap: clamp(var(--space-8), 6vw, var(--space-10));
		align-items: start;
	}
	.ailit-split--figure-left { grid-template-columns: minmax(360px, 0.95fr) minmax(0, 1.45fr); }
}
/* 左列の文章は読みやすい行長を保ち、図との距離は列gapで制御する。 */
.ailit-split__main { max-width: 780px; }
.ailit-scope--single .ailit-scope__list { grid-template-columns: 1fr; }

@media (min-width: 1024px) {
	.ailit-section--dark .ailit-split {
		grid-template-columns: minmax(0, 1.55fr) minmax(420px, 1fr);
		gap: clamp(var(--space-8), 6.5vw, var(--space-11));
	}
	.ailit-section--dark .ailit-split__main {
		max-width: none;
	}
	.ailit-section--dark .ailit-scope {
		padding: 0;
		background: transparent;
		border: 0;
	}
	.ailit-section--dark .ailit-scope::before,
	.ailit-section--dark .ailit-scope::after {
		content: none;
	}
	.ailit-section--dark .ailit-scope__title {
		margin-bottom: var(--space-5);
		font-size: var(--fs-xl);
		color: var(--color-text-dark-primary);
	}
	.ailit-section--dark .ailit-scope__list {
		max-width: 760px;
		border-top-color: var(--color-border-dark-subtle);
	}
	.ailit-section--dark .ailit-scope__list li {
		font-size: var(--fs-lg);
		line-height: 1.75;
	}
}

/* 図パネル（製図トーン・コーナーブラケット枠） */
.ailit-figure {
	padding: var(--space-6) var(--space-5);
	border: 1px solid var(--color-border-subtle);
	background: var(--color-bg-surface);
}
@media (min-width: 1024px) {
	.ailit-section--dark .ailit-figure {
		padding: var(--space-7) var(--space-6);
		min-height: 100%;
	}
	.ailit-section--dark .ailit-figure__title {
		margin-bottom: var(--space-7);
	}
}
.ailit-figure__title {
	font-family: var(--font-mono);
	font-size: var(--fs-xs);
	font-weight: var(--fw-medium);
	letter-spacing: var(--ls-widest);
	text-transform: uppercase;
	color: var(--color-text-secondary);
	margin-bottom: var(--space-5);
}

/* プロセス／カリキュラム（縦・連結線つき） */
.ailit-steps { display: flex; flex-direction: column; }
.ailit-steps__item {
	position: relative;
	display: grid;
	grid-template-columns: 20px 1fr;
	column-gap: var(--space-4);
	padding-bottom: var(--space-5);
}
@media (min-width: 1024px) {
	.ailit-section--dark .ailit-steps__item {
		grid-template-columns: 24px 1fr;
		column-gap: var(--space-5);
		padding-bottom: var(--space-7);
	}
}
.ailit-steps__item:last-child { padding-bottom: 0; }
.ailit-steps__item:not(:last-child)::before {
	content: "";
	position: absolute;
	left: 9px;
	top: 20px;
	bottom: -2px;
	width: 1px;
	background: var(--color-border-brand);
}
@media (min-width: 1024px) {
	.ailit-section--dark .ailit-steps__item:not(:last-child)::before {
		left: 11px;
		top: 24px;
		bottom: -4px;
	}
}
.ailit-steps__dot {
	width: 20px;
	height: 20px;
	border: 1.5px solid var(--color-brand);
	border-radius: 50%;
	background: var(--color-bg-surface);
}
@media (min-width: 1024px) {
	.ailit-section--dark .ailit-steps__dot {
		width: 24px;
		height: 24px;
	}
}
.ailit-steps__key {
	display: block;
	font-family: var(--font-mono);
	font-size: var(--fs-xs);
	letter-spacing: var(--ls-wide);
	color: var(--color-brand);
	margin-bottom: 2px;
}
.ailit-steps__body strong {
	display: block;
	font-family: var(--font-serif-jp);
	font-size: var(--fs-md);
	color: var(--color-text-primary);
	line-height: var(--lh-snug);
}
@media (min-width: 1024px) {
	.ailit-section--dark .ailit-steps__key {
		margin-bottom: var(--space-2);
	}
	.ailit-section--dark .ailit-steps__body strong {
		font-size: var(--fs-xl);
	}
}
.ailit-steps__body p {
	margin: var(--space-1) 0 0;
	font-size: var(--fs-sm);
	color: var(--color-text-secondary);
	line-height: var(--lh-relaxed);
}

/* 問題の対比図（01：よくある対応と結果） */
.ailit-states { display: flex; flex-direction: column; }
.ailit-states__row {
	padding: var(--space-4) 0;
	border-bottom: 1px solid var(--color-border-subtle);
}
.ailit-states__row:last-child { border-bottom: 0; }
.ailit-states__cond {
	font-family: var(--font-serif-jp);
	font-size: var(--fs-md);
	color: var(--color-text-primary);
}
.ailit-states__res {
	display: block;
	margin-top: var(--space-1);
	font-size: var(--fs-sm);
	color: var(--color-text-secondary);
	line-height: var(--lh-relaxed);
}
.ailit-states__res::before { content: "→ "; color: var(--color-accent-700); font-weight: var(--fw-bold); }
.ailit-states__row--good .ailit-states__cond { color: var(--color-brand); }
.ailit-states__row--good .ailit-states__res::before { color: var(--color-brand); }

/* 選ばれる理由（07：番号カード3枚） */
.ailit-why-grid {
	display: grid;
	grid-template-columns: 1fr;
	border-top: 1px solid var(--color-border-subtle);
	border-left: 1px solid var(--color-border-subtle);
}
@media (min-width: 768px) { .ailit-why-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 768px) and (max-width: 1023px) { .ailit-why-grid { grid-template-columns: 1fr; } }
.ailit-why-card {
	padding: var(--space-6) var(--space-5);
	border-right: 1px solid var(--color-border-subtle);
	border-bottom: 1px solid var(--color-border-subtle);
	transition: background var(--duration-base) var(--ease-out-expo);
}
.ailit-why-card:hover { background: var(--color-glass-brand); }
.ailit-why-card__num {
	display: block;
	font-family: var(--font-serif-jp);
	font-size: clamp(2rem, 3vw, 2.5rem);
	font-weight: var(--fw-semibold);
	line-height: 0.9;
	color: var(--color-brand);
	letter-spacing: var(--ls-tighter);
	font-feature-settings: "tnum";
	margin-bottom: var(--space-4);
}
.ailit-why-card__title {
	font-family: var(--font-serif-jp);
	font-size: var(--fs-lg);
	font-weight: var(--fw-semibold);
	color: var(--color-text-primary);
	line-height: var(--lh-snug);
	margin-bottom: var(--space-3);
}
.ailit-why-card p {
	font-size: var(--fs-sm);
	color: var(--color-text-secondary);
	line-height: var(--lh-relaxed);
}

/* ── ダーク反転（02 / 06）でも図・プロセスを成立させる ── */
.ailit-section--dark .ailit-figure {
	background: var(--color-bg-dark-surface);
	border-color: var(--color-border-dark-default);
}
.ailit-section--dark .ailit-figure__title { color: var(--color-text-dark-secondary); }
.ailit-section--dark .ailit-steps__item:not(:last-child)::before { background: var(--color-border-dark-default); }
.ailit-section--dark .ailit-steps__dot { border-color: var(--color-brand-300); background: var(--color-bg-dark-surface); }
.ailit-section--dark .ailit-steps__key { color: var(--color-brand-300); }
.ailit-section--dark .ailit-steps__body strong { color: var(--color-text-dark-primary); }
.ailit-section--dark .ailit-steps__body p { color: var(--color-text-dark-secondary); }
@media (hover: none) { .ailit-why-card:hover { background: transparent; } }


/* ════════════════════════════════════════════════════════════
 * 15. レビュー反映（2026-06-01）：余白の緩急・タッチ対応・アンカー
 * ════════════════════════════════════════════════════════════ */
/* ダーク反転セクションは下端の間延びを避け、紙セクションより1段締める（PC） */
@media (min-width: 1024px) {
	.ailit-section--dark { padding-block: var(--space-9); }
}
/* アンカー（#ailit-curriculum「カリキュラムを見る」）の固定ヘッダー被り回避 */
.ailit-page .anchor-sentinel { scroll-margin-top: calc(var(--header-height, 64px) + var(--space-4)); }
/* タッチ端末では hover の面変化を無効化（CLAUDE.md タッチ対応ルール） */
@media (hover: none) {
	.ailit-fit__item:hover,
	.ailit-plan:hover { background: transparent; }
}

@media (max-width: 767px) {
	.ailit-hero__content { gap: var(--space-4); }
	.ailit-hero__lead {
		font-size: var(--fs-base);
		line-height: var(--lh-loose);
	}
	.ailit-hero__cta {
		flex-direction: column;
		align-items: stretch;
	}
	.ailit-hero__cta .btn { width: 100%; }
	.ailit-hero__visual {
		margin-top: var(--space-5);
		padding: var(--space-4);
	}
	.ailit-section__header {
		padding-bottom: var(--space-4);
		margin-bottom: var(--space-5);
	}
	.ailit-scope,
	.ailit-figure,
	.ailit-plan,
	.ailit-why-card {
		padding: var(--space-5) var(--space-4);
	}
	.ailit-plans__group + .ailit-plans__group { margin-top: var(--space-7); }
	.ailit-faq__item { padding: var(--space-5) 0; }
	.ailit-faq__a { padding-left: 0; }
}


/* ════════════════════════════════════════════════════════════
 * 16. LP寄せ（2026-06-03 でぐ指示）：図・パネルを LP の lp-conversion-stage 調へ
 *    austere なコーナーブラケット枠＋無地面 → 製図グリッド背景＋ティール/コッパー
 *    のアクセント。情報構造は維持し、見た目の言語だけ LP に寄せる。
 *    末尾に置き、既存の .ailit-figure / .ailit-scope 背景を source-order で上書き。
 * ════════════════════════════════════════════════════════════ */

/* 図・パネル（明）：製図グリッド＋コーナーへ向かう淡いティールグラデ */
.ailit-figure,
.ailit-scope {
	background:
		linear-gradient(rgba(6, 123, 123, 0.05) 1px, transparent 1px),
		linear-gradient(90deg, rgba(6, 123, 123, 0.05) 1px, transparent 1px),
		linear-gradient(135deg, #FFFFFF 0%, var(--color-bg-surface) 52%, var(--color-glass-brand) 100%),
		var(--color-bg-surface);
	background-size:
		var(--space-6) var(--space-6),
		var(--space-6) var(--space-6),
		100% 100%,
		100% 100%;
}

/* 図・パネル（ダーク反転 02/06）：明色ティールの製図グリッド */
.ailit-section--dark .ailit-figure,
.ailit-section--dark .ailit-scope {
	background:
		linear-gradient(rgba(91, 174, 174, 0.09) 1px, transparent 1px),
		linear-gradient(90deg, rgba(91, 174, 174, 0.09) 1px, transparent 1px),
		var(--color-bg-dark-surface);
	background-size:
		var(--space-6) var(--space-6),
		var(--space-6) var(--space-6),
		100% 100%;
}

/* パネル見出し（mono eyebrow）に LP の eyebrow と同じ短いティール罫アクセント */
.ailit-figure__title {
	position: relative;
	padding-left: 18px;
}
.ailit-figure__title::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.5em;
	width: 10px;
	height: 2px;
	background: var(--color-brand);
}
.ailit-section--dark .ailit-figure__title::before { background: var(--color-brand-300); }

/* 問題の対比図（01）：到達点の行を淡いティール面で強調（LP の good 強調調） */
.ailit-states__row--good {
	margin-inline: calc(var(--space-4) * -1);
	padding-inline: var(--space-4);
	background: var(--color-glass-brand);
	border-radius: var(--radius-sm);
	border-bottom: 0;
}

/* プロセス（02/06）の STEP ドット：交互にティール／コッパーで色のリズムを付ける */
.ailit-steps__item:nth-child(even) .ailit-steps__dot { border-color: var(--color-accent); }
.ailit-steps__item:nth-child(even) .ailit-steps__key { color: var(--color-accent-700); }
.ailit-section--dark .ailit-steps__item:nth-child(even) .ailit-steps__dot { border-color: var(--color-empathy-300); }
.ailit-section--dark .ailit-steps__item:nth-child(even) .ailit-steps__key { color: var(--color-empathy-300); }

/* プラン：おすすめカードに上辺ティールアクセント、AX連携ブリッジはコッパー寄りで差別化（LPのカード調） */
.ailit-plan--featured { border-top: 2px solid var(--color-brand); }
.ailit-plan--bridge {
	border-top: 2px solid var(--color-accent);
	background:
		linear-gradient(135deg, transparent 0%, transparent 60%, rgba(201, 136, 95, 0.08) 100%),
		var(--color-glass-brand);
}
.ailit-plan--bridge .ailit-plan__num { color: var(--color-accent-700); }


/* ════════════════════════════════════════════════════════════
 * 17. 内容刷新（2026-06-03）：標準研修「AI業務パスポート」用の新コンポーネント
 *     spec（概要）／stages（利用段階・判定）／checklist／curriculum（全6回）／
 *     rubric（確認観点）／fit--issue（問題状態）。明・暗両対応・SPで縦積み。
 * ════════════════════════════════════════════════════════════ */

/* Hero：補助リード（2段目） */
.ailit-hero__audience {
	font-size: var(--fs-md);
	color: var(--color-text-secondary);
	line-height: var(--lh-loose);
	margin: 0;
	opacity: 0;
	animation: ailit-hero-fade-in var(--duration-slow) var(--ease-out-expo) 0.95s forwards;
}

/* spec：ラベル/値の定義リスト（Hero facts ＋ Standard 概要） */
.ailit-spec { display: grid; gap: 0; border-top: 1px solid var(--color-border-subtle); }
.ailit-spec__row {
	display: grid;
	grid-template-columns: minmax(80px, 0.3fr) 1fr;
	gap: var(--space-3);
	padding: var(--space-3) 0;
	border-bottom: 1px solid var(--color-decor-hairline);
}
.ailit-spec__row dt {
	font-family: var(--font-mono);
	font-size: var(--fs-xs);
	letter-spacing: var(--ls-wide);
	color: var(--color-brand-700);
	line-height: 1.7;
}
.ailit-spec__row dd {
	margin: 0;
	font-size: var(--fs-sm);
	color: var(--color-text-secondary);
	line-height: var(--lh-relaxed);
}
.ailit-hero__facts {
	margin-top: var(--space-2);
	opacity: 0;
	animation: ailit-hero-fade-in var(--duration-slow) var(--ease-out-expo) 1.1s forwards;
}
.ailit-section--dark .ailit-spec { border-top-color: var(--color-border-dark-default); }
.ailit-section--dark .ailit-spec__row { border-bottom-color: var(--color-border-dark-subtle); }
.ailit-section--dark .ailit-spec__row dt { color: var(--color-brand-300); }
.ailit-section--dark .ailit-spec__row dd { color: var(--color-text-dark-secondary); }

/* fit--issue：「あるある状態」のマーカーをコッパーの注意点に（✓ではなく該当チェック） */
.ailit-fit--issue .ailit-fit__item::before {
	content: "!";
	color: var(--color-accent-700);
}

/* stages：利用段階・判定表現の定義リスト */
.ailit-stages { display: grid; gap: 0; }
.ailit-stages__row {
	padding: var(--space-4) 0;
	border-bottom: 1px solid var(--color-decor-hairline);
}
.ailit-stages__row:last-child { border-bottom: 0; }
.ailit-stages__row dt {
	font-family: var(--font-serif-jp);
	font-size: var(--fs-md);
	font-weight: var(--fw-semibold);
	color: var(--color-text-primary);
	margin-bottom: var(--space-1);
}
.ailit-stages__row dt::before {
	content: "";
	display: inline-block;
	width: 8px;
	height: 8px;
	margin-right: var(--space-2);
	background: var(--color-brand);
	vertical-align: middle;
}
.ailit-stages__row dd {
	margin: 0;
	font-size: var(--fs-sm);
	color: var(--color-text-secondary);
	line-height: var(--lh-relaxed);
}
.ailit-stages--verdict {
	margin-top: var(--space-6);
	border-top: 1px solid var(--color-border-subtle);
}
.ailit-stages--verdict .ailit-stages__row:first-child { padding-top: var(--space-4); }
.ailit-section--dark .ailit-stages__row { border-bottom-color: var(--color-border-dark-subtle); }
.ailit-section--dark .ailit-stages__row dt { color: var(--color-text-dark-primary); }
.ailit-section--dark .ailit-stages__row dt::before { background: var(--color-brand-300); }
.ailit-section--dark .ailit-stages__row dd { color: var(--color-text-dark-secondary); }

/* checklist：簡易チェックリスト（Subsidy 前提・ダーク面） */
.ailit-checklist { display: grid; gap: var(--space-3); }
.ailit-checklist li {
	position: relative;
	padding-left: calc(var(--space-4) + var(--space-2));
	font-size: var(--fs-sm);
	color: var(--color-text-secondary);
	line-height: var(--lh-relaxed);
}
.ailit-checklist li::before {
	content: "—";
	position: absolute;
	left: 0;
	top: 0;
	color: var(--color-brand);
	font-weight: var(--fw-bold);
}
.ailit-section--dark .ailit-checklist li { color: var(--color-text-dark-secondary); }
.ailit-section--dark .ailit-checklist li::before { color: var(--color-brand-300); }

/* curriculum：全6回カード（上辺ティールアクセント＋製図グリッド＋作るものチップ） */
.ailit-curriculum {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-4);
	margin-top: var(--space-6);
}
@media (min-width: 768px) {
	.ailit-curriculum { grid-template-columns: repeat(2, 1fr); gap: var(--space-5); }
}
.ailit-curriculum__item {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	padding: var(--space-5);
	border: 1px solid var(--color-border-subtle);
	border-top: 2px solid var(--color-brand);
	background:
		linear-gradient(rgba(6, 123, 123, 0.045) 1px, transparent 1px),
		linear-gradient(90deg, rgba(6, 123, 123, 0.045) 1px, transparent 1px),
		var(--color-bg-surface);
	background-size: var(--space-6) var(--space-6), var(--space-6) var(--space-6), 100% 100%;
}
.ailit-curriculum__head { display: flex; align-items: baseline; gap: var(--space-3); }
.ailit-curriculum__round {
	flex-shrink: 0;
	font-family: var(--font-mono);
	font-size: var(--fs-xs);
	letter-spacing: var(--ls-wide);
	font-weight: var(--fw-bold);
	color: var(--color-bg-surface);
	background: var(--color-brand);
	padding: var(--space-1) var(--space-2);
}
.ailit-curriculum__theme {
	margin: 0;
	font-family: var(--font-serif-jp);
	font-size: var(--fs-lg);
	font-weight: var(--fw-semibold);
	color: var(--color-text-primary);
	line-height: var(--lh-snug);
}
.ailit-curriculum__desc {
	margin: 0;
	flex-grow: 1;
	font-size: var(--fs-sm);
	color: var(--color-text-secondary);
	line-height: var(--lh-relaxed);
}
.ailit-curriculum__make {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--space-2);
	padding-top: var(--space-3);
	border-top: 1px solid var(--color-decor-hairline);
}
.ailit-curriculum__make-label {
	font-family: var(--font-mono);
	font-size: 0.7rem;
	letter-spacing: var(--ls-wide);
	color: var(--color-text-muted);
	margin-right: var(--space-1);
}
.ailit-curriculum__chip {
	font-size: var(--fs-xs);
	color: var(--color-accent-700);
	background: rgba(201, 136, 95, 0.10);
	border: 1px solid var(--color-empathy-300);
	border-radius: var(--radius-full);
	padding: 2px var(--space-3);
	line-height: 1.6;
}

/* rubric：確認テストの観点カード（4領域・border-leftは使わず上方ティール罫＋製図グリッド） */
.ailit-rubric {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-4);
	margin-top: var(--space-6);
}
@media (min-width: 768px) {
	.ailit-rubric { grid-template-columns: repeat(2, 1fr); }
}
.ailit-rubric__item {
	padding: var(--space-5);
	border: 1px solid var(--color-border-subtle);
	background:
		linear-gradient(rgba(6, 123, 123, 0.045) 1px, transparent 1px),
		linear-gradient(90deg, rgba(6, 123, 123, 0.045) 1px, transparent 1px),
		var(--color-bg-surface);
	background-size: var(--space-6) var(--space-6), var(--space-6) var(--space-6), 100% 100%;
}
.ailit-rubric__area {
	display: flex;
	align-items: center;
	gap: var(--space-2);
	margin-bottom: var(--space-2);
	font-family: var(--font-serif-jp);
	font-size: var(--fs-md);
	font-weight: var(--fw-semibold);
	color: var(--color-text-primary);
}
.ailit-rubric__area::before {
	content: "";
	flex-shrink: 0;
	width: 10px;
	height: 2px;
	background: var(--color-brand);
}
.ailit-rubric__desc {
	margin: 0;
	font-size: var(--fs-sm);
	color: var(--color-text-secondary);
	line-height: var(--lh-relaxed);
}

/* sub-link（ダーク反転セクション）：ティールが沈むため brand-300 へ */
.ailit-section--dark .ailit-section__sub-link a,
.ailit-section__sub-link--invert a {
	color: var(--color-brand-300);
	border-bottom-color: rgba(91, 174, 174, 0.5);
}
.ailit-section--dark .ailit-section__sub-link a:hover,
.ailit-section__sub-link--invert a:hover { color: var(--color-text-dark-primary); }

/* deliverables（Outcome）：成果物カードのトップ余白 */
.ailit-deliverables { margin-top: var(--space-6); }


/* ════════════════════════════════════════════════════════════
 * 18. 余白・仕上げ（2026-06-03 critique-reviewer 反映）
 *     主訴「padding が無い箇所が多い／カードが安っぽい」への対応。
 *     ・セクション内ブロック間の縦リズムを保証（header→先頭は header の
 *       margin-bottom が担当するため、ブロック→ブロックのみ付与）
 *     ・パネル内側 padding 拡張／header 下余白拡張
 *     ・カードの製図グリッドを外して無地化（グリッドの乗りすぎ＝安っぽさ解消）
 *     ・チップを「塗り＋枠＋ピル」から塗り＋角2pxへ簡素化
 * ════════════════════════════════════════════════════════════ */

/* 18-1. セクション内ブロック間の縦リズム（ベタ付き解消） */
.ailit-prose + .ailit-fit,
.ailit-prose + .ailit-curriculum,
.ailit-prose + .ailit-rubric,
.ailit-prose + .ailit-why-grid,
.ailit-prose + .ailit-split,
.ailit-rubric + .ailit-stages,
.ailit-stages--verdict + .ailit-prose__note,
.ailit-prose__note + .ailit-section__sub-link,
.ailit-fit + .ailit-section__sub-link,
.ailit-curriculum + .ailit-section__sub-link,
.ailit-why-grid + .ailit-section__sub-link,
.ailit-rubric + .ailit-section__sub-link,
.ailit-split + .ailit-section__sub-link {
	margin-top: var(--space-7);
}
@media (min-width: 1024px) {
	.ailit-prose + .ailit-fit,
	.ailit-prose + .ailit-curriculum,
	.ailit-prose + .ailit-rubric,
	.ailit-prose + .ailit-why-grid,
	.ailit-prose + .ailit-split {
		margin-top: var(--space-8);
	}
}

/* 18-2. header 下余白を広げ、罫線に文章が迫らないように */
.ailit-section__header { padding-bottom: var(--space-6); }

/* 18-3. パネル内側 padding 拡張（明面のみ。ダーク面は専用ルールが優先で不変） */
.ailit-figure,
.ailit-scope {
	padding: var(--space-6);
}
@media (min-width: 1024px) {
	.ailit-figure,
	.ailit-scope { padding: var(--space-7) var(--space-6); }
}

/* 18-4. Hero facts とCTAの間に余白 */
.ailit-hero__facts + .ailit-hero__cta { margin-top: var(--space-3); }

/* 18-5. カードの製図グリッドを外し無地に（グリッドは figure/scope と section 上端のみに限定） */
.ailit-curriculum__item {
	padding: var(--space-6);
	background: var(--color-bg-surface);
}
.ailit-curriculum__make { margin-top: auto; padding-top: var(--space-4); }
.ailit-rubric__item {
	background: var(--color-bg-surface);
}

/* 18-6. チップを塗り＋角2pxに簡素化（ピル＋枠＋塗りの3点セットを解消） */
.ailit-curriculum__chip {
	border: 0;
	border-radius: var(--radius-sm);
	padding: 3px var(--space-3);
}

/* 18-7. 注意事項帯の上下 padding を前セクションと釣り合う量に */
.ailit-disclaimer { padding-block: var(--space-8); }

/* 18-8. sub-link 直前の余白を少し増やして締める */
.ailit-section__sub-link { margin-top: var(--space-6); }

/* 18-9. ダーク反転面の .ailit-scope（02「共通カリキュラムで扱う内容」等）に
   padding と枠を戻す。LP寄せで製図グリッド背景を付与したのに PC で padding:0 の
   ままで文字がグリッド背景に密着していたため（でぐ指摘・2026-06-03）。
   ダーク figure パネルと同じ懐の深さに揃える。 */
.ailit-section--dark .ailit-scope {
	padding: var(--space-6);
	border: 1px solid var(--color-border-dark-subtle);
}
@media (min-width: 1024px) {
	.ailit-section--dark .ailit-scope {
		padding: var(--space-7) var(--space-6);
		border: 1px solid var(--color-border-dark-subtle);
	}
}

/* 18-10. 要所のセクション末CTA（ボタン）。テキストリンクCTAは撤去し、
   Curriculum後・Why後 の2箇所だけボタン化（でぐ指示・2026-06-03）。 */
.ailit-section__cta {
	margin-top: var(--space-8);
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--space-4);
}
@media (max-width: 640px) {
	.ailit-section__cta .btn { width: 100%; }
}
