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

:root {
  color-scheme: light;
}

body {
  @apply bg-steel-50 text-steel-900 antialiased;
}

.bg-grid-pattern {
  background-size: 28px 28px;
}

.section-shell {
  @apply mx-auto max-w-7xl px-4 sm:px-6 lg:px-8;
}

.card-hover {
  @apply transition duration-300 hover:-translate-y-1 hover:shadow-panel;
}

.focus-ring {
  @apply focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-500 focus-visible:ring-offset-2;
}