@tailwind base;
@tailwind components;
@tailwind utilities;

:root { color-scheme: dark; }

html, body { height: 100%; }

body {
  @apply bg-brand-dark text-white font-body;
}

.container-px { @apply px-4 md:px-8 lg:px-12; }

.btn {
  @apply inline-flex items-center justify-center rounded-2xl px-5 py-3 text-sm font-semibold transition;
}
.btn-primary {
  @apply bg-brand.red text-white shadow-lg shadow-red-900/30 hover:translate-y-[-1px];
}
.btn-ghost {
  @apply border border-white/10 hover:bg-white/5 rounded-xl px-4 py-2;
}
.card {
  @apply rounded-2xl border border-white/10 bg-white/5 backdrop-blur-md;
}
divider {
  @apply border-t border-white/10;
}