/* ==========================================================================
   Utility Classes
   ========================================================================== */

/* Screen reader only */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

/* Text alignment */
.text-center { text-align: center; }
.text-left   { text-align: left; }
.text-right  { text-align: right; }

/* Text colors */
.text-gold   { color: var(--color-gold); }
.text-muted  { color: var(--color-text-muted); }
.text-white  { color: var(--color-white); }
.text-dark   { color: var(--color-gray-900); }

/* Font sizes */
.text-sm   { font-size: var(--text-sm); }
.text-lg   { font-size: var(--text-lg); }
.text-xl   { font-size: var(--text-xl); }

/* Font weights */
.font-medium   { font-weight: var(--weight-medium); }
.font-semibold { font-weight: var(--weight-semibold); }
.font-bold     { font-weight: var(--weight-bold); }

/* Margins */
.mb-0  { margin-bottom: 0; }
.mb-2  { margin-bottom: var(--space-2); }
.mb-4  { margin-bottom: var(--space-4); }
.mb-6  { margin-bottom: var(--space-6); }
.mb-8  { margin-bottom: var(--space-8); }
.mb-12 { margin-bottom: var(--space-12); }

.mt-0  { margin-top: 0; }
.mt-4  { margin-top: var(--space-4); }
.mt-8  { margin-top: var(--space-8); }

/* Visibility */
.hidden { display: none !important; }

.visible-mobile {
    display: block;
}

.visible-desktop {
    display: none;
}

@media (min-width: 1024px) {
    .visible-mobile  { display: none; }
    .visible-desktop { display: block; }
    .hidden-desktop  { display: none !important; }
}

/* Background */
.bg-gold { background-color: var(--color-gold-bg); }
.bg-dark { background-color: var(--color-bg-dark); }
.bg-alt  { background-color: var(--color-bg-alt); }

/* Max width */
.max-w-prose { max-width: 65ch; }

/* No print */
@media print {
    .no-print { display: none !important; }
}