/* Custom Properties */
:root {
  --background: 205 52% 8%;
  --foreground: 0 0% 100%;
  
  --card: 206 48% 10%;
  --card-foreground: 0 0% 100%;
  --card-border: 0 0% 100% / 10%;
  
  --popover: 206 48% 10%;
  --popover-foreground: 0 0% 100%;
  
  --primary: 172 78% 40%;
  --primary-foreground: 204 66% 8%;
  --primary-border: 172 78% 50% / 50%;
  
  --secondary: 206 32% 14%;
  --secondary-foreground: 0 0% 100%;
  
  --muted: 206 26% 14%;
  --muted-foreground: 0 0% 100% / 72%;
  
  --accent: 172 78% 40% / 10%;
  --accent-foreground: 0 0% 100%;
  --accent-border: 172 78% 40% / 55%;
  
  --destructive: 0 70% 48%;
  --destructive-foreground: 0 0% 100%;
  
  --border: 0 0% 100% / 10%;
  --input: 0 0% 100% / 14%;
  --ring: 172 78% 40% / 55%;
  
  --shadow-soft: 0 20px 60px hsl(205 90% 5% / 0.55);
  --shadow-glow: 0 10px 40px hsl(172 78% 40% / 0.25);
  --glass-bg: 0 0% 100% / 6%;
  --glass-border: 0 0% 100% / 12%;
  
  --radius: 0.75rem;
}

/* Reset and Base Styles */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  color-scheme: dark;
  scroll-behavior: smooth;
}

