/* ============================================================
   時効援用専門メディア スタイル v1.2
   デザイン出典：Claude Design「時効の援用ガイド」broadsheet DS
   （jikou-enyou/article.dc.html / _ds/broadsheet-.../styles.css）

   - トークン（配色・余白・影）はデザインシステムの値をそのまま採用
   - 記事ページは 1100px / 本文 + 300px サイドバー の2カラム
   - 本文は 16px / 行間 1.95、見出しは左罫（accent-700）
   ============================================================ */

:root {
	/* --- 配色：DSのトーナルランプ --- */
	--je-accent-100: #e9f8ff;
	--je-accent-200: #cbeeff;
	--je-accent-300: #99e0ff;
	--je-accent-400: #62c5ee;
	--je-accent-500: #38a6cf;
	--je-accent-600: #1186ac;
	--je-accent-700: #006786;
	--je-accent-800: #004961;
	--je-accent-900: #0a303e;

	--je-pink-100: #fff1f4;
	--je-pink-200: #ffdee6;
	--je-pink-400: #ff90b1;
	--je-pink-600: #d82071;
	--je-pink-700: #aa0b56;
	--je-pink-800: #790e3d;

	--je-n-100: #f8f4f4;
	--je-n-200: #eae7e7;
	--je-n-300: #d7d3d3;
	--je-n-400: #bab6b6;
	--je-n-700: #605d5d;
	--je-n-800: #444141;
	--je-n-900: #2d2b2b;

	--je-yellow: #edbb00;
	--je-line-green: #06c755;

	/* --- 意味づけ済みエイリアス（既存クラスが参照） --- */
	--je-ink: #201e1d;
	--je-ink-soft: var(--je-n-800);
	--je-ink-muted: var(--je-n-700);
	--je-line: var(--je-n-200);
	--je-bg: #ffffff;
	--je-bg-soft: var(--je-n-100);
	--je-bg-cream: var(--je-accent-100);
	--je-brand: var(--je-accent-700);
	--je-brand-deep: var(--je-accent-900);
	--je-brand-mid: var(--je-accent-800);
	--je-brand-soft: var(--je-accent-100);
	--je-brand-tint: var(--je-accent-100);
	--je-brand-line: var(--je-accent-200);
	--je-accent: var(--je-accent-600);
	--je-accent-soft: var(--je-accent-100);
	--je-warn: var(--je-pink-700);
	--je-warn-soft: var(--je-pink-100);

	/* --- 余白・角丸・影 --- */
	--je-s1: 5px;
	--je-s2: 10px;
	--je-s3: 15px;
	--je-s4: 20px;
	--je-s6: 30px;
	--je-s8: 40px;
	--je-radius-lg: 20px;
	--je-radius: 16px;
	--je-radius-sm: 12px;
	--je-radius-xs: 8px;
	--je-shadow-sm: 0 1px 2px rgba(45, 43, 43, .14);
	--je-shadow: 0 3px 10px rgba(45, 43, 43, .16);
	--je-shadow-lg: 0 12px 32px rgba(45, 43, 43, .22);

	--je-maxw: 700px;
	--je-maxw-wide: 1100px;
	--je-side: 300px;
	--je-sticky-top: 24px;
	--je-font: "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic Medium", YuGothic, Meiryo, system-ui, -apple-system, sans-serif;
}

.je-wrap {
	color: var(--je-ink);
	font-family: var(--je-font);
	font-size: 16px;
	line-height: 1.95;
	background: #fff;
	word-break: normal;
	overflow-wrap: anywhere;
	-webkit-font-smoothing: antialiased;
}
.je-wrap, .je-wrap * { box-sizing: border-box; }
.je-wrap h1, .je-wrap h2, .je-wrap h3, .je-wrap h4 {
	font-family: var(--je-font);
	font-weight: 700; letter-spacing: .02em; line-height: 1.45; margin: 0;
	text-wrap: pretty;
}
.je-wrap p { margin: 0 0 1.2em; text-wrap: pretty; }
.je-wrap p:empty { display: none; }
.je-wrap a { color: var(--je-accent-700); text-underline-offset: .18em; }
.je-wrap a:hover { color: var(--je-accent-600); }
.je-wrap img { max-width: 100%; height: auto; }
.je-wrap ul, .je-wrap ol { margin: var(--je-s3) 0 0; padding-left: 1.4em; }
.je-wrap li { margin-bottom: .35em; }

.je-single, .je-situation { max-width: var(--je-maxw); margin: 0 auto; padding: var(--je-s3) var(--je-s4) 80px; }
.je-top, .je-archive { max-width: var(--je-maxw-wide); margin: 0 auto; padding: var(--je-s3) var(--je-s4) 80px; }

/* 記事ページ：CTAバンドを全幅で出すため、内側コンテナで幅を取る */
.je-article-page { padding: 0; }
.je-container { max-width: var(--je-maxw-wide); margin: 0 auto; padding: 0 var(--je-s4); }
.je-two-col { display: grid; gap: var(--je-s6); grid-template-columns: minmax(0, 1fr); padding-top: var(--je-s6); padding-bottom: var(--je-s8); }

/* ---- パンくず ---- */
.je-breadcrumb { font-size: 12px; color: var(--je-n-700); padding-top: var(--je-s3); }
.je-breadcrumb ol { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; }
.je-breadcrumb li { display: flex; align-items: center; margin: 0; }
.je-breadcrumb li + li::before { content: "›"; margin-right: 6px; color: var(--je-n-400); }
.je-breadcrumb a { color: inherit; text-decoration: none; }
.je-breadcrumb a:hover { text-decoration: underline; }
.je-breadcrumb [aria-current="page"] { color: var(--je-ink); }

