/* ==========================================================================
   Quenavo — utilities.css
   Small single-purpose helper classes
   ========================================================================== */

.text-center { text-align: center; }
.text-left { text-align: left; }

.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: 0.5rem !important; }
.mt-2 { margin-top: 1rem !important; }
.mt-3 { margin-top: 1.5rem !important; }
.mt-4 { margin-top: 2.5rem !important; }
.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: 0.5rem !important; }
.mb-2 { margin-bottom: 1rem !important; }
.mb-3 { margin-bottom: 1.5rem !important; }
.mb-4 { margin-bottom: 2.5rem !important; }
.mx-auto { margin-inline: auto !important; }

.flex { display: flex; }
.flex-wrap { flex-wrap: wrap; }
.items-center { align-items: center; }
.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }
.gap-1 { gap: 0.5rem; }
.gap-2 { gap: 1rem; }
.gap-3 { gap: 1.5rem; }

.w-full { width: 100%; }
.max-w-md { max-width: 560px; }
.max-w-lg { max-width: 760px; }

.hidden { display: none !important; }

.muted { color: var(--ink-faint); }
.small { font-size: var(--fs-xs); }

.visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.divider {
  height: 1px;
  border: none;
  background: linear-gradient(90deg, transparent, rgba(37, 99, 235, 0.3), rgba(124, 58, 237, 0.3), transparent);
  margin-block: 2rem;
}

@media (max-width: 559px) {
  .sm-hidden { display: none !important; }
}