/* ━━━ WordPress 管理バー補正（ログイン中：デスクトップ 32px / モバイル 46px） ━━━ */
.admin-bar .recruit-bar  { top: 32px; }
.admin-bar .site-header  { top: calc(32px + var(--banner-h)); }
.admin-bar .site-sidebar {
	top: calc(32px + var(--banner-h) + var(--header-h) + 1.25rem);
	max-height: calc(100vh - 32px - var(--banner-h) - var(--header-h) - 2.5rem);
}

@media screen and (max-width: 782px) {
	.admin-bar .recruit-bar { top: 46px; }
	.admin-bar .site-header { top: calc(46px + var(--banner-h)); }
}

/* ━━━ サイトヘッダー（スティッキー） ━━━ */
.site-header {
	position: fixed;
	top: var(--banner-h); left: 0; right: 0;
	height: var(--header-h);
	background: rgba(255,255,255,.92);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	border-bottom: 2px solid var(--c-border);
	z-index: 1000;
	transition: box-shadow .3s ease;
}
.site-header.is-scrolled {
	box-shadow: 0 4px 28px rgba(0,0,0,.1);
	border-bottom-color: transparent;
}
.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 100%;
	max-width: var(--max-w);
	margin-inline: auto;
	padding-inline: var(--gutter);
	gap: 1rem;
}
.site-header__logo a {
	display: flex;
	align-items: center;
	gap: .6rem;
	font-size: 1.1rem;
	font-weight: 900;
	color: var(--c-text);
	white-space: nowrap;
}
.logo-icon {
	width: 38px; height: 38px;
	background: var(--c-blue);
	border-radius: var(--r-sm);
	display: flex; align-items: center; justify-content: center;
	color: #fff; font-size: 1rem; font-weight: 900;
	flex-shrink: 0;
	box-shadow: 0 4px 12px rgba(0,85,255,.4);
}

/* ━━━ プライマリナビ ━━━ */
.site-nav { margin-left: auto; }
.site-nav__list {
	display: flex;
	align-items: center;
	gap: .15rem;
}
.site-nav__list a {
	display: block;
	padding: .45rem .9rem;
	border-radius: var(--r-pill);
	font-size: .82rem;
	font-weight: 700;
	color: var(--c-text);
	white-space: nowrap;
	transition: all .2s ease;
}
.site-nav__list a:hover { background: var(--c-blue-lt); color: var(--c-blue); }
.site-nav__list .nav-cta a { background: var(--c-blue); color: #fff; }
.site-nav__list .nav-cta a:hover { background: #003FCC; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,85,255,.35); }

/* ━━━ ハンバーガー ━━━ */
.nav-toggle {
	display: none;
	background: none;
	border: 2px solid var(--c-border);
	border-radius: var(--r-sm);
	padding: .4rem .65rem;
	cursor: pointer;
	font-size: 1.2rem;
	line-height: 1;
	color: var(--c-text);
}

/* ━━━ サイトレイアウト ━━━ */
.site-layout {
	display: grid;
	grid-template-columns: 1fr 320px;
	gap: clamp(1.5rem, 3vw, 2.5rem);
	align-items: start;
	padding-block: clamp(1.5rem, 4vw, 3rem);
}
/* grid 子の min-width: auto を打ち消す。 これが無いと中身の min-content が
 * 1fr を押し広げ、 320px サイドバーが画面外へはみ出る。 */
.site-layout > main { min-width: 0; }

/* サイドバーを持たないページ用。 .site-main がコンテナ全幅 (max 1200px) を占める。 */
.site-layout--no-sidebar { grid-template-columns: 1fr; }

/* ━━━ セクション共通 ━━━ */
.section { margin-bottom: clamp(2rem, 5vw, 3.5rem); }
/* 新着記事→おすすめ記事を直接隣接させる */
.section--recent { margin-bottom: 0; }
.section-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1.25rem;
	flex-wrap: wrap;
	gap: .5rem;
}
.section-header .section-title { margin-bottom: 0; }

/* ━━━ 記事グリッド ━━━ */
.posts-grid { display: grid; gap: 1.25rem; }
.posts-grid--3 { grid-template-columns: repeat(3, 1fr); }
.posts-grid--2 { grid-template-columns: repeat(2, 1fr); }

/* ━━━ サイドバー ━━━ */
.site-sidebar {
	position: sticky;
	top: calc(var(--banner-h) + var(--header-h) + 1.25rem);
	max-height: calc(100vh - var(--banner-h) - var(--header-h) - 2.5rem);
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: var(--c-border) transparent;
}
.site-sidebar::-webkit-scrollbar { width: 4px; }
.site-sidebar::-webkit-scrollbar-track { background: transparent; }
.site-sidebar::-webkit-scrollbar-thumb { background: var(--c-border); border-radius: 2px; }

/* 記事個別ページ: ページと同期してスクロール（sticky 解除） */
.site-sidebar--flow {
	position: static;
	max-height: none;
	overflow-y: visible;
}

/* ━━━ フッター ━━━ */
.site-footer {
	background: var(--c-text);
	color: rgba(255,255,255,.75);
	padding-block: 2.5rem;
	margin-top: 2rem;
}
.site-footer__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1.25rem;
	text-align: center;
}
.site-footer__logo {
	font-size: 1.2rem;
	font-weight: 900;
	color: #fff;
	display: flex;
	align-items: center;
	gap: .6rem;
}
.site-footer__logo .logo-icon { background: var(--c-blue); width: 32px; height: 32px; font-size: .9rem; }
.site-footer__nav-list {
	display: flex;
	gap: .5rem 1.25rem;
	flex-wrap: wrap;
	justify-content: center;
}
.site-footer__nav-list a { font-size: .82rem; color: rgba(255,255,255,.6); transition: color .2s; }
.site-footer__nav-list a:hover { color: #fff; }
.site-footer__copy { font-size: .78rem; }

/* ━━━ レスポンシブ ━━━ */
@media (max-width: 960px) {
	.site-layout { grid-template-columns: 1fr; }
	.site-sidebar { position: static; }
}
@media (max-width: 700px) {
	.posts-grid--3 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
	.posts-grid--3, .posts-grid--2 { grid-template-columns: 1fr; }
}
@media (max-width: 860px) {
	.site-nav { display: none; position: absolute; top: calc(var(--banner-h) + var(--header-h)); left: 0; right: 0; }
	.site-nav.is-open {
		display: block;
		background: #fff;
		border-bottom: 2px solid var(--c-border);
		box-shadow: 0 8px 28px rgba(0,0,0,.12);
		z-index: 999;
	}
	.site-nav.is-open .site-nav__list {
		flex-direction: column;
		align-items: flex-start;
		padding: 1rem var(--gutter);
		gap: .25rem;
	}
	.nav-toggle { display: block; }
}