/**
 * Minimal Responsive Utilities
 * 
 * Only semantic layout patterns that combine multiple properties.
 * Use Tailwind's responsive variants (sm:, md:, lg:, xl:) for everything else.
 */

/* ===== BREAKPOINT VALUES (for JavaScript usage) ===== */
:root {
  --cp-breakpoint-sm: 640px;
  --cp-breakpoint-md: 768px;
  --cp-breakpoint-lg: 1024px;
  --cp-breakpoint-xl: 1280px;
  --cp-breakpoint-2xl: 1536px;
}