.hero-gradient { background: linear-gradient(135deg, var(--gradient-start) 0%, var(--gradient-end) 100%); }
.text-brand { color: var(--color-brand); }
.bg-brand { background-color: var(--color-brand); }
.hover\:bg-brand-dark:hover { background-color: var(--color-brand-dark); }
.hover\:text-brand:hover { color: var(--color-brand); }
.border-brand { border-color: var(--color-brand); }
.bg-brand-light { background-color: var(--color-brand-light); }
.text-brand-text { color: var(--color-brand-text); }
.hover\:bg-brand-50:hover { background-color: var(--color-brand-50); }
.border-l-brand { border-left-color: var(--color-brand); }
.focus\:border-brand:focus { border-color: var(--color-brand); }
.bg-brand-50 { background-color: var(--color-brand-50); }
.focus\:ring-brand:focus { --tw-ring-color: var(--color-brand); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), 0 0 0 3px var(--color-brand), var(--tw-shadow, 0 0 #0000); }
button { cursor: pointer; }
.loading {
  animation: pulse 2s infinite;
}
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}