/*
Theme Name: 樹木葬
Theme URI: https://jumokusou.co.jp/
Description: 樹木葬 (jumokusou.co.jp) WordPress theme
Author: TRYAD
Text Domain: jso
Version: 1.5.455
*/

@charset "UTF-8";

/*
 * Site-wide styles (non-LP). Loaded only when !jso_is_lp().
 * LP styles live in css/lp.css — do not mix.
 * ARCHIVE_desktop.pdf @1440 / archive_sp.pdf @390
 * SINGLE_desktop.pdf @1440 / SINGLE_mobile.pdf @390
 * PC 1024+ / Tablet 769–1023 (sidebar above) / SP ≤768
 */
:root {
	--jso-ink: #1a1a1a;
	--jso-muted: #666;
	--jso-line: #d8d8d8;
	--jso-surface: #c5d2e5;
	--jso-badge: #ececec;
	--jso-dark: #263c5d;
	--jso-green: #7a9872;
	--jso-header: #f9f7f5;
	--jso-panel: #f9f7f5;
	--jso-white: #fff;
	/* ARCHIVE_desktop.pdf @1440: content band 960px, chrome inset 80px */
	--jso-max: 960px;
	--jso-chrome-pad: 80px;
	--jso-font: "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro", "ヒラギノ角ゴ ProN", "Hiragino Sans", "Yu Gothic", "YuGothic", Meiryo, sans-serif;
	--jso-font-digit: "IBM Plex Sans", "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

/* Non-LP only. Scoped so LP .site-header / .site-footer never inherit these. */
body.jso-column {
	margin: 0;
	font-family: var(--jso-font);
	color: var(--jso-ink);
	background: var(--jso-white);
	-webkit-font-smoothing: antialiased;
}

/*
 * Non-LP reset.
 * Shared resets are scoped here so LP styles remain independent.
 */
body.jso-column img {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}

body.jso-column a {
	color: inherit;
	text-decoration: none;
}

body.jso-column a:hover {
	opacity: 0.85;
}

body.jso-column button,
body.jso-column input,
body.jso-column textarea,
body.jso-column select {
	font: inherit;
}

/* Header — ARCHIVE_desktop.pdf (beige bar; brand left @80) */
body.jso-column .site-header {
	border-bottom: 0;
	background: var(--jso-header);
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
	position: sticky;
	top: 0;
	z-index: 100;
}

body.jso-column .site-header__inner {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 24px;
	width: 100%;
	max-width: none;
	height: auto;
	min-height: 83px;
	margin: 0;
	padding: 0 var(--jso-chrome-pad);
	box-sizing: border-box;
}

body.jso-column .site-header__brand {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
	margin: 0;
	color: var(--jso-ink);
	text-decoration: none;
}

body.jso-column .site-header__name {
	font-family: var(--jso-font);
	font-weight: 700;
	/* ARCHIVE_desktop: glyph bounds y=31.7–54 / 22px. */
	font-size: 22px;
	line-height: 1.3;
	letter-spacing: 0.02em;
	color: var(--jso-ink);
}

/* Archive */
.column-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	/* ARCHIVE_desktop: breadcrumb → title gap */
	margin-bottom: 64px;
	color: #4c4b4b;
	font-size: 13px;
	line-height: 1.4;
}

.column-breadcrumb a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.column-breadcrumb__sep {
	opacity: 0.7;
	text-decoration: none;
}

.column-archive__inner,
.column-single__inner,
.column-related__inner {
	width: min(var(--jso-max), calc(100% - 48px));
	margin: 0 auto;
	box-sizing: border-box;
}

.column-archive__inner,
.column-single__inner {
	padding: 40px 0 160px;
}

.column-archive__title {
	font-family: var(--jso-font);
	font-size: 30px;
	font-weight: 700;
	line-height: 1.3;
	margin: 0;
	padding-bottom: 80px;
	letter-spacing: 0.04em;
	color: var(--jso-dark);
}

