/**
 * TingPro 响应式：断点 1024 / 768 / 480。
 */

/* ≤1024：侧栏移入抽屉 */
@media screen and (max-width: 1024px) {
	.site-layout {
		grid-template-columns: minmax(0, 1fr);
		max-width: 900px;
	}

	.site-sidebar {
		display: none;
	}

	.topbar__btn--burger {
		display: inline-flex;
	}

	.card,
	.card--featured {
		grid-template-columns: 240px minmax(0, 1fr);
	}

	.card--featured .card__media,
	.cards-featured .card--featured:nth-child(even) .card__media {
		border-radius: var(--radius-md);
	}
}

/* ≤768：顶栏菜单折叠进抽屉，大卡片变上图下文 */
@media screen and (max-width: 768px) {
	.topbar.is-floating {
		margin-top: 8px;
		padding: 0 12px;
	}

	.topbar__nav {
		display: none;
	}

	.topbar__inner {
		padding-left: 22px;
	}

	.site-layout {
		margin-top: 16px;
		gap: 0;
		padding: 0 12px;
	}

	.card,
	.card--featured {
		grid-template-columns: 1fr;
		gap: 0;
		padding: 14px;
	}

	.card__media {
		height: 200px;
	}

	.card--featured .card__media,
	.cards-featured .card--featured:nth-child(even) .card__media {
		border-radius: var(--radius-md) var(--radius-md) 0 0;
	}

	/* 上图下文：媒体永远在上 */
	.cards-featured .card--featured:nth-child(even) .card__media {
		order: 0;
	}

	.card__body {
		padding: 16px 4px 6px;
	}

	.card--featured .card__body {
		padding: 16px 4px 6px;
	}

	.card__title {
		font-size: 1.05rem;
	}

	.card--featured .card__title {
		font-size: 1.12rem;
	}

	.card__excerpt {
		-webkit-line-clamp: 2;
	}

	.post-single,
	.comments {
		padding: 24px 20px;
	}

	.post-single__title {
		font-size: 1.45rem;
	}

	.backtop {
		right: 16px;
		bottom: 16px;
	}
}

/* ≤480：进一步紧凑 */
@media screen and (max-width: 480px) {
	body {
		font-size: 15px;
	}

	.topbar__logo {
		font-size: 1rem;
	}

	.topbar__btn {
		width: 34px;
		height: 34px;
	}

	.card__media {
		height: 160px;
	}

	.post-meta {
		gap: 4px 10px;
		font-size: 0.72rem;
	}

	.section-title {
		margin: 32px 0 4px;
	}
}
