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

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

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

.text-primary {
    color: var(--c-primary-dark);
}

.text-accent {
    color: var(--c-accent-primary);
}

.text-white {
    color: var(--c-text-light);
}

.font-bold {
    font-weight: 700;
}

.font-medium {
    font-weight: 500;
}

.font-normal {
    font-weight: 400;
}

.mb-0 {
    margin-bottom: 0;
}

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

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

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

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

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

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

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

.mb-4xl {
    margin-bottom: calc(var(--space-3xl) * 1.5);
}

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

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

.gap-sm {
    gap: var(--space-sm);
}

.gap-md {
    gap: var(--space-md);
}

.w-full {
    width: 100%;
}

/* Animations */
.reveal,
.reveal-left,
.reveal-right {
    opacity: 0;
    transition: opacity 1s ease-out, transform 1s ease-out;
    will-change: opacity, transform;
}

.reveal {
    transform: translateY(30px);
}

.reveal-left {
    transform: translateX(-30px);
}

.reveal-right {
    transform: translateX(30px);
}

.reveal-visible {
    opacity: 1 !important;
    transform: translate(0, 0) !important;
}

/* Fallback for no-js or loading issues */
.no-js .reveal,
.no-js .reveal-left,
.no-js .reveal-right {
    opacity: 1;
    transform: none;
}

.text-gold {
    color: var(--c-accent-primary);
}

.p-xs {
    padding: var(--space-xs);
}

.p-sm {
    padding: var(--space-sm);
}

.p-md {
    padding: var(--space-md);
}

.p-lg {
    padding: var(--space-lg);
}

.p-xl {
    padding: var(--space-xl);
}

.p-2xl {
    padding: var(--space-2xl);
}

.p-3xl {
    padding: var(--space-3xl);
}

.p-4xl {
    padding: 120px;
}

.pt-xs { padding-top: var(--space-xs); }
.pt-sm { padding-top: var(--space-sm); }
.pt-md { padding-top: var(--space-md); }
.pt-lg { padding-top: var(--space-lg); }
.pt-xl { padding-top: var(--space-xl); }
.pt-2xl { padding-top: var(--space-2xl); }
.pt-3xl { padding-top: var(--space-3xl); }
.pt-4xl { padding-top: 120px; }