:root {
  --background: 228 24% 8%;
  --foreground: 220 20% 95%;
  --primary: 330 79% 69%;
  --secondary: 232 19% 16%;
  --muted: 229 16% 22%;
  --muted-foreground: 224 12% 70%;
  --destructive: 0 70% 58%;
  --border: 226 18% 24%;
  --card: 228 22% 12%;
  --shadow-sm: 0 8px 24px hsla(240, 30%, 2%, 0.18);
  --shadow-md: 0 18px 48px hsla(240, 30%, 2%, 0.28);
  --shadow-lg: 0 28px 90px hsla(240, 30%, 2%, 0.44);
  --transition-fast: 180ms ease;
  --transition-smooth: 360ms cubic-bezier(0.22, 1, 0.36, 1);
  --radius-sm: 12px;
  --radius-md: 20px;
  --radius-lg: 32px;
}

.dark {
  --background: 228 24% 8%;
  --foreground: 220 20% 95%;
  --primary: 330 79% 69%;
  --secondary: 232 19% 16%;
  --muted: 229 16% 22%;
  --muted-foreground: 224 12% 70%;
  --destructive: 0 70% 58%;
  --border: 226 18% 24%;
  --card: 228 22% 12%;
}

:root:not(.dark) {
  --background: 36 33% 97%;
  --foreground: 232 22% 12%;
  --primary: 329 73% 47%;
  --secondary: 36 25% 92%;
  --muted: 30 21% 88%;
  --muted-foreground: 232 10% 38%;
  --destructive: 0 62% 50%;
  --border: 28 18% 82%;
  --card: 0 0% 100%;
  --shadow-sm: 0 8px 24px hsla(230, 20%, 20%, 0.08);
  --shadow-md: 0 18px 48px hsla(230, 20%, 20%, 0.12);
  --shadow-lg: 0 28px 90px hsla(230, 20%, 20%, 0.18);
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-height: 100vh;
  background: hsl(var(--background));
  color: hsl(var(--foreground));
}

* {
  box-sizing: border-box;
}

::selection {
  color: hsl(var(--foreground));
}

.section-eyebrow {
  margin: 0 0 0.75rem 0;
  color: hsl(var(--primary));
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.26em;
  text-transform: uppercase;
}

.section-title {
  margin: 0;
  max-width: 14ch;
  font-size: clamp(2rem, 4vw, 3.25rem);
  line-height: 1.05;
  font-weight: 600;
}

input,
textarea,
button {
  font: inherit;
}

input,
textarea {
  color: hsl(var(--foreground));
}

input::placeholder,
textarea::placeholder {
  color: hsl(var(--muted-foreground));
}

@keyframes floatGlow {
  0%,
  100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-6px);
  }
}

.glow-float {
  animation: floatGlow 6s ease-in-out infinite;
}