/* ---- 共通セクション見出し（バー付き） ---- */
.je-section-title {
	font-size: 18px; font-weight: 700; line-height: 1.45;
	margin: var(--je-s6) 0 var(--je-s3); display: flex; align-items: center; gap: 8px;
}
.je-section-title::before {
	content: ""; flex: none; width: 6px; height: 22px;
	background: var(--je-accent-700); border-radius: 3px;
}

/* ============================================================
   記事ヘッダー
   ============================================================ */
.je-article__header { display: grid; gap: var(--je-s3); }
.je-article__flags { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.je-article__cat {
	display: inline-block; background: var(--je-accent-700); color: #fff;
	font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 999px; text-decoration: none;
}
.je-article__cat:hover { background: var(--je-accent-800); color: #fff; }
.je-article__draft {
	background: var(--je-pink-100); color: var(--je-pink-800); font-size: 11px; font-weight: 700;
	padding: 3px 10px; border-radius: 999px; border: 1px dashed var(--je-pink-400);
}
.je-article__title {
	font-size: clamp(24px, 4.4vw, 34px); font-weight: 900; color: var(--je-accent-900); line-height: 1.45;
}
.je-article__sub { display: inline-block; font-size: .9rem; color: var(--je-n-700); margin-left: 8px; font-weight: 700; }

.je-article-meta { display: flex; flex-wrap: wrap; gap: var(--je-s2) var(--je-s4); font-size: 12px; color: var(--je-n-700); }
.je-article-meta a { color: inherit; }
.je-article-meta__item--time { color: var(--je-accent-800); font-weight: 700; }

/* 執筆・監修者カード */
.je-byline {
	display: flex; align-items: center; gap: var(--je-s2);
	background: var(--je-accent-100); border-radius: var(--je-radius-sm); padding: var(--je-s2) var(--je-s3);
}
.je-byline__photo { width: 40px; height: 40px; border-radius: 50%; overflow: hidden; flex: none; background: var(--je-accent-200); }
.je-byline__photo img { width: 40px; height: 40px; object-fit: cover; }
.je-byline__text { font-size: 13px; line-height: 1.5; }
.je-byline__text strong { font-weight: 700; }
.je-byline__link { font-size: 12px; }

.je-article__hero { aspect-ratio: 16 / 8; border-radius: var(--je-radius); overflow: hidden; background: var(--je-accent-100); }
.je-article__hero img { width: 100%; height: 100%; object-fit: cover; }

.je-friendly-note {
	font-size: 13px; color: var(--je-n-800); background: var(--je-n-100);
	border-radius: var(--je-radius-sm); padding: var(--je-s2) var(--je-s3); margin: 0;
}
.je-note-inline { font-size: 14px; color: var(--je-n-800); background: var(--je-n-100); padding: var(--je-s3) var(--je-s4); border-radius: var(--je-radius-sm); }

/* ============================================================
   記事本文
   ============================================================ */
.je-article__body { margin-top: var(--je-s6); }
.je-article__body > p { margin: var(--je-s3) 0 0; }
.je-article__body h2 {
	font-size: clamp(20px, 3.6vw, 26px); color: var(--je-accent-900);
	padding: var(--je-s2) 0 var(--je-s2) var(--je-s3);
	border-left: 6px solid var(--je-accent-700);
	margin-top: var(--je-s6);
}
.je-article__body h3 { font-size: 18px; margin-top: var(--je-s4); }
.je-article__body h4 { font-size: 16px; margin-top: var(--je-s4); }
.je-article__body ul, .je-article__body ol { margin: var(--je-s3) 0 0; padding-left: 1.4em; }
.je-article__body strong { font-weight: 700; }
.je-article__body blockquote {
	margin: var(--je-s4) 0 0; padding: var(--je-s3) var(--je-s4);
	background: var(--je-n-100); border-radius: var(--je-radius-sm); color: var(--je-n-800);
}

/* ---- 表 ---- */
.je-table-wrap { overflow-x: auto; margin: var(--je-s4) 0 0; }
.je-table-wrap table, .je-article__body table {
	width: 100%; border-collapse: collapse; font-size: 14px; margin: var(--je-s4) 0 0;
}
.je-table-wrap table { margin: 0; }
.je-table-wrap th, .je-article__body th {
	text-align: left; font-size: 12px; letter-spacing: .04em; font-weight: 700;
	color: var(--je-n-700); padding: var(--je-s2); border-bottom: 1px solid var(--je-n-300);
	vertical-align: top;
}
.je-table-wrap td, .je-article__body td {
	padding: var(--je-s2); border-bottom: 1px solid var(--je-n-200); vertical-align: top;
}
.je-table-wrap tbody tr:hover, .je-article__body tbody tr:hover { background: var(--je-n-100); }

/* ============================================================
   本文コンポーネント（ショートコード）
   ============================================================ */
/* 結論：塗り（accent-100） */
.je-box { margin: var(--je-s4) 0 0; border-radius: var(--je-radius); padding: var(--je-s4); }
.je-box__title { font-size: 12px; letter-spacing: .15em; font-weight: 700; margin: 0 0 var(--je-s2); }
.je-box__body > p:first-child { margin-top: 0; }
.je-box__body > p:last-child { margin-bottom: 0; }
.je-box__body > p { margin: var(--je-s2) 0 0; }
.je-box__body ul, .je-box__body ol { margin: var(--je-s2) 0 0; }

.je-box--conclusion { background: var(--je-accent-100); }
.je-box--conclusion .je-box__title { color: var(--je-accent-700); }
.je-box--conclusion .je-box__body { font-size: 16px; }

/* この記事でわかること／ポイント：線（accent-200 2px） */
.je-box--learn, .je-box--point { background: #fff; border: 2px solid var(--je-accent-200); }
.je-box--learn .je-box__title, .je-box--point .je-box__title {
	font-size: 15px; letter-spacing: normal; color: var(--je-ink);
}
.je-box--learn .je-box__body, .je-box--point .je-box__body { font-size: 15px; }
.je-box--learn .je-box__body ul, .je-box--point .je-box__body ul {
	margin: 0; padding-left: 1.3em; display: grid; gap: 4px;
}
.je-box--learn .je-box__body li, .je-box--point .je-box__body li { margin: 0; }

/* 注意：accent-2（マゼンタ）系 */
.je-box--note { background: var(--je-pink-100); }
.je-box--note .je-box__title { color: var(--je-pink-700); }
.je-box--note .je-box__body { font-size: 15px; }
.je-box--note .je-box__body ul { margin: 0; padding-left: 1.3em; display: grid; gap: 4px; }
.je-box--note .je-box__body li { margin: 0; }

/* 法的根拠：ニュートラル */
.je-box--basis { background: var(--je-n-100); }
.je-box--basis .je-box__title { color: var(--je-n-800); }
.je-box--basis .je-box__body { font-size: 14px; }

/* ことばの説明（1行インライン） */
.je-term {
	margin: var(--je-s4) 0 0; background: var(--je-n-100); border-radius: var(--je-radius-sm);
	padding: var(--je-s3) var(--je-s4); font-size: 14px;
}
.je-term__label { font-weight: 700; color: var(--je-accent-700); }
.je-term__word { font-weight: 700; }
.je-term p { display: inline; margin: 0; }

/* 用語解説（複数） */
.je-glossary { margin: var(--je-s4) 0 0; background: var(--je-n-100); border-radius: var(--je-radius); padding: var(--je-s4); }
.je-glossary__title { font-size: 12px; letter-spacing: .15em; font-weight: 700; color: var(--je-n-800); margin: 0 0 var(--je-s2); }
.je-glossary__list { margin: 0; }
.je-glossary__item { display: grid; grid-template-columns: 1fr; gap: 2px var(--je-s3); padding: var(--je-s2) 0; border-top: 1px solid var(--je-n-200); }
.je-glossary__item:first-child { border-top: 0; padding-top: 0; }
.je-glossary__item dt { font-weight: 700; color: var(--je-accent-700); margin: 0; font-size: 14px; }
.je-glossary__item dd { margin: 0; font-size: 14px; }
.je-glossary__item dd p { margin: 0; }

/* 弁護士の実務ポイント */
.je-lawyer-comment {
	margin: var(--je-s6) 0 0; background: #fff; border: 2px solid var(--je-accent-200);
	border-radius: var(--je-radius); padding: var(--je-s4);
	display: grid; grid-template-columns: 56px 1fr; gap: var(--je-s3); align-items: start;
}
.je-lawyer-comment--nophoto { grid-template-columns: 1fr; }
.je-lawyer-comment__inner { min-width: 0; }
.je-lawyer-comment__photo { width: 56px; height: 56px; border-radius: 50%; overflow: hidden; background: var(--je-accent-100); }
.je-lawyer-comment__photo img { width: 56px; height: 56px; object-fit: cover; }
.je-lawyer-comment__head { font-size: 12px; font-weight: 700; color: var(--je-accent-700); margin: 0; }
.je-lawyer-comment__body { font-size: 15px; }
.je-lawyer-comment__body p { margin: var(--je-s1) 0 0; }
.je-lawyer-comment__body p:last-child { margin-bottom: 0; }
.je-lawyer-comment__name { display: block; font-size: 12px; color: var(--je-n-700); margin-top: var(--je-s2); }

/* 手順 */
.je-steps { list-style: none; padding: 0; margin: var(--je-s4) 0 0; display: grid; gap: var(--je-s2); }
.je-steps__item { display: flex; gap: var(--je-s3); align-items: flex-start; margin: 0; counter-increment: je-step; }
.je-steps { counter-reset: je-step; }
.je-steps__item::before {
	content: counter(je-step); flex: none; width: 36px; height: 36px; border-radius: 50%;
	background: var(--je-accent-700); color: #fff; display: grid; place-items: center; font-weight: 900;
}
.je-steps__body { min-width: 0; }
.je-steps__title { display: block; font-weight: 700; }
.je-steps__body p { margin: 0; font-size: 14px; color: var(--je-n-800); }

/* FAQ（アコーディオン） */
.je-faq { display: grid; gap: var(--je-s2); margin: var(--je-s4) 0 0; }
.je-faq__item { background: var(--je-accent-100); border-radius: 14px; }
.je-faq__item > summary { list-style: none; }
.je-faq__item > summary::-webkit-details-marker { display: none; }
.je-faq__q {
	display: flex; align-items: center; gap: var(--je-s3);
	padding: var(--je-s3) var(--je-s4); cursor: pointer; font-weight: 700; font-size: 15px; line-height: 1.6;
}
.je-faq__qmark {
	flex: none; width: 30px; height: 30px; border-radius: 50%;
	background: var(--je-accent-700); color: #fff; display: grid; place-items: center; font-size: 14px;
}
.je-faq__qtext { flex: 1; }
.je-faq__toggle { flex: none; color: var(--je-accent-700); font-weight: 700; transition: transform .15s; }
.je-faq__item[open] .je-faq__toggle { transform: rotate(180deg); }
.je-faq__a { padding: 0 var(--je-s4) var(--je-s4); font-size: 15px; }
.je-faq__a p { margin: 0 0 var(--je-s2); }
.je-faq__a p:last-child { margin-bottom: 0; }

/* ============================================================
   記事内CTA（費用 + 電話 + LINE）
   ============================================================ */
.je-acta {
	margin: var(--je-s6) 0 0; border-radius: var(--je-radius-lg); overflow: hidden;
	box-shadow: var(--je-shadow);
	background: linear-gradient(160deg, var(--je-accent-700), var(--je-accent-900));
}
.je-acta__head { padding: var(--je-s6) var(--je-s4) var(--je-s4); text-align: center; color: #fff; }
.je-acta__label { margin: 0; font-size: 14px; font-weight: 700; opacity: .9; }
.je-acta__fee {
	margin: 4px 0 0; font-size: clamp(18px, 3.4vw, 24px); font-weight: 700; line-height: 1.3;
	display: flex; justify-content: center; align-items: baseline; gap: 6px; flex-wrap: wrap;
}
.je-acta__amount {
	font-size: clamp(40px, 8vw, 64px); font-weight: 900; color: var(--je-yellow);
	line-height: 1; letter-spacing: -.02em;
}
.je-acta__tax { font-size: .7em; font-weight: 400; opacity: .9; }
.je-acta__note { margin: var(--je-s2) 0 0; font-size: 14px; opacity: .9; }
.je-acta__free { color: var(--je-yellow); font-weight: 700; }
.je-acta__body {
	margin: 0 var(--je-s3) var(--je-s3); background: #fff; border-radius: var(--je-radius);
	padding: var(--je-s4); display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--je-s4);
}
.je-acta__col { display: grid; gap: 8px; text-align: center; align-content: start; }
.je-acta__coltitle { margin: 0; font-size: 13px; font-weight: 700; color: var(--je-n-800); }
.je-acta__coltitle em { font-style: normal; color: var(--je-accent-700); }
.je-acta__tel {
	display: grid; grid-template-columns: 64px 1fr; gap: var(--je-s3); align-items: center;
	text-decoration: none; color: var(--je-ink); background: #fff;
	border: 2px solid var(--je-accent-200); border-radius: var(--je-radius-sm); padding: 10px 14px;
	transition: transform .15s, box-shadow .15s;
}
.je-acta__tel--nophoto { grid-template-columns: 1fr; }
.je-acta__telphoto { width: 64px; height: 64px; border-radius: 10px; overflow: hidden; background: var(--je-accent-100); }
.je-acta__telphoto img { width: 64px; height: 64px; object-fit: cover; }
.je-acta__telbody { display: grid; text-align: left; line-height: 1.2; }
.je-acta__telnum { font-size: clamp(24px, 4vw, 32px); font-weight: 900; letter-spacing: .02em; color: var(--je-accent-900); }
.je-acta__telhours { font-size: 12px; color: var(--je-n-700); margin-top: 4px; }
.je-acta__line {
	display: flex; align-items: center; justify-content: center; gap: 10px;
	text-decoration: none; color: #fff; background: var(--je-line-green); border-radius: var(--je-radius-sm);
	padding: 16px 20px; font-weight: 700; font-size: 16px; line-height: 1.4; min-height: 88px;
	transition: transform .15s, box-shadow .15s;
}
.je-acta__line:hover, .je-acta__form:hover { color: #fff; }
.je-acta__form {
	display: flex; align-items: center; justify-content: center; gap: 10px;
	text-decoration: none; color: #fff; background: var(--je-accent-700); border-radius: var(--je-radius-sm);
	padding: 16px 20px; font-weight: 700; font-size: 16px; line-height: 1.4; min-height: 88px;
	transition: transform .15s, box-shadow .15s;
}
.je-acta__icon { flex: none; }
.je-acta__chev { flex: none; width: 24px; height: 24px; border-radius: 50%; border: 2px solid currentColor; display: grid; place-items: center; font-size: 14px; }
.je-acta__tel:hover, .je-acta__line:hover, .je-acta__form:hover { transform: translateY(-2px); box-shadow: var(--je-shadow-lg); }
@media (min-width: 620px) {
	.je-acta__col + .je-acta__col { border-left: 1px solid var(--je-n-200); padding-left: var(--je-s4); }
}

/* ============================================================
   記事下ブロック
   ============================================================ */
/* 解決事例カード */
.je-relblock { margin: var(--je-s6) 0 0; }
.je-relblock__hint { font-size: 13px; color: var(--je-n-700); margin: 4px 0 0; }
.je-casegrid { list-style: none; padding: 0; margin: var(--je-s3) 0 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--je-s3); }
.je-casegrid li { margin: 0; }
.je-casecard {
	background: var(--je-accent-100); border-radius: 14px; padding: var(--je-s3) var(--je-s4);
	text-decoration: none; color: inherit; display: grid; gap: 4px; height: 100%;
	transition: transform .15s;
}
.je-casecard:hover { transform: translateY(-2px); color: inherit; }
.je-casecard__title { font-size: 15px; font-weight: 700; line-height: 1.6; }
.je-casecard__note { font-size: 12px; color: var(--je-n-700); }

/* 会社・法令などのピル */
.je-pills { list-style: none; display: flex; flex-wrap: wrap; gap: var(--je-s2); padding: 0; margin: var(--je-s3) 0 0; }
.je-pills li { margin: 0; }
.je-pill {
	display: inline-block; padding: 8px 16px; border-radius: 999px; border: 2px solid var(--je-accent-200);
	text-decoration: none; color: var(--je-accent-900); font-weight: 700; font-size: 14px; line-height: 1.5;
}
.je-pill:hover { border-color: var(--je-accent-700); background: var(--je-accent-100); color: var(--je-accent-900); }

/* 次に読む記事 */
.je-next { margin: var(--je-s6) 0 0; }
.je-next__label { font-size: 13px; color: var(--je-n-700); margin: 4px 0 0; }
.je-next__list { list-style: none; padding: 0; margin: var(--je-s3) 0 0; display: grid; gap: var(--je-s2); }
.je-next__list li { margin: 0; }
.je-next__card {
	display: flex; gap: var(--je-s3); align-items: center; background: #fff; border-radius: 14px;
	box-shadow: var(--je-shadow-sm); padding: var(--je-s3) var(--je-s4);
	text-decoration: none; color: inherit; transition: transform .15s, box-shadow .15s;
}
.je-next__card:hover { transform: translateY(-2px); box-shadow: var(--je-shadow); color: inherit; }
.je-next__num { font-weight: 900; color: var(--je-accent-700); font-size: 18px; flex: none; }
.je-next__title { flex: 1; font-weight: 700; font-size: 15px; line-height: 1.6; }
.je-next__chev { color: var(--je-accent-700); flex: none; }

/* 参考資料 */
.je-sources { margin: var(--je-s6) 0 0; background: var(--je-n-100); border-radius: var(--je-radius); padding: var(--je-s4); }
.je-sources__title { font-size: 12px; letter-spacing: .15em; font-weight: 700; color: var(--je-n-800); margin: 0; }
.je-sources__list { margin: var(--je-s2) 0 0; padding-left: 1.3em; font-size: 14px; display: grid; gap: 4px; }
.je-sources__list li { margin: 0; }

/* 執筆・確認した弁護士 */
.je-lawyer-card {
	margin: var(--je-s6) 0 0; background: #fff; border-radius: var(--je-radius-lg);
	box-shadow: var(--je-shadow-sm); padding: var(--je-s4); display: grid; gap: var(--je-s3);
}
.je-lawyer-card__label { font-size: 12px; letter-spacing: .15em; font-weight: 700; color: var(--je-accent-500); margin: 0; }
.je-lawyer-card__inner { display: grid; grid-template-columns: 96px 1fr; gap: var(--je-s4); align-items: start; }
.je-lawyer-card__photo { aspect-ratio: 1; border-radius: 50%; overflow: hidden; background: var(--je-accent-100); }
.je-lawyer-card__photo img { width: 100%; height: 100%; object-fit: cover; }
.je-lawyer-card__photo--placeholder { display: grid; place-items: center; color: var(--je-accent-500); font-size: 12px; }
.je-lawyer-card__body { display: grid; gap: 6px; }
.je-lawyer-card__role { margin: 0; font-size: 12px; font-weight: 700; color: var(--je-accent-700); }
.je-lawyer-card__name { margin: 0; font-size: 22px; font-weight: 700; line-height: 1.4; }
.je-lawyer-card__firm { margin: 0; font-size: 12px; color: var(--je-n-700); }
.je-lawyer-card__desc { margin: 0; font-size: 14px; line-height: 1.8; color: var(--je-n-800); }
.je-lawyer-card__tags { display: flex; flex-wrap: wrap; gap: 6px; }
.je-lawyer-card__link { margin: 0; font-size: 14px; font-weight: 700; }

.je-tag { display: inline-flex; align-items: center; font-size: 11px; letter-spacing: .02em; padding: 3px 10px; border-radius: 3px; }
.je-tag--accent { background: var(--je-accent-100); color: var(--je-accent-800); }
.je-tag--neutral { background: var(--je-n-100); color: var(--je-n-800); }

/* ============================================================
   サイドバー（sticky 目次 + 相談ボタン）
   ============================================================ */
.je-article__side { display: grid; gap: var(--je-s4); align-content: start; }
.je-toc--side { display: none; }
.je-toc {
	background: #fff; border-radius: var(--je-radius); box-shadow: var(--je-shadow-sm); padding: var(--je-s4);
	margin: var(--je-s4) 0 0;
}
.je-toc__title { font-size: 12px; letter-spacing: .15em; font-weight: 700; color: var(--je-accent-500); margin: 0 0 var(--je-s2); }
.je-toc__hint { font-size: 12px; color: var(--je-n-700); margin: 0 0 var(--je-s2); }
.je-toc__list { margin: 0; padding-left: 1.4em; font-size: 14px; display: grid; gap: 6px; line-height: 1.6; }
.je-toc__item { margin: 0; }
.je-toc__item > a { text-decoration: none; color: var(--je-ink); }
.je-toc__item > a:hover { color: var(--je-accent-700); text-decoration: underline; }
.je-toc__sub { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 4px; }
.je-toc__sub li { margin: 0; padding-left: 12px; position: relative; font-size: 13px; }
.je-toc__sub li::before { content: ""; position: absolute; left: 0; top: .8em; width: 5px; height: 5px; border-radius: 50%; background: var(--je-accent-300); }
.je-toc__sub a { text-decoration: none; color: var(--je-n-800); }
.je-toc__sub a:hover { color: var(--je-accent-700); text-decoration: underline; }
.je-toc__cta {
	display: flex; align-items: center; justify-content: center; margin-top: var(--je-s4);
	background: var(--je-accent-700); color: #fff; font-size: 14px; font-weight: 700;
	padding: 12px 18px; border-radius: 999px; text-decoration: none; line-height: 1.4; text-align: center;
}
.je-toc__cta:hover { background: var(--je-accent-800); color: #fff; }

/* 読み進みバー・目次ボタン */
.je-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; background: transparent; z-index: 9999; pointer-events: none; }
.je-progress__fill { height: 100%; width: 100%; transform-origin: 0 50%; transform: scaleX(0); background: var(--je-accent-500); transition: transform .08s linear; }
.je-tocbtn {
	position: fixed; right: 14px; bottom: 18px; z-index: 9998;
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 56px; height: 44px; padding: 0 16px; border-radius: 999px;
	background: #fff; color: var(--je-accent-800); font-weight: 700; font-size: 14px; text-decoration: none;
	border: 2px solid var(--je-accent-200); box-shadow: var(--je-shadow);
	opacity: 0; transform: translateY(12px); pointer-events: none; transition: opacity .2s, transform .2s;
}
.je-tocbtn.is-visible { opacity: 1; transform: translateY(0); pointer-events: auto; }

/* ============================================================
   相談CTA（全幅バンド）
   ============================================================ */
.je-cta { background: var(--je-accent-800); color: #fff; }
.je-cta__inner {
	max-width: var(--je-maxw-wide); margin: 0 auto; padding: var(--je-s8) var(--je-s4);
	display: grid; gap: var(--je-s3); justify-items: center; text-align: center;
}
.je-cta__eyebrow { margin: 0; font-size: 12px; letter-spacing: .2em; font-weight: 700; opacity: .8; }
.je-cta__lead { margin: 0; font-size: clamp(22px, 4vw, 30px); font-weight: 700; line-height: 1.45; color: #fff; }
.je-cta__note { margin: 0; font-size: 15px; line-height: 1.9; max-width: 36em; opacity: .92; }
.je-cta__actions { display: grid; gap: var(--je-s2); width: 100%; max-width: 460px; margin-top: var(--je-s2); }
.je-cta__hours { margin: 0; font-size: 13px; opacity: .8; }
.je-btn {
	display: flex; align-items: center; justify-content: center; gap: 10px;
	border-radius: 999px; font-weight: 700; text-decoration: none; line-height: 1.4;
	transition: transform .12s, background .15s;
}
.je-btn:active { transform: scale(.98); }
.je-btn--tel { background: var(--je-pink-600); color: #fff; font-size: 18px; padding: 18px 32px; box-shadow: var(--je-shadow-lg); }
.je-btn--tel:hover { background: var(--je-pink-700); color: #fff; }
.je-btn--primary { background: #fff; color: var(--je-accent-800); font-size: 16px; padding: 16px 32px; }
.je-btn--primary:hover { background: var(--je-accent-100); color: var(--je-accent-800); }
.je-btn--line { background: var(--je-line-green); color: #fff; font-size: 16px; padding: 16px 32px; }
.je-btn--line:hover { background: #05a948; color: #fff; }

/* ============================================================
   TOP・アーカイブ（既存構成をデザイントークンに合わせて再調整）
   ============================================================ */
.je-hero {
	text-align: center; padding: var(--je-s8) var(--je-s4) var(--je-s6);
	background: linear-gradient(160deg, var(--je-accent-100), #fff 75%);
	border-radius: var(--je-radius-lg); margin-bottom: var(--je-s6);
}
.je-hero__eyebrow {
	display: inline-block; font-size: 12px; font-weight: 700; color: var(--je-accent-800);
	background: #fff; border: 1px solid var(--je-accent-200); padding: 6px 16px; border-radius: 999px; margin: 0 0 var(--je-s3);
}
.je-hero__title { font-size: clamp(24px, 4.4vw, 34px); font-weight: 900; color: var(--je-accent-900); margin: 0 0 var(--je-s3); }
.je-hero__lead { font-size: 15px; color: var(--je-n-800); max-width: 640px; margin: 0 auto var(--je-s4); line-height: 1.9; }
.je-hero__actions { display: flex; gap: var(--je-s2); justify-content: center; flex-wrap: wrap; }
.je-hero__actions .je-btn { display: inline-flex; }
.je-hero__actions .je-btn--tel { font-size: 16px; padding: 14px 26px; }
.je-hero__actions .je-btn--primary { background: var(--je-accent-700); color: #fff; font-size: 16px; padding: 14px 26px; }
.je-hero__actions .je-btn--primary:hover { background: var(--je-accent-800); color: #fff; }

.je-block { margin: var(--je-s8) 0; }
.je-block__title { font-size: 20px; font-weight: 700; margin: 0 0 var(--je-s2); padding-left: var(--je-s3); border-left: 6px solid var(--je-accent-700); line-height: 1.45; color: var(--je-accent-900); }
.je-block__desc { color: var(--je-n-800); font-size: 14px; margin: 0 0 var(--je-s3); }
.je-block__more { margin-top: var(--je-s3); font-weight: 700; }
.je-block--search, .je-block--firm { background: var(--je-n-100); border-radius: var(--je-radius-lg); padding: var(--je-s4); }
.je-block--start { background: var(--je-accent-100); border-radius: var(--je-radius-lg); padding: var(--je-s4); }
.je-linklist { list-style: none; display: flex; flex-wrap: wrap; gap: 8px 22px; padding: 0; margin: 0; }
.je-linklist a { font-weight: 700; }

.je-steps-nav { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr; gap: var(--je-s2); }
.je-steps-nav li { margin: 0; }
.je-steps-nav__item a {
	display: flex; align-items: center; gap: var(--je-s3); padding: var(--je-s3) var(--je-s4);
	background: #fff; border-radius: 14px; box-shadow: var(--je-shadow-sm);
	text-decoration: none; color: var(--je-ink); height: 100%; transition: transform .15s, box-shadow .15s;
}
.je-steps-nav__item a:hover { transform: translateY(-2px); box-shadow: var(--je-shadow); }
.je-steps-nav__num { flex: none; width: 36px; height: 36px; border-radius: 50%; background: var(--je-accent-700); color: #fff; font-weight: 900; display: grid; place-items: center; }
.je-steps-nav__body { display: flex; flex-direction: column; gap: 2px; }
.je-steps-nav__label { font-weight: 700; line-height: 1.5; }
.je-steps-nav__desc { font-size: 13px; color: var(--je-n-700); line-height: 1.6; }

.je-chiplist { list-style: none; display: flex; flex-wrap: wrap; gap: var(--je-s2); padding: 0; margin: 0; }
.je-chiplist li { margin: 0; }
.je-chip {
	display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px;
	border: 2px solid var(--je-accent-200); border-radius: 999px; background: #fff;
	text-decoration: none; color: var(--je-accent-900); font-size: 14px; font-weight: 700; line-height: 1.5;
}
.je-chip:hover { border-color: var(--je-accent-700); background: var(--je-accent-100); color: var(--je-accent-900); }
.je-chiplist--lg .je-chip { font-size: 15px; padding: 10px 20px; }
.je-chip--cat { background: var(--je-accent-100); }

.je-grid { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr; gap: var(--je-s3); }
.je-grid li { margin: 0; }
.je-card {
	display: flex; flex-direction: column; height: 100%; border-radius: 14px; overflow: hidden;
	text-decoration: none; color: var(--je-ink); background: #fff; box-shadow: var(--je-shadow-sm);
	transition: transform .15s, box-shadow .15s;
}
.je-card:hover { transform: translateY(-2px); box-shadow: var(--je-shadow); color: var(--je-ink); }
.je-card__thumb img { width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block; }
.je-card__body { display: flex; flex-direction: column; gap: 6px; padding: var(--je-s3) var(--je-s4); }
.je-card__title { font-weight: 700; line-height: 1.6; }
.je-card__excerpt { font-size: 13px; color: var(--je-n-700); line-height: 1.7; }

.je-cardlist { list-style: none; padding: 0; margin: var(--je-s3) 0 0; display: grid; gap: var(--je-s2); }
.je-cardlist li { margin: 0; }
.je-cardlist__item a {
	display: flex; align-items: center; gap: var(--je-s2); padding: var(--je-s3) var(--je-s4);
	border-radius: 14px; text-decoration: none; color: var(--je-ink); background: #fff;
	box-shadow: var(--je-shadow-sm); line-height: 1.6; transition: transform .15s, box-shadow .15s;
}
.je-cardlist__item a:hover { transform: translateY(-2px); box-shadow: var(--je-shadow); color: var(--je-ink); }
.je-cardlist__title { font-weight: 700; font-size: 15px; }
.je-badge { flex: none; font-size: 11px; background: var(--je-n-100); color: var(--je-n-800); padding: 3px 10px; border-radius: 3px; white-space: nowrap; }

.je-situation-list { list-style: none; padding: 0; margin: 0 0 var(--je-s6); display: grid; grid-template-columns: 1fr; gap: var(--je-s2); }
.je-situation-list li { margin: 0; }
.je-situation-card {
	display: flex; flex-direction: column; gap: 4px; padding: var(--je-s3) var(--je-s4);
	border-radius: 14px; text-decoration: none; color: var(--je-ink); background: var(--je-accent-100);
	transition: transform .15s;
}
.je-situation-card:hover { transform: translateY(-2px); color: var(--je-ink); }
.je-situation-card__label { font-weight: 700; font-size: 15px; line-height: 1.6; }
.je-situation-card__hint { font-size: 12px; color: var(--je-n-700); }

.je-lawyer-list { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--je-s2); }
.je-lawyer-list li { margin: 0; }
.je-lawyer-list__item {
	display: flex; align-items: center; gap: var(--je-s2); padding: var(--je-s3);
	border-radius: 14px; text-decoration: none; color: var(--je-ink); background: #fff; box-shadow: var(--je-shadow-sm);
}
.je-lawyer-list__photo img { width: 54px; height: 54px; border-radius: 50%; object-fit: cover; }
.je-lawyer-list__name { font-weight: 700; line-height: 1.4; }
.je-lawyer-list__name span { display: block; font-size: 12px; color: var(--je-n-700); font-weight: 400; }

/* 会社名検索 */
.je-companysearch { position: relative; }
.je-companysearch__label { display: block; font-weight: 700; margin-bottom: 8px; }
.je-companysearch__input {
	width: 100%; padding: 14px var(--je-s4); font-size: 16px; font-family: inherit;
	border: 2px solid var(--je-accent-700); border-radius: var(--je-radius-sm); background: #fff; color: var(--je-ink);
}
.je-companysearch__input:focus { outline: 3px solid var(--je-accent-200); outline-offset: 0; }
.je-companysearch__list {
	list-style: none; margin: 6px 0 0; padding: 0; position: absolute; left: 0; right: 0; z-index: 20;
	background: #fff; border-radius: var(--je-radius-sm); box-shadow: var(--je-shadow); display: none;
	max-height: 320px; overflow-y: auto;
}
.je-companysearch.is-open .je-companysearch__list { display: block; }
.je-companysearch__list li { margin: 0; }
.je-companysearch__result { display: flex; flex-direction: column; padding: var(--je-s3) var(--je-s4); text-decoration: none; color: var(--je-ink); border-bottom: 1px solid var(--je-n-200); }
.je-companysearch__result:hover { background: var(--je-accent-100); color: var(--je-ink); }
.je-companysearch__resultname { font-weight: 700; }
.je-companysearch__resultnote { font-size: 12px; color: var(--je-n-700); }
.je-companysearch__empty { padding: var(--je-s3) var(--je-s4); color: var(--je-n-700); font-size: 14px; }

/* 定義リスト（会社情報・事例・法令・判例） */
.je-fieldlist { margin: 0; border-radius: var(--je-radius); overflow: hidden; background: #fff; box-shadow: var(--je-shadow-sm); }
.je-field-row { display: grid; grid-template-columns: 1fr; border-top: 1px solid var(--je-n-200); }
.je-field-row:first-child { border-top: 0; }
.je-field-row dt { background: var(--je-n-100); font-weight: 700; padding: var(--je-s2) var(--je-s4); font-size: 14px; margin: 0; color: var(--je-n-800); }
.je-field-row dd { padding: var(--je-s2) var(--je-s4); margin: 0; }

.je-company-card { margin: 0 0 var(--je-s6); }
.je-company-card__title { font-weight: 700; margin: 0 0 8px; }
.je-company-card--pending { background: var(--je-n-100); border-radius: var(--je-radius); padding: var(--je-s3) var(--je-s4); }
.je-company-card__pending { margin: 0; color: var(--je-n-700); font-size: 14px; }

/* 弁護士プロフィール */
.je-lawyer-profile__header { display: flex; gap: var(--je-s4); align-items: center; margin-bottom: var(--je-s6); flex-wrap: wrap; }
.je-lawyer-profile__photo img { width: 124px; height: 124px; border-radius: 50%; object-fit: cover; box-shadow: var(--je-shadow-sm); }
.je-lawyer-profile__firm { font-size: 13px; color: var(--je-n-700); margin: 0; }
.je-lawyer-profile__name { font-size: 28px; margin: 4px 0; font-weight: 700; color: var(--je-accent-900); }
.je-lawyer-profile__reading { font-size: 14px; color: var(--je-n-700); font-weight: 400; }
.je-lawyer-profile__role { color: var(--je-accent-700); font-weight: 700; margin: 0; font-size: 13px; }
.je-lawyer-profile__comment { background: var(--je-accent-100); padding: var(--je-s4); border-radius: var(--je-radius); margin: var(--je-s4) 0 0; }

/* アーカイブ */
.je-archive__header { margin-bottom: var(--je-s6); }
.je-archive__title { font-size: clamp(22px, 4vw, 30px); font-weight: 900; color: var(--je-accent-900); margin: 0 0 var(--je-s2); line-height: 1.45; }
.je-archive__lead { color: var(--je-n-800); font-size: 15px; }
.je-quicknav { margin: var(--je-s4) 0; }
.je-quicknav__title { font-weight: 700; margin: 0 0 8px; }
.je-empty { color: var(--je-n-700); background: var(--je-n-100); padding: var(--je-s4); border-radius: var(--je-radius); text-align: center; }

.je-pagination { margin-top: var(--je-s6); }
.je-pagination .nav-links { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.je-pagination a, .je-pagination span {
	display: inline-flex; min-width: 44px; min-height: 44px; align-items: center; justify-content: center;
	border-radius: var(--je-radius-xs); text-decoration: none; padding: 0 12px; background: var(--je-n-100); color: var(--je-ink);
}
.je-pagination .current { background: var(--je-accent-700); color: #fff; }

/* ============================================================
   レスポンシブ
   ============================================================ */
@media (min-width: 600px) {
	.je-field-row { grid-template-columns: 190px 1fr; }
	.je-glossary__item { grid-template-columns: 170px 1fr; }
	.je-grid { grid-template-columns: repeat(2, 1fr); }
	.je-situation-list { grid-template-columns: repeat(2, 1fr); }
	.je-cardlist { grid-template-columns: repeat(2, 1fr); }
	.je-steps-nav { grid-template-columns: repeat(3, 1fr); }
	.je-steps-nav__item a { flex-direction: column; align-items: flex-start; }
	.je-cta__actions { max-width: 460px; }
}

@media (min-width: 960px) {
	.je-two-col { grid-template-columns: minmax(0, 1fr) var(--je-side); }
	/* デスクトップは目次をサイドバーへ（本文内の目次は隠す） */
	.je-toc--inline { display: none; }
	.je-toc--side { display: block; margin: 0; }
	/* sticky はグリッドアイテム側に持たせる（align-self:start で可動域を確保） */
	.je-article__side { position: sticky; top: var(--je-sticky-top); align-self: start; }
	.je-tocbtn { display: none; }
	.je-lawyer-list { grid-template-columns: repeat(4, 1fr); }
	.je-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
	.je-card, .je-chip, .je-cardlist__item a, .je-next__card, .je-steps-nav__item a, .je-tocbtn,
	.je-progress__fill, .je-btn, .je-casecard, .je-situation-card, .je-acta__tel, .je-acta__line,
	.je-acta__form, .je-faq__toggle { transition: none; }
}