:root {
  --background: 0 0% 100%;
  --foreground: 222.2 47.4% 11.2%;

  --muted-foreground: 215.4 16.3% 46.9%;
  --card: 0 0% 100%;

  --border: 214.3 31.8% 91.4%;
  --ring: 215 20.2% 65.1%;

  --primary: 25 60% 45%;
  --primary-foreground: 0 0% 100%;
  --soft-gray: 210 40% 98%;

  --shadow-soft: 0 8px 30px rgba(0, 0, 0, 0.06);
  --shadow-copper: 0 10px 30px rgba(196, 122, 56, 0.28);
  --shadow-elevated: 0 18px 60px rgba(0, 0, 0, 0.14);
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  color: hsl(var(--foreground));
  background: hsl(var(--background));
}

.font-display {
  font-family: Manrope, Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
}

/* Container (to match Tailwind container behavior) */
.container {
  width: 100%;
  max-width: 1120px;
  margin-left: auto;
  margin-right: auto;
}

/* Theme class mappings used in your markup */
.bg-background { background: hsl(var(--background)); }
.text-foreground { color: hsl(var(--foreground)); }
.bg-card { background: hsl(var(--card)); }
.text-muted-foreground { color: hsl(var(--muted-foreground)); }
.border-border { border-color: hsl(var(--border)); }

.bg-soft-gray { background: hsl(var(--soft-gray)); }
.text-primary { color: hsl(var(--primary)); }
.bg-primary { background: hsl(var(--primary)); }
.text-primary-foreground { color: hsl(var(--primary-foreground)); }

/* Shadows */
.shadow-soft { box-shadow: var(--shadow-soft); }
.shadow-copper { box-shadow: var(--shadow-copper); }
.hover\:shadow-elevated:hover { box-shadow: var(--shadow-elevated); }

/* Copper gradient utilities */
.bg-gradient-copper {
  background: linear-gradient(135deg, #b36a2e, #e0a06a);
}
.text-gradient-copper {
  background: linear-gradient(135deg, #b36a2e, #e0a06a);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Subtle hero background */
.bg-gradient-subtle {
  background:
    radial-gradient(800px 500px at 10% 0%, rgba(196, 122, 56, 0.10), transparent 60%),
    radial-gradient(900px 600px at 90% 30%, rgba(196, 122, 56, 0.07), transparent 55%),
    linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,0));
}

/* Animation: float */
@keyframes floaty {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}
.animate-float {
  animation: floaty 4s ease-in-out infinite;
}

/* Pulse (in case Tailwind CDN pulse differs) */
@keyframes pulseSoft {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.45; }
}
.animate-pulse {
  animation: pulseSoft 1.5s ease-in-out infinite;
}

/* Make border colors work on elements that rely on border utilities */
.border { border-width: 1px; border-style: solid; }