/* =========================================================
   リンクセクション（section_link）
   配置: assets/css/al/46-link-section.css
   章立て（番号＋ラベル＋見出し＋説明＋リンク）＋右にリンク先カード。
   トップの 01/02/03 型を共通化。すべて lr-link-section 配下にスコープ。
   背景・余白・幅は section 共通（data-width/pt/pb/bg）に委譲。
   ========================================================= */

/* ------------------------------------------------------------
   グリッド：スマホ縦積み → PC で 左ナビ細め・右コンテンツ広め
   （K.aL と同様の minmax 比率）
   ------------------------------------------------------------ */
.lr-link-section__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--lr-space-lg);
}
@media (min-width: 900px) {
	.lr-link-section__grid {
		grid-template-columns: minmax(240px, 1fr) 2fr;
		gap: var(--lr-space-2xl);
		align-items: stretch;   /* 子（右コンテンツ）が枠高さを取れるように */
		/* 高さを 320px に固定（PCのみ・絶対値）。
		   中身が超えないよう運用で抑える前提。スマホは指定しない（中身なり）。 */
		height: 320px;
	}
}

/* ------------------------------------------------------------
   左：ナビ
   ------------------------------------------------------------ */
.lr-link-section__nav {
	min-width: 0;
}

/* 番号＋ラベルの横並び（番号の右にラベル） */
.lr-link-section__eyebrow {
	display: flex;
	align-items: center;
	gap: var(--lr-space-sm);
}

/* 番号：大きな連番（赤）。data-has-number="0" のときは PHP が出さない。
   装飾専用に Bodoni Moda（数字のみサブセットで読み込み・al_scripts）を当てる。
   ハイコントラストのディドネ体で数字を装飾的に見せる。
   サイズは装飾専用に大きく取る（スマホ56→PC104px）。 */
.lr-link-section__number {
	margin: 0;
	color: var(--lr-accent);
	font-family: "Bodoni Moda", Georgia, serif;
	font-weight: var(--lr-weight-bold);
	font-size: clamp(3.5rem, 2rem + 6vw, 6.5rem);
	line-height: 1;
	letter-spacing: var(--lr-tracking-tight);
	font-variant-numeric: tabular-nums;
}

/* ラベル（英字・赤・小さめ）。番号の右に置く。 */
.lr-link-section__label {
	margin: 0;
	color: var(--lr-accent);
	font-size: var(--lr-font-sm);
	font-weight: var(--lr-weight-bold);
	letter-spacing: 0.12em;
}

/* 見出し（h2） */
.lr-link-section__title {
	margin: var(--lr-space-sm) 0 0;
	color: var(--lr-text);
	font-size: var(--lr-font-heading);
	font-weight: var(--lr-weight-black);
	line-height: var(--lr-leading-tight);
	letter-spacing: var(--lr-tracking-tight);
}

/* 説明文 */
.lr-link-section__lead {
	margin-top: var(--lr-space-sm);
	color: var(--lr-text-muted);
	font-size: var(--lr-font-base);
	line-height: var(--lr-leading-body);
}

/* リンク（→付き） */
.lr-link-section__link {
	display: inline-flex;
	align-items: center;
	gap: var(--lr-space-xs);
	margin-top: var(--lr-space-md);
	color: var(--lr-accent);
	font-size: var(--lr-font-base);
	font-weight: var(--lr-weight-bold);
	letter-spacing: 0.04em;
	text-decoration: none;
	transition: gap var(--lr-ease), color var(--lr-ease);
}
.lr-link-section__link:hover {
	color: var(--lr-accent-ink);
	gap: var(--lr-space-sm);
}
.lr-link-section__arrow {
	line-height: 1;
}

/* ------------------------------------------------------------
   右：リンク先カード（アイキャッチ＋タイトル）
   カード装飾は最小限（枠・影なし）。画像は元比率のまま。
   ------------------------------------------------------------ */
.lr-link-section__content {
	min-width: 0;
}
.lr-link-section__card {
	display: block;
	color: var(--lr-text);
	text-decoration: none;
}
.lr-link-section__figure {
	margin: 0 0 var(--lr-space-sm);
	overflow: hidden;
}
.lr-link-section__image {
	display: block;
	width: 100%;
	height: auto;
	transition: opacity var(--lr-ease);
}
.lr-link-section__card:hover .lr-link-section__image {
	opacity: 0.9;
}
.lr-link-section__card-title {
	display: block;
	font-size: var(--lr-font-lg);
	font-weight: var(--lr-weight-bold);
	line-height: var(--lr-leading-tight);
	letter-spacing: var(--lr-tracking-tight);
	color: var(--lr-text);
}
.lr-link-section__card:hover .lr-link-section__card-title {
	color: var(--lr-accent);
}

/* ------------------------------------------------------------
   右：ページ紹介（source=page）— サブタイトル追加分
   ------------------------------------------------------------ */
