/* ==========================================================================
   18. Responsive
   ========================================================================== */

/* Tablet */
@media (max-width: 1024px) {
	.content-area.layout-sidebar {
		grid-template-columns: 1fr 260px;
	}
	.content-area.layout-sidebar.layout-sidebar--left {
		grid-template-columns: 260px 1fr;
	}
}

/* Small tablet */
@media (max-width: 768px) {
	.content-area.layout-sidebar {
		grid-template-columns: 1fr;
	}
	.content-area.layout-sidebar--left #secondary {
		order: 0;
	}

	.main-navigation { display: none; }
	.menu-toggle     { display: flex; }

	.footer-cols-2 .footer-widgets-inner,
	.footer-cols-3 .footer-widgets-inner,
	.footer-cols-4 .footer-widgets-inner {
		grid-template-columns: repeat(2, 1fr);
	}

	.footer-bottom-inner {
		flex-direction: column;
		text-align: center;
	}

	.post-navigation {
		grid-template-columns: 1fr;
	}
}

/* Mobile */
@media (max-width: 480px) {
	:root {
		--header-height: 60px;
	}

	.footer-cols-2 .footer-widgets-inner,
	.footer-cols-3 .footer-widgets-inner,
	.footer-cols-4 .footer-widgets-inner {
		grid-template-columns: 1fr;
	}

	.posts-grid { grid-template-columns: 1fr; }

	.search-form { flex-direction: column; }

	.comment-body { grid-template-columns: 1fr; }
}