.column-archive__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 297px;
	gap: 40px;
	align-items: start;
}

.column-archive__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 40px;
}

.column-archive__empty {
	margin: 0;
	color: var(--jso-muted);
}

.column-archive__pagination {
	margin-top: 48px;
}

.column-archive__pagination .nav-links {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}

/* Sidebar filter */
.column-archive__sidebar {
	position: sticky;
	top: 88px;
}

.column-filter {
	/* ARCHIVE_desktop sidebar 297×418 / inset ≈24 */
	padding: 36px 24px 32px;
	background: var(--jso-panel);
	border-radius: 4px;
	box-sizing: border-box;
}

.column-filter__heading {
	font-family: var(--jso-font);
	font-size: 16px;
	font-weight: 700;
	margin: 0;
	padding-bottom: 16px;
	color: var(--jso-dark);
}

.column-filter__block + .column-filter__block {
	margin-top: 32px;
}

.column-filter__row {
	display: grid;
	grid-template-columns: 3.5em minmax(0, 1fr);
	gap: 8px 12px;
	align-items: center;
}

.column-filter__row + .column-filter__row {
	margin-top: 14px;
}

.column-filter__label {
	display: block;
	margin-bottom: 0;
	font-size: 13px;
	font-weight: 500;
	color: #4c4b4b;
}

.column-filter__select-wrap {
	position: relative;
}

.column-filter__select {
	width: 100%;
	appearance: none;
	-webkit-appearance: none;
	min-height: 41px;
	padding: 10px 36px 10px 14px;
	border: 1px solid #929292;
	border-radius: 3.5px;
	background: var(--jso-white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23929292' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 12px center;
	color: var(--jso-ink);
	font: inherit;
	font-size: 14px;
	line-height: 1.4;
}

.column-filter__select:disabled {
	opacity: 0.55;
	background-color: #fafafa;
}

.column-filter__pills {
	display: flex;
	flex-wrap: wrap;
	gap: 9px;
}

.column-filter__pill {
	display: inline-flex;
	cursor: pointer;
}

.column-filter__pill input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.column-filter__pill span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 27px;
	padding: 4px 10px;
	border: 1px solid #929292;
	border-radius: 2px;
	background: var(--jso-white);
	color: #4c4b4b;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.3;
	box-sizing: border-box;
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.column-filter__pill input:checked + span,
.column-filter__pill:hover span {
	background: var(--jso-dark);
	border-color: var(--jso-dark);
	color: var(--jso-white);
}

.column-filter__submit {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 40px;
	margin-top: 28px;
	padding: 10px 16px;
	border: 0;
	/* ARCHIVE_desktop submit rx=8 */
	border-radius: 8px;
	background: var(--jso-dark);
	color: var(--jso-white);
	font: inherit;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
}

.column-filter__submit:hover {
	opacity: 0.92;
}

/* Card */
.column-card__link {
	display: block;
	color: inherit;
	text-decoration: none;
}

.column-card__thumb {
	margin-bottom: 0;
	aspect-ratio: 3 / 2;
	background: var(--jso-surface);
	overflow: hidden;
	border-radius: 2px;
}

.column-card__thumb--placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	border: 2px dotted #406bac;
	border-radius: 0;
	color: #406bac;
	font-size: 14px;
	font-weight: 700;
}

.column-card__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.column-card__body {
	/* Thumbnail to badges spacing. */
	padding-top: 16px;
}

