@custom-variant dark (&:is(.dark *));

:root {
  --font-size: 16px;
  --background: #ffffff;
  --foreground: oklch(0.145 0 0);
  --card: #ffffff;
  --card-foreground: oklch(0.145 0 0);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.145 0 0);
  --primary: #030213;
  --primary-foreground: oklch(1 0 0);
  --secondary: oklch(0.95 0.0058 264.53);
  --secondary-foreground: #030213;
  --muted: #ececf0;
  --muted-foreground: #717182;
  --accent: #e9ebef;
  --accent-foreground: #030213;
  --destructive: #d4183d;
  --destructive-foreground: #ffffff;
  --border: rgba(0, 0, 0, 0.1);
  --input: transparent;
  --input-background: #f3f3f5;
  --switch-background: #cbced4;
  --font-weight-medium: 500;
  --font-weight-normal: 400;
  --ring: oklch(0.708 0 0);
  --chart-1: oklch(0.646 0.222 41.116);
  --chart-2: oklch(0.6 0.118 184.704);
  --chart-3: oklch(0.398 0.07 227.392);
  --chart-4: oklch(0.828 0.189 84.429);
  --chart-5: oklch(0.769 0.188 70.08);
  --radius: 0.625rem;
  --sidebar: oklch(0.985 0 0);
  --sidebar-foreground: oklch(0.145 0 0);
  --sidebar-primary: #030213;
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.97 0 0);
  --sidebar-accent-foreground: oklch(0.205 0 0);
  --sidebar-border: oklch(0.922 0 0);
  --sidebar-ring: oklch(0.708 0 0);
}

.dark {
  --background: oklch(0.145 0 0);
  --foreground: oklch(0.985 0 0);
  --card: oklch(0.145 0 0);
  --card-foreground: oklch(0.985 0 0);
  --popover: oklch(0.145 0 0);
  --popover-foreground: oklch(0.985 0 0);
  --primary: oklch(0.985 0 0);
  --primary-foreground: oklch(0.205 0 0);
  --secondary: oklch(0.269 0 0);
  --secondary-foreground: oklch(0.985 0 0);
  --muted: oklch(0.269 0 0);
  --muted-foreground: oklch(0.708 0 0);
  --accent: oklch(0.269 0 0);
  --accent-foreground: oklch(0.985 0 0);
  --destructive: oklch(0.396 0.141 25.723);
  --destructive-foreground: oklch(0.637 0.237 25.331);
  --border: oklch(0.269 0 0);
  --input: oklch(0.269 0 0);
  --ring: oklch(0.439 0 0);
  --font-weight-medium: 500;
  --font-weight-normal: 400;
  --chart-1: oklch(0.488 0.243 264.376);
  --chart-2: oklch(0.696 0.17 162.48);
  --chart-3: oklch(0.769 0.188 70.08);
  --chart-4: oklch(0.627 0.265 303.9);
  --chart-5: oklch(0.645 0.246 16.439);
  --sidebar: oklch(0.205 0 0);
  --sidebar-foreground: oklch(0.985 0 0);
  --sidebar-primary: oklch(0.488 0.243 264.376);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.269 0 0);
  --sidebar-accent-foreground: oklch(0.985 0 0);
  --sidebar-border: oklch(0.269 0 0);
  --sidebar-ring: oklch(0.439 0 0);
}

/* Tailwind CSS custom properties */
.border-border { border-color: var(--border); }
.bg-background { background-color: var(--background); }
.text-foreground { color: var(--foreground); }
.bg-card { background-color: var(--card); }
.text-card-foreground { color: var(--card-foreground); }
.bg-primary { background-color: var(--primary); }
.text-primary-foreground { color: var(--primary-foreground); }
.bg-secondary { background-color: var(--secondary); }
.text-secondary-foreground { color: var(--secondary-foreground); }
.text-muted-foreground { color: var(--muted-foreground); }
.bg-accent { background-color: var(--accent); }
.text-accent-foreground { color: var(--accent-foreground); }
.bg-destructive { background-color: var(--destructive); }
.text-destructive-foreground { color: var(--destructive-foreground); }
.outline-ring { outline-color: var(--ring); }

/* Custom styles for gradient backgrounds */
.bg-gradient-to-r {
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
}

