/* CSS Variables */
:root {
  --background: 0 0% 100%;
  --foreground: 217 33% 17%;
  --card: 0 0% 100%;
  --card-foreground: 217 33% 17%;
  --primary: 217 91% 30%;
  --primary-foreground: 0 0% 100%;
  --secondary: 187 85% 43%;
  --secondary-foreground: 0 0% 100%;
  --muted: 214 32% 95%;
  --muted-foreground: 217 20% 51%;
  --accent: 12 88% 62%;
  --accent-foreground: 0 0% 100%;
  --border: 214 32% 91%;
  --radius: 0.75rem;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background-color: hsl(var(--background));
  color: hsl(var(--foreground));
  line-height: 1.6;
}

.container {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 1rem;
}

@media (min-width: 640px) {
  .container {
    padding: 0 1.5rem;
  }
}

/* Utility Classes */
.text-center {
  text-align: center;
}

.font-bold {
  font-weight: 700;
}

.font-semibold {
  font-weight: 600;
}

.mb-4 {
  margin-bottom: 1rem;
}

.mb-6 {
  margin-bottom: 1.5rem;
}

.mb-8 {
  margin-bottom: 2rem;
}

.mt-8 {
  margin-top: 2rem;
}

.space-y-2 > * + * {
  margin-top: 0.5rem;
}

.space-y-3 > * + * {
  margin-top: 0.75rem;
}

.space-y-4 > * + * {
  margin-top: 1rem;
}

/* Mobile Menu Toggle */
.mobile-menu-toggle {
  display: none;
}

@media (max-width: 767px) {
  .mobile-menu-toggle {
    display: block;
  }
  
  .desktop-nav {
    display: none;
  }
  
  .mobile-nav {
    display: none;
  }
  
  .mobile-nav.active {
    display: block;
  }
}

/* WhatsApp Floating Button Animation */
@keyframes floatMoving {
  0% {
    transform: translateY(0px);
  }
  100% {
    transform: translateY(-10px);
  }
}

@-webkit-keyframes floatMoving {
  0% {
    transform: translateY(0px);
  }
  100% {
    transform: translateY(-10px);
  }
}

.whatsapp-float {
  width: 80px;
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 999;
  -webkit-animation: floatMoving 3s infinite alternate;
  animation: floatMoving 3s infinite alternate;
  transition: transform 0.3s ease;
}

.whatsapp-float:hover {
  transform: translateY(-5px) scale(1.1);
}

.whatsapp-float img {
  width: 100%;
  height: auto;
  display: block;
}