/*
 * archive.css
 * category.php（カテゴリーアーカイブ）専用。投稿カテゴリ・商品カテゴリの両方を扱う。is_category()
 * の場合のみ読み込む（functions.php）。
 */

/*
 * category.php の見出し部分は hero（.entry-title / .entry-title-en。template-parts/content.php
 * と同じ仕組み）になり、見た目は style.css の .hero が持つ。ここには archive
 * 特有の余白調整だけを残す。
 */
.c-archive-header__desc {
	color: var(--color-text);
	margin-block: 0.5rem 2rem;
}

/* ---- 投稿一覧（お知らせ等） ---- */
.c-archive-posts {
	display: grid;
	gap: 2rem;
}

.c-archive-posts__link {
	display: block;
	color: inherit;
	text-decoration: none;
}

.c-archive-posts__date {
	display: block;
	font-family: var(--font-en);
	font-size: 1rem;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

.c-archive-posts__title {
	margin: 0.25em 0;
	font-size: 1.125rem;
}

.c-archive-posts__excerpt {
	margin: 0;
	color: var(--color-text);
}



/* ---- 商品一覧（自社商品等） ---- */
.c-archive-products {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 2rem 1.5rem;
	margin-block-end: 10em;
	/* マインブロックした余白臨時サイズ */

	@media (1024px <=width) {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.c-archive-products__item {
	display: grid;
	row-gap: 1em;
	font-weight: 700;

	a {
		display: block;
		height: 100%;
		width: 100%;
		text-decoration: none;
		transition: 0.3s linear;
	}

	.c-archive-products__img {
		position: relative;
		padding-block: 1em;
		background-color: var(--color-white);
		border: 1px solid #B7B7B7;
		aspect-ratio: 1 / 1.025;
		transition: border-color 0.3s linear;
	}

	.c-archive-products__img img {
		transition: opacity 0.3s linear;
		width: 100%;
		max-width: 268px;
		height: 100%;
		display: block;
		object-fit: contain;
		margin-inline: auto;
	}

	a:hover {
		.c-archive-products__img {
			border-color: var(--color-navy);
		}

		.c-archive-products__img img {
			opacity: 0.7;
		}
	}
}

.c-archive-products__name {
	margin: 0.5em 0 0.25em;
}


.c-archive-products__price {
	text-align: right;
}

.c-archive-products__soldout {
	margin: 0.25em 0 0;
	color: var(--color-corporate-accent);
	font-weight: 700;
}

/* ---- ページネーション ---- */
.c-archive-pagination {
	margin-block-start: 3rem;
}

.c-archive-pagination ul {
	display: flex;
	justify-content: center;
	gap: 0.5em;
	list-style: none;
	margin: 0;
	padding: 0;
}

.c-archive-pagination a,
.c-archive-pagination span {
	display: block;
	padding: 0.5em 0.9em;
	color: inherit;
	text-decoration: none;
}

.c-archive-pagination .current {
	font-weight: 700;
	color: var(--color-accent, var(--color-navy));
}
@media(768px >= width){
.c-archive-posts .c-archive-posts__link{
	flex-direction: column;
}
}
.c-archive-posts .c-archive-posts__link{display: flex;align-items: flex-start;gap:0.5rem 1rem;}
.c-archive-posts__title{margin-block-start: 0;}

@media(768px < width){
.c-archive-posts__date{
	min-width: 10em;
}
}