/*
 * 作品の宣伝カード（記事の中の横長カード / トップ・一覧の縦長カード）。
 * 色はテーマの変数があれば使い、無ければ既定色（ラベンダーと深い赤）に戻る。
 */
:root {
	--kw-accent: var(--k-accent, #b02a58);
	--kw-sub: var(--k-sub, #6b5a86);
	--kw-text: var(--k-text, #3b3447);
	--kw-frame: var(--k-frame, #cfc6dd);
	--kw-label: var(--k-label, #7a5ea0);
}

.kw-brand {
	display: inline-block; margin: 0 0 4px; padding: 0 10px;
	border-radius: 999px; background: var(--kw-label); color: #fff;
	font-size: 11px; line-height: 1.8; letter-spacing: 0.06em;
}
.kw-tagline { margin: 4px 0 6px; font-size: 14px; line-height: 1.6; color: var(--kw-text); }
.kw-meta { margin: 6px 0 10px; font-size: 13px; color: var(--kw-sub); }

.kw-chips { display: flex; flex-wrap: wrap; gap: 4px; margin: 6px 0 0; padding: 0; list-style: none; }
.kw-chips li {
	margin: 0; padding: 0 8px; border: 1px solid var(--kw-frame); border-radius: 999px;
	background: #fff; color: var(--kw-sub); font-size: 11px; line-height: 1.7;
}

.kw-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.kw-cta {
	display: inline-block; padding: 9px 18px; border-radius: 6px;
	background: var(--kw-accent); color: #fff; font-size: 14px; font-weight: 700; line-height: 1.4; text-decoration: none;
	transition: opacity 0.2s;
}
.kw-cta:hover { opacity: 0.8; color: #fff; text-decoration: none; }
.kw-more { font-size: 13px; color: var(--kw-sub); }
.kw-soon { font-size: 13px; color: var(--kw-sub); }
.kw-flag {
	position: absolute; top: 0; right: 0; padding: 0 10px;
	background: var(--kw-accent); color: #fff; font-size: 12px; line-height: 1.9; border-bottom-left-radius: 10px;
}

/* --- 記事の中の宣伝カード（横長） --- */
.kw-promos { display: grid; gap: 12px; margin: 0 0 1.2em; }
.kw-promo {
	display: grid; grid-template-columns: 220px 1fr; gap: 18px; align-items: center;
	padding: 14px; border: 1px solid var(--kw-frame); border-radius: 10px; background: #fff;
	box-shadow: 0 2px 10px rgba(122, 94, 160, 0.12);
}
.kw-promo-thumb { display: block; overflow: hidden; border-radius: 8px; background: #e6dbf1; aspect-ratio: 4 / 3; }
.kw-promo-thumb img, .kw-card-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; border: 0 !important; }
.kw-thumb-empty { display: block; width: 100%; height: 100%; background: #e6dbf1; }
.kw-promo-title { margin: 0; font-size: 18px; font-weight: 700; line-height: 1.45; }
.kw-promo-title a { color: var(--kw-text); text-decoration: none; }
.kw-promo-title a:hover { text-decoration: underline; }

/* --- トップ・一覧のカード（縦長） --- */
.kw-card {
	display: flex; flex-direction: column; overflow: hidden;
	border-radius: 10px; background: #fff; box-shadow: 0 2px 10px rgba(122, 94, 160, 0.14);
}
.kw-card-thumb { position: relative; display: block; flex: none; overflow: hidden; aspect-ratio: 4 / 3; background: #e6dbf1; }
.kw-card-body { display: flex; flex: 1; flex-direction: column; padding: 14px 16px 16px; color: var(--kw-text); }
.kw-card-title { margin: 0; font-size: 18px; font-weight: 700; line-height: 1.45; }
.kw-card-title a { color: var(--kw-text); text-decoration: none; }
.kw-card-title a:hover { text-decoration: underline; }
.kw-card .kw-actions { margin-top: auto; }

@media (max-width: 600px) {
	.kw-promo { grid-template-columns: 1fr; gap: 12px; }
}

/* 記事の本文の中では、リストの標準の余白（左40px・項目の余白）が効くので打ち消す */
.entry-content .kw-chips { margin: 6px 0 0; padding: 0; }
.entry-content .kw-chips li { margin: 0; }

/* 余白のそろえ（カード・記事の中の宣伝）。ブランドの丸は文字の幅だけ（縦並びの中で横いっぱいに伸びないように）。 */
.kw-brand { align-self: flex-start; width: fit-content; max-width: 100%; margin: 0 0 8px; }
.kw-card-body .kw-card-title, .kw-promo-body .kw-promo-title { margin: 0 0 8px; }
.kw-card-body .kw-tagline, .kw-promo-body .kw-tagline { margin: 0 0 12px; line-height: 1.65; }
.kw-card-body .kw-chips, .kw-promo-body .kw-chips { margin: 0 0 12px; gap: 6px; }
.kw-card-body .kw-chips li, .kw-promo-body .kw-chips li { line-height: 1.8; }
.kw-card-body .kw-meta, .kw-promo-body .kw-meta { margin: 0 0 16px; line-height: 1.6; }
.entry-content .kw-promo-body .kw-chips { margin: 0 0 12px; }