:root {
    --color-primary: #4F46E5;
    --color-secondary: #7C3AED;
}

.container {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 1rem;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 1.5rem;
    border-radius: 0.5rem;
    font-weight: 500;
    transition: all 0.2s;
}

.btn-primary {
    background-color: var(--color-primary);
    color: white;
}

.btn-primary:hover {
    background-color: #4338CA;
}

.btn-secondary {
    background-color: white;
    color: var(--color-primary);
    border: 1px solid #E5E7EB;
}

.btn-secondary:hover {
    border-color: var(--color-primary);
    background-color: #F9FAFB;
}

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

/* 优化文字渐变效果 */
.text-gradient {
    background: linear-gradient(to right, var(--color-primary), var(--color-secondary));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
}

/* Additional utility classes for gradients and transitions */
.bg-gradient-to-r {
    background: linear-gradient(to right, var(--color-primary), var(--color-secondary));
}

.from-primary\/10 {
    --tw-gradient-from: rgba(79, 70, 229, 0.1);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(79, 70, 229, 0));
}
