/**
 * Elementor Compatibility Overrides
 *
 * Fixes spacing and styling conflicts when Elementor is active.
 */

/* Ensure Elementor sections go full width */
.elementor-section.elementor-section-boxed > .elementor-container {
  max-width: 1280px;
}

/* Reset Elementor's default paragraph spacing inside our components */
.elementor-widget-container .service-card p,
.elementor-widget-container .mine-card p,
.elementor-widget-container .team-member-info p,
.elementor-widget-container .why-card p,
.elementor-widget-container .benefit-card p {
  margin-bottom: 0;
}

/* Ensure our grid layouts work inside Elementor widget containers */
.elementor-widget-container .properties-grid,
.elementor-widget-container .mines-grid,
.elementor-widget-container .services-grid,
.elementor-widget-container .why-grid {
  width: 100%;
}

/* Fix hero slider height when inside Elementor */
.elementor-widget-container .hero-slider {
  position: relative;
  height: 100vh;
  width: 100%;
}

/* Prevent Elementor from adding extra padding to shortcode output */
.elementor-shortcode {
  width: 100%;
}

/* Ensure scroll animations still trigger inside Elementor */
.elementor-widget-container .scroll-animate {
  opacity: 0;
  transition: opacity 0.7s ease-out, transform 0.7s ease-out;
  will-change: opacity, transform;
}

.elementor-widget-container .scroll-animate.visible {
  opacity: 1;
  transform: translate(0);
}

/* Full width sections in Elementor - remove any default padding */
.elementor-section-full_width .elementor-container {
  max-width: 100%;
  padding: 0;
}

/* Fix button styling when Elementor resets it */
.elementor-widget-container .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-family: var(--font-sans);
  font-weight: 600;
  font-size: 0.875rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  padding: 0.75rem 2rem;
  border: none;
  border-radius: var(--radius);
  cursor: pointer;
  transition: all 0.3s ease;
  text-decoration: none;
  line-height: 1;
}

.elementor-widget-container .btn-primary {
  background: var(--primary);
  color: var(--white);
}

.elementor-widget-container .btn-primary:hover {
  background: var(--primary-light);
}