/* Waitz Energy - Custom Styles */
html {
  scroll-behavior: smooth;
}

/* Fade-in animation */
.fade-in {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}
.fade-in.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Stagger children */
.stagger-children .fade-in:nth-child(1) { transition-delay: 0.1s; }
.stagger-children .fade-in:nth-child(2) { transition-delay: 0.2s; }
.stagger-children .fade-in:nth-child(3) { transition-delay: 0.3s; }
.stagger-children .fade-in:nth-child(4) { transition-delay: 0.4s; }

/* Gradient overlays */
.hero-gradient {
  background: linear-gradient(135deg, #1B4332 0%, #2D6A4F 50%, #1B4332 100%);
}

.subtle-pattern {
  background-image: radial-gradient(circle at 1px 1px, rgba(212,168,67,0.07) 1px, transparent 0);
  background-size: 40px 40px;
}

/* Service card hover */
.service-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.service-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(27,67,50,0.12);
}

/* Sticky CTA sidebar */
.sticky-cta {
  position: sticky;
  top: 100px;
}

/* Mobile nav */
.mobile-nav {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}
.mobile-nav.open {
  max-height: 400px;
}

/* Blog article typography */
.article-content h2 {
  font-size: 1.5rem;
  font-weight: 700;
  color: #1B4332;
  margin-top: 2rem;
  margin-bottom: 1rem;
}
.article-content h3 {
  font-size: 1.25rem;
  font-weight: 600;
  color: #1a1a1a;
  margin-top: 1.5rem;
  margin-bottom: 0.75rem;
}
.article-content p {
  margin-bottom: 1rem;
  line-height: 1.8;
  color: #374151;
}
.article-content ul, .article-content ol {
  margin-bottom: 1rem;
  padding-left: 1.5rem;
}
.article-content li {
  margin-bottom: 0.5rem;
  line-height: 1.7;
  color: #374151;
}
.article-content ul li { list-style-type: disc; }
.article-content ol li { list-style-type: decimal; }
.article-content strong { color: #1a1a1a; }

/* Form styling */
.form-input {
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.form-input:focus {
  border-color: #1B4332;
  box-shadow: 0 0 0 3px rgba(27,67,50,0.1);
  outline: none;
}

/* Floating label effect on focus */
.btn-primary {
  background-color: #D4A843;
  color: #1a1a1a;
  transition: background-color 0.2s ease, transform 0.1s ease;
}
.btn-primary:hover {
  background-color: #c49a3a;
}
.btn-primary:active {
  transform: scale(0.98);
}

.btn-green {
  background-color: #1B4332;
  color: white;
  transition: background-color 0.2s ease, transform 0.1s ease;
}
.btn-green:hover {
  background-color: #2D6A4F;
}