/**
 * Responsive Styles for Volt Core
 * Mobile-first responsive design with breakpoints
 */

/* Responsive Breakpoints */
/* Mobile: 0-767px (default) */
/* Tablet: 768px-1023px */
/* Desktop: 1024px+ */

/* Base mobile styles are in theme.json and other CSS files */

/* Tablet and up */
@media (min-width: 768px) {
	/* Adjust content width for tablet */
	.wp-block-group[class*="layout-constrained"] {
		max-width: clamp(32rem, 80vw, 840px);
	}
	
	/* Improve spacing on larger screens */
	.wp-block-group {
		padding-left: clamp(1rem, 4vw, 2rem);
		padding-right: clamp(1rem, 4vw, 2rem);
	}
}

/* Desktop and up */
@media (min-width: 1024px) {
	/* Full content width */
	.wp-block-group[class*="layout-constrained"] {
		max-width: 840px;
	}
	
	/* Wide content width */
	.wp-block-group[class*="alignwide"],
	.wp-block-group.alignwide {
		max-width: 1100px;
	}
	
	/* Full width */
	.wp-block-group[class*="alignfull"],
	.wp-block-group.alignfull {
		max-width: 100%;
	}
}

/* Large desktop */
@media (min-width: 1440px) {
	.wp-block-group[class*="layout-constrained"] {
		max-width: 840px;
	}
	
	.wp-block-group[class*="alignwide"],
	.wp-block-group.alignwide {
		max-width: 1100px;
	}
}

/* Responsive typography adjustments */
@media (max-width: 767px) {
	/* Slightly smaller base font on mobile */
	body {
		font-size: clamp(0.875rem, 2.5vw, 1rem);
	}
	
	/* Adjust heading sizes for mobile */
	h1 {
		font-size: clamp(1.75rem, 8vw, 2.25rem);
	}
	
	h2 {
		font-size: clamp(1.5rem, 7vw, 2rem);
	}
	
	h3 {
		font-size: clamp(1.25rem, 6vw, 1.75rem);
	}
	
	h4 {
		font-size: clamp(1.125rem, 5vw, 1.5rem);
	}
	
	h5 {
		font-size: clamp(1rem, 4vw, 1.25rem);
	}
	
	h6 {
		font-size: clamp(0.875rem, 3vw, 1rem);
	}
}

/* Responsive navigation */
@media (max-width: 767px) {
	/* Stack navigation items on mobile */
	.wp-block-navigation__responsive-container {
		width: 100%;
	}
	
	/* Full width buttons on mobile */
	.wp-block-button {
		width: 100%;
	}
	
	.wp-block-button__link {
		width: 100%;
		text-align: center;
	}
}

/* Responsive images */
img {
	max-width: 100%;
	height: auto;
}

/* Responsive columns */
@media (max-width: 767px) {
	/* Stack columns on mobile */
	.wp-block-columns {
		flex-direction: column;
	}
	
	.wp-block-column {
		margin-bottom: 1rem;
	}
}

/* Responsive spacing utilities */
@media (max-width: 767px) {
	/* Reduce large spacing on mobile */
	.has-large-gap {
		gap: 1.5rem;
	}
	
	.has-huge-gap {
		gap: 2rem;
	}
}

/* Print styles */
@media print {
	/* Hide navigation and non-essential elements */
	.wp-block-navigation,
	.wp-block-template-part[data-area="footer"] {
		display: none;
	}
	
	/* Ensure good print layout */
	.wp-block-group {
		page-break-inside: avoid;
	}
}