/* AIシゴト図鑑: 下層ページのブランド統一 (navy x amber)
 * ヘッダー/フッター/スマホメニューの基調色は loos_customizer 側で設定済み。
 * ここでは琥珀アクセントと細部のみを上書きする。フロントは home.css が担当（本CSSは非読込）。 */

:root {
	--aizk-amber: #F5A623;
	--aizk-navy: #0A0F1D;
	--aizk-line: rgba(148, 170, 210, .14);
}

/* header: home.css と同じ境界線・ホバー色 */
.l-header,
.l-fixHeader { border-bottom: 1px solid var(--aizk-line); box-shadow: none; }
.l-header .c-gnav > .menu-item > a:hover,
.l-fixHeader .c-gnav > .menu-item > a:hover { color: var(--aizk-amber); }

/* footer: home.css と同じ境界線 */
.l-footer { border-top: 1px solid var(--aizk-line); }

/* page title: 琥珀のアンダーラインでフロントの見出し意匠と接続 */
.c-pageTitle__inner {
	display: inline-block;
	padding-bottom: .3em;
	border-bottom: 3px solid var(--aizk-amber);
}

/* sidebar CTA card */
.aizk-side-cta { margin-bottom: 24px; }

/* archive: 「– category –」「– tax –」等の英字サブタイトルを非表示（日本語UIに不要な装飾） */
.c-pageTitle__subTitle { display: none; }

/* =========================================================
   2026-07-24 デザイン型反映（見晴コラムで実証したマガジン型＋エディトリアル調）
   変更はCSSのみ。HTML/見出し/本文は不変（SEO無風）。
   ========================================================= */

/* --- (a) 面の角丸2px統一（円形50%は除外） --- */
.c-pagination .page-numbers { border-radius: 2px; }
.wp-block-button__link { border-radius: 2px !important; }
/* サイドバー診断CTAカード（widget内はインラインstyleのため !important で上書き） */
.aizk-side-cta { border-radius: 2px !important; }
.aizk-side-cta a { border-radius: 2px !important; }

/* --- (b) サムネ上のカテゴリバッジ: アイコン除去＋トラッキング文字で編集誌調に --- */
.c-postThumb__cat {
	background-color: rgba(10, 15, 29, .92);
	font-weight: 700;
	letter-spacing: .12em;
	padding: .35em 1em;
	border-radius: 0;
}
.c-postThumb__cat::before { content: none !important; margin: 0 !important; }

/* --- (c) 記事一覧（カテゴリ等アーカイブ）のマガジン型グリッド ---
   SWELLの -type-card（flex＋width%）をグリッドに置き換える。
   〜680px: 1col ／ 680px〜: 2col＋featured(先頭1件)全幅縦型 ／
   860px〜: featuredを横型分割 ／ 1020px〜: 3col */
.p-termContent .p-postList.-type-card {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 32px 20px;
	margin-left: 0;
	margin-right: 0;
}
.p-termContent .p-postList.-type-card .p-postList__item {
	width: 100%;
	margin: 0;
	padding: 0;
	min-width: 0;
}
.p-termContent .p-postList.-type-card .p-postList__link {
	display: flex;
	flex-direction: column;
	height: 100%;
}
.p-termContent .p-postList.-type-card .p-postList__body {
	display: flex;
	flex-direction: column;
	flex: 1;
	min-width: 0;
}
/* 説明文3行クランプ＋日付は下揃え（カード高さのガタつき防止2点セット） */
.p-termContent .p-postList.-type-card .p-postList__excerpt {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
	line-height: 1.7;
}
.p-termContent .p-postList.-type-card .p-postList__meta {
	margin-top: auto;
	padding-top: .75em;
}
.p-termContent .p-postList.-type-card .p-postList__title {
	line-height: 1.5;
}

@media (min-width: 680px) {
	.p-termContent .p-postList.-type-card {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	/* featured: 先頭1件は全幅（この帯域では縦型のまま=大画像＋タイトル） */
	.p-termContent .p-postList.-type-card .p-postList__item:first-child {
		grid-column: 1 / -1;
	}
	.p-termContent .p-postList.-type-card .p-postList__item:first-child .p-postList__title {
		font-size: 20px;
	}
}

/* featuredの横型分割は本文列に十分な幅が取れる860px〜（680px開始は中間幅で本文が潰れる罠） */
@media (min-width: 860px) {
	.p-termContent .p-postList.-type-card .p-postList__item:first-child .p-postList__link {
		display: grid;
		grid-template-columns: 54% minmax(0, 1fr);
		gap: 28px;
		align-items: center;
	}
	.p-termContent .p-postList.-type-card .p-postList__item:first-child .p-postList__body {
		padding-top: 0;
	}
	.p-termContent .p-postList.-type-card .p-postList__item:first-child .p-postList__title {
		font-size: 23px;
		line-height: 1.45;
	}
	.p-termContent .p-postList.-type-card .p-postList__item:first-child .p-postList__excerpt {
		font-size: 14px;
	}
}

@media (min-width: 1020px) {
	.p-termContent .p-postList.-type-card {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.p-termContent .p-postList.-type-card .p-postList__item:first-child {
		grid-column: 1 / -1;
	}
}