.column-card__badges {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.column-card__badge {
	position: static;
	inset: auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 28px;
	padding: 4px 12px;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.4;
	border-radius: 2px;
	box-sizing: border-box;
}

.column-card__badge--area {
	background: var(--jso-green);
	color: var(--jso-white);
}

.column-card__badge--cat {
	background: var(--jso-white);
	border: 1px solid var(--jso-green);
	color: var(--jso-green);
}

.column-card__badge a {
	display: block;
}

.column-card__title {
	font-family: var(--jso-font);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.5;
	margin: 0;
	padding-top: 8px;
	color: var(--jso-dark);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.front-page__inner {
	width: min(var(--jso-max), calc(100% - 48px));
	margin: 0 auto;
	padding: 48px 0 64px;
}

.front-page__title {
	font-size: clamp(28px, 4vw, 40px);
	font-weight: 700;
	margin: 0 0 24px;
}

.front-page__to-column {
	margin-top: 40px;
}

.front-page__to-column a {
	font-weight: 700;
	text-decoration: underline;
}

/* Single — SINGLE_desktop.pdf @1440 */
.column-single__header {
	position: relative;
	margin-bottom: 0;
}

.column-single__badges .column-card__badge a {
	color: inherit;
	text-decoration: none;
}

.column-single__title {
	font-family: var(--jso-font);
	font-size: 30px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.02em;
	color: var(--jso-dark);
	margin: 0;
}

@media (min-width: 1024px) {
	.column-single__title {
		padding-top: 32px;
		padding-bottom: 24px;
	}
}

.column-single__date {
	margin: 24px 0 0;
	text-align: right;
	font-family: var(--jso-font-digit), var(--jso-font);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.4;
	color: #919191;
}

.column-single__toc {
	margin: 72px 0 48px;
	padding: 40px 40px 36px;
	background: var(--jso-panel);
	border-radius: 4px;
}

.column-single__toc-label {
	margin: 0 0 20px;
	font-family: var(--jso-font);
	font-size: 16px;
	font-weight: 700;
	color: var(--jso-green);
}

.column-single__toc-list {
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: none;
}

.column-single__toc-list li + li {
	margin-top: 18px;
}

.column-single__toc-list a {
	display: inline-flex;
	align-items: baseline;
	gap: 0.35em;
	color: #4c4b4b;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.6;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.column-single__toc-list a:hover {
	color: var(--jso-dark);
	opacity: 1;
}

.column-single__toc-num {
	color: var(--jso-green);
	font-weight: 700;
	text-decoration: none;
	flex-shrink: 0;
}

/* Entry typography / core blocks → css/blocks.css (block_css_pc.pdf) */
.column-single__content {
	max-width: none;
	width: 100%;
}

.column-related {
	background: var(--jso-header);
	border-top: 0;
	padding: 48px 0 64px;
}

.column-related__title {
	font-family: var(--jso-font);
	font-size: 24px;
	font-weight: 700;
	margin: 0 0 28px;
	color: var(--jso-dark);
}

.column-related__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px 24px;
}

.column-related .column-card__title {
	font-size: 15px;
}

/* Footer — ARCHIVE_desktop.pdf (solid green bar) */
body.jso-column .site-footer {
	background: var(--jso-green);
	background-image: none;
	color: #fff;
	/* ARCHIVE_desktop: footer y=1461–1551 / 90px. */
	padding: 0 var(--jso-chrome-pad);
	font-family: var(--jso-font);
}

body.jso-column .site-footer a {
	color: inherit;
	text-decoration: underline;
	opacity: 1;
}

body.jso-column .site-footer__bottom {
	max-width: none;
	width: 100%;
	min-height: 90px;
	margin: 0;
	padding: 0;
	border-top: 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	font-size: 12px;
	font-weight: 400;
	line-height: 1.4;
	opacity: 1;
	box-sizing: border-box;
}

body.jso-column .site-footer__bottom small {
	font-family: var(--jso-font-digit), var(--jso-font);
	font-size: 12px;
	font-weight: 400;
}

/*
 * Breakpoints
 * PC:     1024+   (default — ARCHIVE/SINGLE desktop)
 * Tablet: 769–1023 (sidebar stacked above)
 * SP:     ≤768    (archive_sp.pdf / SINGLE_mobile.pdf @390)
 */
@media (max-width: 1023px) {
	.column-archive__inner,
	.column-single__inner,
	.column-related__inner,
	.front-page__inner {
		width: min(var(--jso-max), calc(100% - 48px));
		padding: 32px 0 72px;
	}

	.column-archive__title {
		padding-bottom: 48px;
	}

	.column-archive__layout {
		grid-template-columns: 1fr;
		gap: 36px;
	}

	.column-archive__sidebar {
		position: static;
		order: -1;
	}

	.column-archive__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 36px 28px;
	}

	.column-related__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.column-related {
		padding: 48px 0 56px;
	}

	body.jso-column .site-header__inner {
		padding-inline: 40px;
	}

	body.jso-column .site-footer {
		padding-inline: 40px;
	}
}

