@import "tailwindcss";

@theme {
  --color-base-obsidian: #001f22;
  --color-surface-glass: rgba(0, 31, 34, 0.8);
  --color-neon-coral: #d36a2b; /* Terracotta Orange */
  --color-sunset-amber: #f9af80; /* Light Peach */
  --color-accent-cyan: #5cc0c1; /* Aqua Cyan */
  --color-deep-teal: #00808a; /* Deep Teal */
  --color-text-bright: #ffffff;
  --color-text-muted: #f9af80;

  --font-outfit: "Outfit", sans-serif;
  --font-inter: "Inter", sans-serif;
}

body {
  background-color: var(--color-base-obsidian);
  color: var(--color-text-bright);
  font-family: var(--font-inter);
  overflow-x: hidden;
}

h1, h2, h3, h4, .font-heading {
  font-family: var(--font-outfit);
}

.glass-panel {
  background: var(--color-surface-glass);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 24px 64px -12px rgba(0, 0, 0, 0.5);
  border-radius: 24px;
}

/* Glowing background textures */
.orb-1 {
  background: radial-gradient(circle, var(--color-neon-coral) 0%, transparent 60%);
  opacity: 0.15;
  filter: blur(60px);
}
.orb-2 {
  background: radial-gradient(circle, var(--color-sunset-amber) 0%, transparent 60%);
  opacity: 0.15;
  filter: blur(60px);
}

/* Custom Utilities */
.text-gradient {
  background-image: linear-gradient(135deg, #fff 0%, #d36a2b 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}