/* Spacing Utilities */
.mt-small {
    margin-top: var(--space-sm);
}

.mt-medium {
    margin-top: var(--space-md);
}

.mt-large {
    margin-top: var(--space-lg);
}

.mt-xl {
    margin-top: var(--space-xl);
}

.mb-small {
    margin-bottom: var(--space-sm);
}

.mb-medium {
    margin-bottom: var(--space-md);
}

.mb-large {
    margin-bottom: var(--space-lg);
}

.mb-xl {
    margin-bottom: var(--space-xl);
}

.pt-large {
    padding-top: var(--space-xl);
}

.pb-medium {
    padding-bottom: var(--space-lg);
}

/* Typography Utilities */
.text-center {
    text-align: center;
}

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

.text-right {
    text-align: right;
}

.eyebrow {
    font-family: var(--font-primary);
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 700;
    font-size: 0.875rem;
    display: block;
    margin-bottom: var(--space-sm);
}

.display-text {
    font-size: var(--text-h1-mobile);
    line-height: 1.1;
    font-family: var(--font-heading);
    font-weight: 900;
    font-style: italic;
    margin-bottom: var(--space-md);
}

@media (min-width: 1024px) {
    .display-text {
        font-size: var(--text-h1-desktop);
    }
}

.lead {
    font-size: 1.25rem;
    line-height: 1.6;
    margin-bottom: var(--space-md);
    opacity: 0.9;
}

/* Grid Aliases (Fixing the mismatch) */
.grid-2-col {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-lg);
}

.grid-3-col {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-lg);
}

@media (min-width: 768px) {
    .grid-2-col {
        grid-template-columns: 1fr 1fr;
    }

    .grid-3-col {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Helper Classes */
.max-w-sm {
    max-width: 24rem;
}

.max-w-md {
    max-width: 48rem;
}

.mx-auto {
    margin-left: auto;
    margin-right: auto;
}

.full-width {
    width: 100%;
}

.clean-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* Color & text helpers */
.text-yellow {
    color: var(--color-yellow);
}

.text-teal {
    color: var(--color-teal);
}

.text-uppercase {
    text-transform: uppercase;
}

.tracking-wide {
    letter-spacing: 1.5px;
}

.text-sm {
    font-size: var(--text-sm);
}

.block {
    display: block;
}

.mb-xs {
    margin-bottom: var(--space-xs);
}

.align-center {
    align-items: center;
}