html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Onest', sans-serif;
}

.hero-bg {
  background-image: linear-gradient(rgba(21, 128, 60, 0.253), rgba(21, 128, 60, 0.671)), url('./assets/hero.png');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  transform: scaleX(-1);
}

.hero-bg > * {
  transform: scaleX(-1);
}

.mobile-menu {
  transform: translateX(100%);
  transition: transform 0.3s ease-in-out;
}

.mobile-menu.active {
  transform: translateX(0);
}

.hamburger {
  transition: transform 0.3s ease-in-out;
}

.hamburger.active {
  transform: rotate(90deg);
}

.card-hover {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.card-hover:hover {
  transform: translateY(-8px);
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.gradient-text {
  background: linear-gradient(135deg, #15803d, #16a34a);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.section-padding {
  padding: 5rem 0;
}

@media (max-width: 768px) {
  .section-padding {
    padding: 3rem 0;
  }
  
  /* Center align hero content on mobile */
  .hero-bg {
    text-align: center;
    background-position: 70% center;
    background-size: cover;
  }
  
  .hero-bg .ml-auto {
    margin-left: auto;
    margin-right: auto;
  }
  
  .hero-bg .justify-end {
    justify-content: center;
  }
}

/* Fallback for Font Awesome icons */
.fas, .fa {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900;
}

/* Professional fallback icons using CSS */
.fa-hammer::before { content: "🔨"; }
.fa-solar-panel::before { content: "☀"; }
.fa-thermometer-half::before { content: "🌡"; }
.fa-pipe::before { content: "🔧"; }
.fa-leaf::before { content: "♻"; }
.fa-hard-hat::before { content: "⛑"; }
.fa-handshake::before { content: "🤝"; }
.fa-map-marker-alt::before { content: "📍"; }
.fa-phone::before { content: "☎"; }
.fa-envelope::before { content: "✉"; }
.fa-clock::before { content: "🕐"; }
.fa-chevron-down::before { content: "▼"; }
.fa-times::before { content: "✕"; }
.fa-cogs::before { content: "⚙"; }
.fa-tools::before { content: "⚒"; }
.fa-fan::before { content: "◐"; }
.fa-arrow-right::before { content: "→"; }
