@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Open+Sans:wght@400;600;700&family=Fira+Code:wght@400&display=swap');
@import url('https://cdn.jsdelivr.net/npm/remixicon@4.0.0/fonts/remixicon.css');
@import "tailwindcss";

:root {
  --background: #ffffff;
  --foreground: #171717;

  /* Design System Colors - Somente Gradientes */
  --gradient: linear-gradient(90deg, #FF3A05, #FF0080);
  --gradient-text: linear-gradient(to right, #FF3A05, #FF0080);
  --gradient-hover: linear-gradient(135deg, #FF3A05, #FF0080);

  /* Text Colors */
  --text-primary: #171717;
  --text-secondary: #7D7D7D;
  --text-light: #A3A3A3;

  /* UI Colors */
  --border: #E5E5E5;
  --surface: #FAFAFA;

  /* Fonts */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', Arial, sans-serif;
  --font-heading: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'Fira Code', ui-monospace, SFMono-Regular, 'SF Mono', Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
}

body {
  background: var(--background);
  color: var(--foreground);
  font-family: var(--font-sans);
  scroll-behavior: smooth;
}

/* Gradient text utility */
.gradient-text {
  background: var(--gradient-text);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Gradient utilities */
.gradient-bg {
  background: var(--gradient);
}

.gradient-hover-bg {
  background: var(--gradient-hover);
}

/* Focus states */
*:focus-visible {
  outline: 2px solid #FF3A05;
  outline-offset: 2px;
}