/*
Theme Name: Hello Elementor Child
Template: hello-elementor
Version: 1.0.0
Text Domain: hello-elementor-child
*/

/* ═══════════════════════════════════════════════════════
   STANDORT LANDING PAGES — Elementor Override
   ═══════════════════════════════════════════════════════ */

/* Hero section overlay */
.ki-hero-section > .elementor-background-overlay {
  background: linear-gradient(135deg, rgba(14,16,24,0.85), rgba(14,16,24,0.65)) !important;
}
.ki-hero-section .elementor-heading-title {
  font-size: clamp(2.5rem, 5vw + 1rem, 4.5rem) !important;
  line-height: 1.05 !important;
}
.ki-hero-section .elementor-widget-text-editor .ki-badge-hero {
  display: inline-block;
  background: rgba(163,230,53,0.12);
  border: 1px solid rgba(163,230,53,0.25);
  color: #A3E635;
  padding: 6px 16px;
  border-radius: 9999px;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-family: var(--ki-font-body);
  margin-bottom: 16px;
}

/* City section overlay */
.ki-city-section > .elementor-background-overlay {
  background: linear-gradient(180deg, rgba(14,16,24,0.9), rgba(14,16,24,0.75)) !important;
}

/* CTA section overlay with lime tint */
.ki-cta-section > .elementor-background-overlay {
  background: linear-gradient(135deg, rgba(14,16,24,0.88), rgba(163,230,53,0.05), rgba(14,16,24,0.85)) !important;
}

/* Feature cards in landing pages */
.ki-features-section .e-con-inner > .e-con {
  background: var(--ki-surface) !important;
  border: 1px solid var(--ki-border) !important;
  border-radius: var(--radius-lg) !important;
  padding: 32px !important;
  transition: all 0.3s var(--ease-smooth) !important;
}
.ki-features-section .e-con-inner > .e-con:hover {
  border-color: var(--ki-border-lime) !important;
  box-shadow: var(--shadow-lime) !important;
  transform: translateY(-4px);
}

/* Services section cards */
.ki-services-section .e-con-inner > .e-con {
  background: var(--ki-surface) !important;
  border: 1px solid var(--ki-border) !important;
  border-radius: var(--radius-lg) !important;
  padding: 32px !important;
  transition: all 0.3s var(--ease-smooth) !important;
}
.ki-services-section .e-con-inner > .e-con:hover {
  border-color: var(--ki-border-lime) !important;
  box-shadow: var(--shadow-2) !important;
}

/* FAQ section styling */
.ki-faq-section .ki-faq-item {
  background: var(--ki-surface);
  border: 1px solid var(--ki-border);
  border-radius: var(--radius-lg);
  padding: 24px 28px;
  margin-bottom: 12px;
  transition: all 0.3s var(--ease-smooth);
}
.ki-faq-section .ki-faq-item:hover {
  border-color: var(--ki-border-lime);
}
.ki-faq-section .ki-faq-q {
  color: var(--ki-text) !important;
  font-family: var(--ki-font-display) !important;
  font-weight: 700;
  font-size: 1.1rem;
  margin-bottom: 12px;
  cursor: pointer;
}
.ki-faq-section .ki-faq-a p {
  color: var(--ki-text-secondary) !important;
  line-height: 1.65;
}

/* Button overrides for Elementor */
.elementor-button-wrapper .elementor-button {
  background: var(--ki-lime) !important;
  color: var(--ki-dark) !important;
  font-weight: 700 !important;
  border-radius: 9999px !important;
  padding: 16px 32px !important;
  font-family: var(--ki-font-body) !important;
  transition: all 0.3s var(--ease-smooth) !important;
  box-shadow: var(--shadow-lime) !important;
}
.elementor-button-wrapper .elementor-button:hover {
  background: var(--ki-lime-hover) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(163,230,53,0.3) !important;
}

/* Image widgets in landing pages */
.ki-features-section .elementor-widget-image img,
.ki-city-section .elementor-widget-image img {
  border-radius: var(--radius-lg) !important;
  border: 1px solid var(--ki-border) !important;
}

/* ROI section — glassmorphism accent */
.ki-roi-section {
  position: relative;
}
.ki-roi-section::before {
  content: "";
  position: absolute;
  top: 0; left: 50%;
  transform: translateX(-50%);
  width: min(600px, 80%);
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--ki-lime), transparent);
  opacity: 0.3;
}

/* Lime highlight for span.lime in headings */
.elementor-heading-title span[style*="color"],
span.lime {
  color: var(--ki-lime) !important;
}
