/* ===== Tablet ≤1024px ===== */
@media (max-width:1024px){
	.layout{grid-template-columns:1fr}
	.content-area{order:1}
	.sidebar{order:2}
	.footer-grid{grid-template-columns:1fr 1fr}
	.hero h1{font-size:32px}
}

/* ===== Mobile ≤768px ===== */
@media (max-width:768px){
	.main-nav,.header-search{display:none}
	.nav-toggle{display:block}
	.header-inner{padding:10px 14px}
	.site-logo{font-size:22px}
	.hero{padding:38px 14px}
	.hero h1{font-size:26px}
	.hero p{font-size:15px}
	.post-grid{grid-template-columns:repeat(3,1fr);gap:10px}
	.card h3{font-size:13px}
	.footer-grid{grid-template-columns:1fr;gap:18px;text-align:center}
	.footer-social{justify-content:center}
	body{padding-bottom:62px} /* room for bottom nav */

	/* Drawer */
	.mobile-drawer{position:fixed;top:0;left:-280px;width:280px;height:100%;background:var(--dbm-nav);z-index:1100;transition:left .28s ease;overflow-y:auto;border-right:1px solid var(--dbm-border)}
	.mobile-drawer.open{left:0}
	.drawer-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:1050;opacity:0;visibility:hidden;transition:.28s}
	.drawer-overlay.open{opacity:1;visibility:visible}
	.mobile-drawer .drawer-head{padding:18px;border-bottom:1px solid var(--dbm-border);color:#fff;font-weight:800;font-size:20px}
	.mobile-drawer nav a{display:block;padding:14px 18px;color:var(--dbm-text);border-bottom:1px solid var(--dbm-border)}
	.mobile-drawer nav a:hover{background:var(--dbm-primary);color:#fff}

	/* Bottom nav */
	.bottom-nav{position:fixed;bottom:0;left:0;right:0;height:58px;background:var(--dbm-nav);border-top:1px solid var(--dbm-border);display:flex;z-index:1000}
	.bottom-nav a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:var(--dbm-muted);font-size:11px;font-weight:600}
	.bottom-nav a.active,.bottom-nav a:hover{color:var(--dbm-primary)}
	.bottom-nav .bn-icon{font-size:20px;line-height:1}
}

/* ===== Small ≤480px ===== */
@media (max-width:480px){
	.hero h1{font-size:22px}
	.post-grid{gap:8px}
	.dbm-social-share{gap:6px}
	.dbm-share{padding:6px 11px;font-size:12px}
}

/* ===== Mini ≤380px (iPhone SE) ===== */
@media (max-width:380px){
	.post-grid{grid-template-columns:repeat(2,1fr)}
	.site-logo{font-size:19px}
}

/* desktop hide mobile-only */
.mobile-drawer,.drawer-overlay,.bottom-nav{display:none}
@media (max-width:768px){
	.mobile-drawer,.drawer-overlay{display:block}
	.bottom-nav{display:flex}
}