/* 右コンテンツは枠（グリッド高さ）を超えない。画像はこの中で高さ基準に縮む。 */
.lr-link-section__content {
	min-width: 0;
	min-height: 0;
	height: 100%;
	overflow: hidden;
}
.lr-link-section__card-sub {
	display: block;
	margin-top: var(--lr-space-2xs);
	font-size: var(--lr-font-sm);
	color: var(--lr-text-muted);
	line-height: var(--lr-leading-body);
}

/* ------------------------------------------------------------
   右：投稿タイプから複数（source=archive）
   個別リンクなしの装飾表示。アイキャッチ＋タイトルを件数分グリッドで。
   件数（data-count 1〜4）で列数を決める。スマホは2列（1件なら1列）。
   ------------------------------------------------------------ */
.lr-link-section__items {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--lr-space-md);
	margin: 0;
	padding: 0;
	list-style: none;
}
/* 1件だけなら1列（大きく見せる） */
.lr-link-section__items[data-count="1"] {
	grid-template-columns: 1fr;
}
@media (min-width: 600px) {
	/* PC寄り：件数ぶんの列に展開（最大4列） */
	.lr-link-section__items[data-count="2"] { grid-template-columns: repeat(2, 1fr); }
	.lr-link-section__items[data-count="3"] { grid-template-columns: repeat(3, 1fr); }
	.lr-link-section__items[data-count="4"] { grid-template-columns: repeat(4, 1fr); }
}

.lr-link-section__item {
	min-width: 0;
}
.lr-link-section__item-figure {
	margin: 0 0 var(--lr-space-xs);
	overflow: hidden;
	aspect-ratio: 1 / 1;   /* 装飾なので正方形に揃えて整然と見せる */
}
.lr-link-section__item-image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.lr-link-section__item-title {
	display: block;
	font-size: var(--lr-font-sm);
	font-weight: var(--lr-weight-bold);
	line-height: var(--lr-leading-tight);
	color: var(--lr-text);
}

/* ------------------------------------------------------------
   右：展示会専用（source=archive / post_type=al_exhibition）
   今日に最も近い展示を1件。左画像・右に 名前／会期／説明。
   セクション高さ（320px）に画像もテキストも収める。画像は枠高さ基準。
   ------------------------------------------------------------ */
.lr-link-section__exhibition {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--lr-space-md);
	color: var(--lr-text);
	text-decoration: none;
	height: 100%;
	min-height: 0;   /* グリッドアイテムが内容で伸びないように */
}
@media (min-width: 600px) {
	.lr-link-section__exhibition {
		grid-template-columns: minmax(0, 40%) 1fr;   /* 左画像は最大40%・右テキストを確保 */
		align-items: center;
	}
}
.lr-link-section__ex-figure {
	margin: 0;
	overflow: hidden;
	height: 100%;
	max-height: 100%;
	min-height: 0;
}
.lr-link-section__ex-image {
	display: block;
	width: 100%;           /* 列幅（最大40%）いっぱい */
	height: 100%;
	object-fit: cover;
	transition: opacity var(--lr-ease);
}
.lr-link-section__exhibition:hover .lr-link-section__ex-image {
	opacity: 0.9;
}
.lr-link-section__ex-body {
	min-width: 0;
	overflow: hidden;      /* 万一のはみ出しを抑える */
}
.lr-link-section__ex-title {
	margin: 0;
	font-size: var(--lr-font-lg);
	font-weight: var(--lr-weight-bold);
	line-height: var(--lr-leading-tight);
	letter-spacing: var(--lr-tracking-tight);
	color: var(--lr-text);
}
.lr-link-section__exhibition:hover .lr-link-section__ex-title {
	color: var(--lr-accent);
}
.lr-link-section__ex-term {
	margin: var(--lr-space-xs) 0 0;
	font-size: var(--lr-font-sm);
	font-weight: var(--lr-weight-bold);
	color: var(--lr-accent);
	letter-spacing: 0.02em;
}
.lr-link-section__ex-desc {
	margin: var(--lr-space-sm) 0 0;
	font-size: var(--lr-font-sm);
	line-height: var(--lr-leading-body);
	color: var(--lr-text-muted);
}

/* 作家アーカイブ：320px固定の枠から出して、偶数番目を下げた互い違いに */
@media (min-width: 900px) {
	/* この作家グリッドを含むときだけ高さ固定・切り抜きを解除 */
	.lr-link-section__grid:has(.lr-link-section__items[data-count="4"]) {
		height: auto;
	}
	.lr-link-section__grid:has(.lr-link-section__items[data-count="4"]) .lr-link-section__content {
		height: auto;
		overflow: visible;
	}
	/* 偶数番目だけ下げる。margin なので親高さに正しく反映される */
	.lr-link-section__items[data-count="4"] {
		align-items: start;
	}
	.lr-link-section__items[data-count="4"] .lr-link-section__item:nth-child(even) {
		margin-top: var(--lr-space-2xl);
	}
}