body {
  font-family: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  line-height: 1.5;
  color: hsl(var(--foreground));
  background:
    radial-gradient(900px 650px at 18% 8%, hsl(172 78% 40% / 0.22), transparent 55%),
    radial-gradient(900px 650px at 78% 18%, hsl(200 88% 55% / 0.14), transparent 60%),
    radial-gradient(900px 650px at 70% 75%, hsl(30 90% 55% / 0.12), transparent 62%),
    linear-gradient(180deg, hsl(205 52% 8%), hsl(205 45% 11%) 50%, hsl(205 52% 8%));
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

::selection {
  background: hsl(172 78% 40% / 0.25);
}

.font-serif {
  font-family: "Fraunces", ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
}

/* Custom Utility Classes */
.if-glass {
  background: hsl(var(--glass-bg));
  border: 1px solid hsl(var(--glass-border));
  box-shadow: var(--shadow-soft);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.if-glass-soft {
  background: hsl(0 0% 100% / 0.04);
  border: 1px solid hsl(0 0% 100% / 0.10);
  box-shadow: 0 14px 50px hsl(205 90% 5% / 0.4);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.if-ring {
  box-shadow:
    0 0 0 1px hsl(0 0% 100% / 0.12) inset,
    0 0 0 1px hsl(172 78% 40% / 0.15),
    var(--shadow-glow);
}

.if-gradient-text {
  background-image: linear-gradient(135deg, #14B8A6 0%, #2DD4BF 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.if-noise::before {
  content: "";
  pointer-events: none;
  position: absolute;
  inset: 0;
  border-radius: inherit;
  opacity: 0.08;
  mix-blend-mode: overlay;
  background-image:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.06) 0, rgba(255, 255, 255, 0.06) 1px, transparent 1px, transparent 3px),
    repeating-linear-gradient(90deg, rgba(0, 0, 0, 0.06) 0, rgba(0, 0, 0, 0.06) 1px, transparent 1px, transparent 4px);
}

.if-container {
  margin: 0 auto;
  width: 100%;
  max-width: 980px;
  padding: 0 1.25rem;
}

/* Navigation Utilities */
.backdrop-blur-xl {
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
}

/* Size utilities */
.size-9 {
  width: 2.25rem;
  height: 2.25rem;
}

.size-10 {
  width: 2.5rem;
  height: 2.5rem;
}

.size-5 {
  width: 1.25rem;
  height: 1.25rem;
}

.size-4 {
  width: 1rem;
  height: 1rem;
}

.size-1\.5 {
  width: 0.375rem;
  height: 0.375rem;
}

/* Responsive utilities */
@media (min-width: 640px) {
  .sm\:text-6xl {
    font-size: 3.75rem;
    line-height: 1;
  }
  
  .sm\:w-\[280px\] {
    width: 280px;
  }
  
  .sm\:flex-row {
    flex-direction: row;
  }
  
  .sm\:items-center {
    align-items: center;
  }
  
  .sm\:justify-between {
    justify-content: space-between;
  }
}

@media (min-width: 768px) {
  .md\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  
  .md\:grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  
  .md\:col-span-2 {
    grid-column: span 2 / span 2;
  }
  
  .md\:col-span-3 {
    grid-column: span 3 / span 3;
  }
}

@media (min-width: 1024px) {
  .lg\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Tailwind-style utilities (minimal set) */
.min-h-screen { min-height: 100vh; }
.sticky { position: sticky; }
.top-0 { top: 0; }
.z-50 { z-index: 50; }
.relative { position: relative; }
.absolute { position: absolute; }
.inset-0 { inset: 0; }
.pointer-events-none { pointer-events: none; }
.px-5 { padding-left: 1.25rem; padding-right: 1.25rem; }
.py-4 { padding-top: 1rem; padding-bottom: 1rem; }
.py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
.py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
.p-3 { padding: 0.75rem; }
.p-4 { padding: 1rem; }
.p-6 { padding: 1.5rem; }
.mx-auto { margin-left: auto; margin-right: auto; }
.mt-1 { margin-top: 0.25rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-3 { margin-top: 0.75rem; }
.mt-4 { margin-top: 1rem; }
.mt-5 { margin-top: 1.25rem; }
.mt-6 { margin-top: 1.5rem; }
.mt-7 { margin-top: 1.75rem; }
.mt-8 { margin-top: 2rem; }
.mt-10 { margin-top: 2.5rem; }
.mt-12 { margin-top: 3rem; }
.mt-0\.5 { margin-top: 0.125rem; }
.-mt-10 { margin-top: -2.5rem; }
.pb-2 { padding-bottom: 0.5rem; }
.pb-10 { padding-bottom: 2.5rem; }
.pb-12 { padding-bottom: 3rem; }
.pb-14 { padding-bottom: 3.5rem; }
.pt-10 { padding-top: 2.5rem; }
.flex { display: flex; }
.inline-flex { display: inline-flex; }
.grid { display: grid; }
.block { display: block; }
.inline { display: inline; }
.w-full { width: 100%; }
.h-11 { height: 2.75rem; }
.max-w-\[1120px\] { max-width: 1120px; }
.max-w-\[22ch\] { max-width: 22ch; }
.max-w-\[20ch\] { max-width: 20ch; }
.max-w-\[16ch\] { max-width: 16ch; }
.max-w-\[66ch\] { max-width: 66ch; }
.items-center { align-items: center; }
.items-start { align-items: flex-start; }
.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }
.gap-1 { gap: 0.25rem; }
.gap-2 { gap: 0.5rem; }
.gap-3 { gap: 0.75rem; }
.gap-4 { gap: 1rem; }
.gap-6 { gap: 1.5rem; }
.gap-8 { gap: 2rem; }
.gap-10 { gap: 2.5rem; }
.gap-1\.5 { gap: 0.375rem; }
.flex-col { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.overflow-hidden { overflow: hidden; }
.rounded-2xl { border-radius: 1rem; }
.rounded-full { border-radius: 9999px; }
.rounded-xl { border-radius: 0.75rem; }
.rounded-\[26px\] { border-radius: 26px; }
.rounded-\[28px\] { border-radius: 28px; }
.rounded-\[34px\] { border-radius: 34px; }
.rounded-\[36px\] { border-radius: 36px; }
.border { border-width: 1px; }
.border-white\/10 { border-color: rgb(255 255 255 / 0.1); }
.bg-white\/3 { background-color: rgb(255 255 255 / 0.03); }
.bg-white\/5 { background-color: rgb(255 255 255 / 0.05); }
.bg-white\/6 { background-color: rgb(255 255 255 / 0.06); }
.bg-white\/8 { background-color: rgb(255 255 255 / 0.08); }
.bg-white\/4 { background-color: rgb(255 255 255 / 0.04); }
.bg-emerald-400\/14 { background-color: rgb(52 211 153 / 0.14); }
.bg-emerald-400\/10 { background-color: rgb(52 211 153 / 0.10); }
.bg-emerald-400\/8 { background-color: rgb(52 211 153 / 0.08); }
.bg-emerald-300\/12 { background-color: rgb(110 231 183 / 0.12); }
.bg-cyan-400\/10 { background-color: rgb(34 211 238 / 0.10); }
.bg-black\/45 { background-color: rgb(0 0 0 / 0.45); }
.bg-transparent { background-color: transparent; }
.bg-gradient-to-br { background-image: linear-gradient(to bottom right, var(--tw-gradient-stops)); }
.bg-gradient-to-b { background-image: linear-gradient(to bottom, var(--tw-gradient-stops)); }
.from-emerald-400\/90 { --tw-gradient-from: rgb(52 211 153 / 0.9); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(52 211 153 / 0)); }
.to-teal-300\/90 { --tw-gradient-to: rgb(94 234 212 / 0.9); }
.from-emerald-400\/10 { --tw-gradient-from: rgb(52 211 153 / 0.1); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(52 211 153 / 0)); }
.via-white\/0 { --tw-gradient-via: rgb(255 255 255 / 0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-via), var(--tw-gradient-to, rgb(255 255 255 / 0)); }
.to-cyan-400\/10 { --tw-gradient-to: rgb(34 211 238 / 0.1); }
.from-black\/30 { --tw-gradient-from: rgb(0 0 0 / 0.3); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(0 0 0 / 0)); }
.via-black\/0 { --tw-gradient-via: rgb(0 0 0 / 0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-via), var(--tw-gradient-to, rgb(0 0 0 / 0)); }
.to-transparent { --tw-gradient-to: transparent; }
.from-transparent { --tw-gradient-from: transparent; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, transparent); }
.via-\[hsl\(205_52\%_8\%_\/0\.35\)\] { --tw-gradient-via: hsl(205 52% 8% / 0.35); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-via), var(--tw-gradient-to, transparent); }
.to-\[hsl\(205_52\%_8\%_\/0\.0\)\] { --tw-gradient-to: hsl(205 52% 8% / 0.0); }
.via-\[hsl\(205_52\%_8\%_\/0\.25\)\] { --tw-gradient-via: hsl(205 52% 8% / 0.25); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-via), var(--tw-gradient-to, transparent); }
.text-white { color: rgb(255 255 255); }
.text-white\/75 { color: rgb(255 255 255 / 0.75); }
.text-white\/70 { color: rgb(255 255 255 / 0.70); }
.text-white\/72 { color: rgb(255 255 255 / 0.72); }
.text-white\/80 { color: rgb(255 255 255 / 0.80); }
.text-white\/60 { color: rgb(255 255 255 / 0.60); }
.text-white\/45 { color: rgb(255 255 255 / 0.45); }
.text-white\/40 { color: rgb(255 255 255 / 0.40); }
.text-emerald-200 { color: rgb(167 243 208); }
.text-emerald-100 { color: rgb(209 250 229); }
.text-emerald-50\/80 { color: rgb(236 253 245 / 0.80); }
.text-slate-950 { color: rgb(2 6 23); }
.text-lg { font-size: 1.125rem; line-height: 1.75rem; }
.text-xs { font-size: 0.75rem; line-height: 1rem; }
.text-sm { font-size: 0.875rem; line-height: 1.25rem; }
.text-4xl { font-size: 2.25rem; line-height: 2.5rem; }
.text-xl { font-size: 1.25rem; line-height: 1.75rem; }
.text-\[15px\] { font-size: 15px; }
.font-semibold { font-weight: 600; }
.font-bold { font-weight: 700; }
.leading-tight { line-height: 1.25; }
.leading-7 { line-height: 1.75rem; }
.leading-\[1\.03\] { line-height: 1.03; }
.tracking-tight { letter-spacing: -0.025em; }
.ring-1 { box-shadow: 0 0 0 1px var(--tw-ring-color); }
.ring-white\/10 { --tw-ring-color: rgb(255 255 255 / 0.1); }
.ring-white\/8 { --tw-ring-color: rgb(255 255 255 / 0.08); }
.ring-emerald-300\/20 { --tw-ring-color: rgb(110 231 183 / 0.20); }
.shadow-\[0_10px_30px_rgba\(20\,184\,166\,0\.30\)\] { box-shadow: 0 10px 30px rgba(20,184,166,0.30); }
.shadow-\[0_14px_38px_rgba\(20\,184\,166\,0\.38\)\] { box-shadow: 0 14px 38px rgba(20,184,166,0.38); }
.shadow-\[0_10px_30px_rgba\(20\,184\,166\,0\.28\)\] { box-shadow: 0 10px 30px rgba(20,184,166,0.28); }
.shadow-\[0_14px_38px_rgba\(20\,184\,166\,0\.36\)\] { box-shadow: 0 14px 38px rgba(20,184,166,0.36); }
.backdrop-blur { backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.transition { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
.transition-colors { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
.duration-300 { transition-duration: 300ms; }
.hover\:bg-white\/6:hover { background-color: rgb(255 255 255 / 0.06); }
.hover\:bg-white\/5:hover { background-color: rgb(255 255 255 / 0.05); }
.hover\:bg-white\/8:hover { background-color: rgb(255 255 255 / 0.08); }
.hover\:text-white:hover { color: rgb(255 255 255); }
.hover\:text-emerald-100:hover { color: rgb(209 250 229); }
.hover\:translate-y-\[-1px\]:hover { transform: translateY(-1px); }
.group:hover .group-hover\:translate-x-0\.5 { transform: translateX(0.125rem); }
.underline { text-decoration-line: underline; }
.decoration-white\/20 { text-decoration-color: rgb(255 255 255 / 0.20); }
.decoration-emerald-200\/30 { text-decoration-color: rgb(167 243 208 / 0.30); }
.decoration-emerald-200\/25 { text-decoration-color: rgb(167 243 208 / 0.25); }
.decoration-emerald-100\/50 { text-decoration-color: rgb(209 250 229 / 0.50); }
.decoration-emerald-100\/40 { text-decoration-color: rgb(209 250 229 / 0.40); }
.underline-offset-4 { text-underline-offset: 4px; }
.space-y-3 > :not([hidden]) ~ :not([hidden]) { margin-top: 0.75rem; }
.w-\[260px\] { width: 260px; }
.-inset-x-20 { left: -5rem; right: -5rem; }
.-top-28 { top: -7rem; }
.h-\[520px\] { height: 520px; }
.rounded-\[999px\] { border-radius: 999px; }
.blur-3xl { filter: blur(64px); }
.blur-2xl { filter: blur(40px); }
.-bottom-64 { bottom: -16rem; }
.-right-56 { right: -14rem; }
.-inset-x-64 { left: -16rem; right: -16rem; }
.-inset-6 { top: -1.5rem; right: -1.5rem; bottom: -1.5rem; left: -1.5rem; }
.inset-x-0 { left: 0; right: 0; }
.-top-1 { top: -0.25rem; }
.h-28 { height: 7rem; }
.bottom-0 { bottom: 0; }
.h-56 { height: 14rem; }
.h-24 { height: 6rem; }
.place-items-center { place-items: center; }
.bg-\[linear-gradient\(180deg\,hsl\(205_52\%_8\%_\/0\)_0\%\,hsl\(205_52\%_8\%_\/0\.0\)_35\%\,hsl\(205_52\%_8\%_\/0\.25\)_70\%\,hsl\(205_52\%_8\%_\/0\.65\)_100\%\)\] { background: linear-gradient(180deg,hsl(205 52% 8% / 0) 0%,hsl(205 52% 8% / 0.0) 35%,hsl(205 52% 8% / 0.25) 70%,hsl(205 52% 8% / 0.65) 100%); }
.bg-from-\[hsl\(205_52\%_8\%_\/0\.0\)\] { background: linear-gradient(to bottom, hsl(205 52% 8% / 0.0), var(--tw-gradient-via), var(--tw-gradient-to)); }
.w-\[280px\] { width: 280px; }

/* Form inputs */
input, textarea {
  font-family: inherit;
}

input:focus, textarea:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgb(52 211 153 / 0.5);
}

button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}