/* ==========================================================================
   Alternivite Design System — Responsive Utilities
   Breakpoint-prefixed display helpers
   ========================================================================== */

/* ==========================================================================
   HIDE AT BREAKPOINTS
   Usage: .show-below-sm = visible below 640px, hidden above
   ========================================================================== */

/* Hide below md (max-width: 767px) */
@media (max-width: 767px) {
   .hidden-below-md { display: none; }
}

/* Hide at sm only (max-width: 639px) */
@media (max-width: 639px) {
   .hidden-sm { display: none; }
}

/* Hide at md only (640px – 767px) */
@media (min-width: 640px) and (max-width: 767px) {
   .hidden-md { display: none; }
}

/* Hide above sm (min-width: 768px) */
@media (min-width: 768px) {
   .hidden-above-sm { display: none; }
}

/* Hide at lg (min-width: 1024px) */
@media (min-width: 1024px) {
   .hidden-lg { display: none; }
}

/* Show only at lg+ */
@media (max-width: 1023px) {
   .hidden-below-lg { display: none; }
}

/* ==========================================================================
   RESPONSIVE TEXT ALIGNMENT
   ========================================================================== */

@media (max-width: 767px) {
   .text-center-below-md { text-align: center; }
}

@media (min-width: 768px) {
   .text-left-above-sm { text-align: left; }
}