/**
 * Override Blocksy's default 999px mobile/tablet breakpoint to 1024px.
 *
 * Blocksy hardcodes max-width:999.98px for tablet and min-width:1000px for desktop.
 * This override extends the tablet range to 1024px so the mobile header shows
 * on iPad and similar 1024px-wide devices.
 */

/* Hide desktop header at 1000-1024px (Blocksy normally shows it at 1000px+) */
@media (min-width: 1000px) and (max-width: 1024px) {
	header [data-device="desktop"] {
		display: none !important;
	}

	header [data-device="mobile"] {
		display: block !important;
	}
}

/* Override Blocksy's dynamic CSS tablet breakpoint: extend from 999.98px to 1024px */
@media (min-width: 1000px) and (max-width: 1024px) {
	/* Ensure mobile header rows render properly */
	.ct-header [data-device="mobile"] .ct-container {
		display: flex;
	}
}