@media (max-width: 768px) {
	:root {
		--jso-chrome-pad: 15px;
	}

	body.jso-column .site-header__inner {
		min-height: 59px;
		padding: 0 var(--jso-chrome-pad);
		flex-wrap: nowrap;
	}

	body.jso-column .site-header__name {
		font-size: 18px;
	}

	body.jso-column .site-footer {
		padding: 20px var(--jso-chrome-pad);
	}

	body.jso-column .site-footer__bottom {
		min-height: 0;
		flex-direction: row;
		align-items: center;
		font-size: 12px;
	}

	body.jso-column .site-footer__bottom small {
		font-size: 12px;
	}

	.column-archive__inner,
	.column-single__inner,
	.column-related__inner,
	.front-page__inner {
		width: calc(100% - 30px);
		padding: 40px 0 64px;
	}

	.column-breadcrumb {
		margin-bottom: 45px;
		font-size: 12px;
		gap: 6px;
		color: #4c4b4b;
	}

	.column-archive__title {
		font-size: 30px;
		padding-bottom: 66px;
	}

	.column-archive__layout {
		gap: 40px;
	}

	.column-archive__grid {
		grid-template-columns: 1fr;
		gap: 30px;
	}

	.column-filter {
		padding: 36px 24px 32px;
	}

	/* SP mock keeps label + select on one row */
	.column-filter__row {
		grid-template-columns: 3.5em minmax(0, 1fr);
		gap: 8px 12px;
		align-items: center;
	}

	.column-filter__select {
		min-height: 44px;
	}

	.column-filter__pills {
		gap: 6px;
	}

	.column-filter__pill span {
		min-height: 30px;
	}

	.column-card__thumb--placeholder {
		border: 0;
		outline: 2px dotted #406bac;
	}

	.column-card__badges {
		margin-bottom: 0;
	}

	.column-card__badge--cat {
		border: 0;
		outline: 1px solid var(--jso-green);
	}

	.column-single__badges .column-card__badge {
		min-height: 28px;
		padding: 6px 12px;
		box-sizing: border-box;
		display: inline-flex;
		align-items: center;
	}

	.column-single__title {
		font-size: 30px;
		line-height: 1.25;
		letter-spacing: 0.02em;
		padding: 30px 0 24px;
	}

	.column-single__date {
		margin-top: 64px;
		font-size: 13px;
	}

	.column-single__toc {
		margin: 68px 0 38px;
		padding: 36px 30px 38px;
	}

	.column-single__toc-label {
		margin-bottom: 38px;
		font-size: 16px;
	}

	.column-single__toc-list li + li {
		margin-top: 40px;
	}

	.column-single__toc-list a {
		font-size: 15px;
	}

	.column-related {
		padding: 54px 0 64px;
	}

	.column-related__inner {
		padding: 0;
	}

	.column-related__title {
		font-size: 24px;
		margin-bottom: 30px;
	}

	.column-related__grid {
		grid-template-columns: 1fr;
		gap: 36px;
	}

	.column-related .column-card__body {
		padding-top: 16px;
	}

	.column-related .column-card__title {
		font-size: 16px;
		line-height: 1.35;
		-webkit-line-clamp: 2;
	}

}