.from-blue-50 {
  --tw-gradient-from: #eff6ff;
  --tw-gradient-to: rgb(239 246 255 / 0);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.to-green-50 {
  --tw-gradient-to: #f0fdf4;
}

/* Base typography */
body {
  background-color: var(--background);
  color: var(--foreground);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  line-height: 1.5;
}

h1 {
  font-size: 1.5rem;
  font-weight: var(--font-weight-medium);
  line-height: 1.5;
}

h2 {
  font-size: 1.25rem;
  font-weight: var(--font-weight-medium);
  line-height: 1.5;
}

h3 {
  font-size: 1.125rem;
  font-weight: var(--font-weight-medium);
  line-height: 1.5;
}

h4 {
  font-size: 1rem;
  font-weight: var(--font-weight-medium);
  line-height: 1.5;
}

p {
  font-size: 1rem;
  font-weight: var(--font-weight-normal);
  line-height: 1.5;
}

button {
  font-size: 1rem;
  font-weight: var(--font-weight-medium);
  line-height: 1.5;
}

html {
  font-size: var(--font-size);
}

/* Custom classes for our specific styling */
.text-6xl { font-size: 3.75rem; line-height: 1; }
.text-3xl { font-size: 1.875rem; line-height: 2.25rem; }
.text-2xl { font-size: 1.5rem; line-height: 2rem; }
.text-xl { font-size: 1.25rem; line-height: 1.75rem; }
.text-lg { font-size: 1.125rem; line-height: 1.75rem; }
.text-sm { font-size: 0.875rem; line-height: 1.25rem; }
.text-xs { font-size: 0.75rem; line-height: 1rem; }

.font-bold { font-weight: 700; }
.font-semibold { font-weight: 600; }
.font-medium { font-weight: 500; }

.tracking-tight { letter-spacing: -0.025em; }

/* Color utilities */
.text-green-600 { color: #16a34a; }
.text-gray-400 { color: #9ca3af; }
.text-gray-300 { color: #d1d5db; }

.bg-green-600 { background-color: #16a34a; }
.bg-green-700 { background-color: #15803d; }

.hover\:bg-green-700:hover { background-color: #15803d; }

.border-green-200 { border-color: #bbf7d0; }

/* Background color utilities */
.bg-blue-50 { background-color: #eff6ff; }
.bg-green-50 { background-color: #f0fdf4; }
.bg-yellow-50 { background-color: #fefce8; }
.bg-teal-50 { background-color: #f0fdfa; }
.bg-purple-50 { background-color: #faf5ff; }
.bg-slate-50 { background-color: #f8fafc; }
.bg-orange-50 { background-color: #fff7ed; }
.bg-emerald-50 { background-color: #ecfdf5; }
.bg-red-50 { background-color: #fef2f2; }
.bg-indigo-50 { background-color: #eef2ff; }

/* Border color utilities */
.border-blue-200 { border-color: #bfdbfe; }
.border-green-200 { border-color: #bbf7d0; }
.border-yellow-200 { border-color: #fef08a; }
.border-teal-200 { border-color: #99f6e4; }
.border-purple-200 { border-color: #e9d5ff; }
.border-slate-200 { border-color: #e2e8f0; }
.border-orange-200 { border-color: #fed7aa; }
.border-emerald-200 { border-color: #a7f3d0; }
.border-red-200 { border-color: #fecaca; }
.border-indigo-200 { border-color: #c7d2fe; }

/* Text color utilities */
.text-blue-700 { color: #1d4ed8; }
.text-green-700 { color: #15803d; }
.text-yellow-700 { color: #a16207; }
.text-teal-700 { color: #0f766e; }
.text-purple-700 { color: #7c3aed; }
.text-slate-700 { color: #334155; }
.text-orange-700 { color: #c2410c; }
.text-emerald-700 { color: #047857; }
.text-red-700 { color: #b91c1c; }
.text-indigo-700 { color: #4338ca; }

/* Additional utilities needed */
.border-dashed { border-style: dashed; }
.bg-black\/5 { background-color: rgb(0 0 0 / 0.05); }
.bg-white\/90 { background-color: rgb(255 255 255 / 0.9); }
.to-white\/90 { --tw-gradient-to: rgb(255 255 255 / 0.9); }

.size-4 { width: 1rem; height: 1rem; }
.size-5 { width: 1.25rem; height: 1.25rem; }
.size-6 { width: 1.5rem; height: 1.5rem; }

.shrink-0 { flex-shrink: 0; }

.italic { font-style: italic; }

.from-transparent { --tw-gradient-from: transparent; --tw-gradient-to: rgb(0 0 0 / 0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }

/* Contact button styles */
.border-blue-300 { border-color: #93c5fd; }
.text-blue-700 { color: #1d4ed8; }
.hover\:bg-blue-50:hover { background-color: #eff6ff; }