@layer base {
  :root {
    --primary: #2d5d4f;
    --on-primary: #ffffff;
    --primary-container: #467667;
    --on-primary-container: #c7fbe8;
    --background: #f9faf7;
    --background-light: #EEEEEE;
    --text-heading: #185441;
    --text-body: #3A4D48;
    --accent-green: #467667;
    --surface: #f9faf7;
    --surface-container: #edeeec;
    --outline: #707975;
    --outline-variant: #c0c8c4;
    --inverse-surface: #2e312f;
  }
}

.poly-sans-feel {
  font-family: 'Hanken Grotesk', sans-serif;
  letter-spacing: -0.02em;
}

.glass-card {
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(24, 84, 65, 0.1);
}

.no-scrollbar::-webkit-scrollbar {
  display: none;
}

.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Custom Animations */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

.reveal {
  opacity: 0;
  transition: all 0.8s ease-out;
}

.reveal.active {
  opacity: 1;
  transform: translateY(0);
}

.reveal-up {
  transform: translateY(40px);
}

.reveal-left {
  transform: translateX(-40px);
}

.reveal-right {
  transform: translateX(40px);
}

.reveal-scale {
  transform: scale(0.95);
}

/* Magnetic Button Feel */
.magnetic-btn {
  transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);
}

.magnetic-btn:hover {
  transform: scale(1.05) translateY(-2px);
}

/* Gradient Text */
.text-gradient {
  background: linear-gradient(135deg, var(--text-heading), var(--primary));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}