.elementor-kit-5{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-5 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* ============================================================
   VIDIT MARKETING AGENCY — Elementor Custom CSS
   
   HOW TO ADD THIS CSS:
   WordPress Admin → Appearance → Customize → Additional CSS
   Paste everything below → click "Publish"
   
   NOTE: The JSON template already sets all section backgrounds
   and text colors directly. This CSS handles fonts, hover 
   effects, animations, spacing, and responsive layout.
   ============================================================ */

/* ── GOOGLE FONTS ── */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Poppins:wght@400;500;600;700;800&display=swap');

/* ============================================================
   GLOBAL
   ============================================================ */
html { scroll-behavior: smooth; }

body, .elementor-page {
  font-family: 'Inter', sans-serif !important;
}

h1, h2, h3, h4, h5, h6,
.elementor-heading-title {
  font-family: 'Poppins', sans-serif !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

/* ============================================================
   HERO SECTION  (.vma-hero)
   ============================================================ */
.vma-hero {
  background-color: #0A1628 !important;
  background-image: radial-gradient(ellipse at 70% 50%, #1a2f5a 0%, #0A1628 60%) !important;
}
.vma-hero .elementor-heading-title {
  color: #ffffff !important;
  font-size: clamp(32px, 4.5vw, 56px) !important;
  line-height: 1.12 !important;
}
.vma-hero .elementor-widget-text-editor p {
  color: #94a3b8 !important;
  font-size: 18px !important;
  line-height: 1.75 !important;
}
.vma-hero .elementor-button {
  background-color: #FF6B00 !important;
  color: #ffffff !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 15px rgba(255,107,0,0.35) !important;
  transition: all 0.3s !important;
}
.vma-hero .elementor-button:hover {
  background-color: #e05e00 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 25px rgba(255,107,0,0.45) !important;
}

/* ============================================================
   ABOUT SECTION  (.vma-about)
   ============================================================ */
.vma-about {
  background-color: #ffffff !important;
}
.vma-about .elementor-heading-title {
  color: #0A1628 !important;
  font-size: clamp(26px, 3vw, 40px) !important;
}
.vma-about .elementor-widget-text-editor p {
  color: #64748b !important;
  font-size: 17px !important;
  line-height: 1.8 !important;
}
.vma-about .elementor-button {
  background-color: #FF6B00 !important;
  color: #ffffff !important;
  border-radius: 8px !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 600 !important;
  box-shadow: 0 4px 15px rgba(255,107,0,0.3) !important;
  transition: all 0.3s !important;
}
.vma-about .elementor-button:hover {
  background-color: #e05e00 !important;
  transform: translateY(-2px) !important;
}

/* ============================================================
   SERVICES SECTION  (.vma-services)
   ============================================================ */
.vma-services,
.vma-services-header,
.vma-services-row {
  background-color: #F1F5F9 !important;
}
.vma-services-header .elementor-heading-title {
  color: #0A1628 !important;
  font-size: clamp(26px, 3vw, 42px) !important;
  text-align: center !important;
}
.vma-services-header .elementor-widget-text-editor p {
  color: #64748b !important;
  text-align: center !important;
  font-size: 18px !important;
}
/* Service icon-box cards */
.vma-services-row .elementor-icon-box-wrapper {
  background-color: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  padding: 32px 24px !important;
  height: 100% !important;
  position: relative !important;
  overflow: hidden !important;
  transition: all 0.35s ease !important;
}
.vma-services-row .elementor-icon-box-wrapper::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important;
  width: 4px !important; height: 0 !important;
  background: #FF6B00 !important;
  transition: height 0.35s !important;
}
.vma-services-row .elementor-icon-box-wrapper:hover::before { height: 100% !important; }
.vma-services-row .elementor-icon-box-wrapper:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 20px 40px rgba(10,22,40,0.12) !important;
  border-color: #FF6B00 !important;
}
.vma-services-row .elementor-icon i,
.vma-services-row .elementor-icon svg {
  color: #FF6B00 !important;
  fill: #FF6B00 !important;
  font-size: 36px !important;
  transition: all 0.3s !important;
}
.vma-services-row .elementor-icon-box-wrapper:hover .elementor-icon {
  background-color: #FF6B00 !important;
  border-radius: 10px !important;
}
.vma-services-row .elementor-icon-box-wrapper:hover .elementor-icon i { color: #ffffff !important; }
.vma-services-row .elementor-icon-box-title,
.vma-services-row .elementor-icon-box-title a {
  color: #0A1628 !important;
  font-family: 'Poppins', sans-serif !important;
  font-size: 17px !important;
  font-weight: 700 !important;
}
.vma-services-row .elementor-icon-box-description {
  color: #64748b !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
}

/* ============================================================
   WHY CHOOSE US  (.vma-why-us)  ← CRITICAL FIX
   ============================================================ */
.vma-why-us {
  background-color: #0A1628 !important;
  background-image: none !important;
}
.vma-why-us .elementor-heading-title {
  color: #ffffff !important;
  font-size: clamp(24px, 3vw, 38px) !important;
}
.vma-why-us .elementor-widget-text-editor p {
  color: #94a3b8 !important;
  font-size: 17px !important;
  line-height: 1.8 !important;
}
.vma-why-us .elementor-divider-separator {
  border-color: #FF6B00 !important;
}
.vma-why-us .elementor-button {
  background-color: #FF6B00 !important;
  color: #ffffff !important;
  border-radius: 8px !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 600 !important;
  transition: all 0.3s !important;
}
.vma-why-us .elementor-button:hover {
  background-color: #e05e00 !important;
  transform: translateY(-2px) !important;
}

/* ============================================================
   PROCESS SECTION  (.vma-process)
   ============================================================ */
.vma-process {
  background-color: #ffffff !important;
}
.vma-process .elementor-heading-title {
  color: #0A1628 !important;
  font-size: clamp(26px, 3vw, 42px) !important;
  text-align: center !important;
}
.vma-process .elementor-widget-text-editor p {
  color: #64748b !important;
  line-height: 1.7 !important;
}

/* ============================================================
   RESULTS SECTION  (.vma-results)
   ============================================================ */
.vma-results {
  background-color: #FF6B00 !important;
  background-image: linear-gradient(135deg, #FF6B00 0%, #e05e00 100%) !important;
}
.vma-results .elementor-counter-number-wrapper {
  font-family: 'Poppins', sans-serif !important;
  font-size: clamp(40px, 5vw, 64px) !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  line-height: 1 !important;
}
.vma-results .elementor-counter-title {
  color: rgba(255,255,255,0.9) !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  margin-top: 8px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

/* ============================================================
   TESTIMONIALS  (.vma-testimonials)
   ============================================================ */
.vma-testimonials {
  background-color: #F1F5F9 !important;
}
.vma-testimonials .elementor-heading-title {
  color: #0A1628 !important;
  font-size: clamp(26px, 3vw, 42px) !important;
  text-align: center !important;
}

/* ============================================================
   INDUSTRIES  (.vma-industries)
   ============================================================ */
.vma-industries {
  background-color: #ffffff !important;
}
.vma-industries .elementor-heading-title {
  color: #0A1628 !important;
  font-size: clamp(26px, 3vw, 42px) !important;
  text-align: center !important;
}

/* ============================================================
   FAQ SECTION  (.vma-faq)
   ============================================================ */
.vma-faq {
  background-color: #F1F5F9 !important;
}
.vma-faq .elementor-heading-title {
  color: #0A1628 !important;
  font-size: clamp(26px, 3vw, 42px) !important;
  text-align: center !important;
}
.vma-faq .elementor-accordion-item {
  background-color: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 10px !important;
  margin-bottom: 12px !important;
  overflow: hidden !important;
}
.vma-faq .elementor-tab-title {
  font-family: 'Poppins', sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #0A1628 !important;
  padding: 20px 24px !important;
  background-color: #ffffff !important;
  border: none !important;
  border-bottom: none !important;
}
.vma-faq .elementor-tab-title.elementor-active,
.vma-faq .elementor-tab-title:hover {
  color: #FF6B00 !important;
  background-color: rgba(255,107,0,0.04) !important;
}
.vma-faq .elementor-tab-title .elementor-accordion-icon { color: #FF6B00 !important; }
.vma-faq .elementor-tab-content {
  color: #64748b !important;
  font-size: 15px !important;
  line-height: 1.8 !important;
  padding: 0 24px 20px !important;
  border-top: 1px solid #e2e8f0 !important;
}

/* ============================================================
   CTA SECTION  (.vma-cta)
   ============================================================ */
.vma-cta {
  background-color: #0A1628 !important;
  background-image: radial-gradient(ellipse at center, #1a2f5a 0%, #0A1628 70%) !important;
}
.vma-cta .elementor-heading-title {
  color: #ffffff !important;
  font-size: clamp(28px, 4vw, 52px) !important;
  text-align: center !important;
}
.vma-cta .elementor-widget-text-editor p {
  color: #94a3b8 !important;
  font-size: 20px !important;
  text-align: center !important;
}
.vma-cta .elementor-button {
  background-color: #FF6B00 !important;
  color: #ffffff !important;
  border-radius: 8px !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 700 !important;
  font-size: 18px !important;
  box-shadow: 0 4px 20px rgba(255,107,0,0.4) !important;
  transition: all 0.3s !important;
}
.vma-cta .elementor-button:hover {
  background-color: #e05e00 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 30px rgba(255,107,0,0.5) !important;
}

/* ============================================================
   CONTACT SECTION  (.vma-contact)
   ============================================================ */
.vma-contact {
  background-color: #ffffff !important;
}
.vma-contact .elementor-heading-title {
  color: #0A1628 !important;
  font-size: clamp(26px, 3vw, 42px) !important;
  text-align: center !important;
}
/* Contact form inputs */
.vma-contact .elementor-field-group label {
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #0A1628 !important;
  margin-bottom: 6px !important;
}
.vma-contact .elementor-field-group .elementor-field {
  font-family: 'Inter', sans-serif !important;
  font-size: 15px !important;
  border: 1.5px solid #e2e8f0 !important;
  border-radius: 8px !important;
  padding: 13px 16px !important;
  background-color: #ffffff !important;
  color: #0A1628 !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
  width: 100% !important;
}
.vma-contact .elementor-field-group .elementor-field:focus {
  outline: none !important;
  border-color: #FF6B00 !important;
  box-shadow: 0 0 0 3px rgba(255,107,0,0.12) !important;
}
.vma-contact .elementor-button[type="submit"] {
  background-color: #FF6B00 !important;
  color: #ffffff !important;
  width: 100% !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  padding: 16px 24px !important;
  border-radius: 8px !important;
  border: none !important;
  box-shadow: 0 4px 15px rgba(255,107,0,0.35) !important;
  transition: all 0.3s !important;
}
.vma-contact .elementor-button[type="submit"]:hover {
  background-color: #e05e00 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 25px rgba(255,107,0,0.45) !important;
}

/* ============================================================
   FOOTER  (.vma-footer)
   ============================================================ */
.vma-footer {
  background-color: #020817 !important;
}
.vma-footer .elementor-heading-title {
  color: #ffffff !important;
  font-size: 17px !important;
}
.vma-footer .elementor-widget-text-editor p,
.vma-footer .elementor-widget-text-editor a {
  color: #64748b !important;
  font-size: 14px !important;
}
.vma-footer .elementor-widget-text-editor a:hover { color: #FF6B00 !important; }
.vma-footer .elementor-divider-separator { border-color: #1e293b !important; }
/* Social icons */
.vma-footer .elementor-social-icon {
  background-color: rgba(255,255,255,0.07) !important;
  border-radius: 50% !important;
  transition: all 0.3s !important;
}
.vma-footer .elementor-social-icon:hover {
  background-color: #FF6B00 !important;
  transform: translateY(-3px) !important;
}
.vma-footer .elementor-social-icon i { color: #ffffff !important; }

/* ============================================================
   GLOBAL DIVIDER — Orange accent
   ============================================================ */
.vma-about .elementor-divider-separator,
.vma-why-us .elementor-divider-separator,
.vma-services-header .elementor-divider-separator,
.vma-process .elementor-divider-separator,
.vma-testimonials .elementor-divider-separator,
.vma-industries .elementor-divider-separator,
.vma-faq .elementor-divider-separator,
.vma-contact .elementor-divider-separator,
.elementor-divider-separator {
  border-color: #FF6B00 !important;
}

/* ============================================================
   RESPONSIVE — Tablet (max 1024px)
   ============================================================ */
@media screen and (max-width: 1024px) {
  .vma-hero, .vma-about, .vma-services,
  .vma-services-header, .vma-services-row,
  .vma-why-us, .vma-process, .vma-results,
  .vma-testimonials, .vma-industries,
  .vma-faq, .vma-cta, .vma-contact, .vma-footer {
    padding-left: 40px !important;
    padding-right: 40px !important;
  }
}

/* ============================================================
   RESPONSIVE — Mobile (max 767px)
   ============================================================ */
@media screen and (max-width: 767px) {
  .vma-hero .elementor-heading-title { font-size: 28px !important; }
  .vma-cta .elementor-heading-title  { font-size: 26px !important; }

  .vma-hero, .vma-about, .vma-services,
  .vma-services-header, .vma-services-row,
  .vma-why-us, .vma-process, .vma-results,
  .vma-testimonials, .vma-industries,
  .vma-faq, .vma-cta, .vma-contact, .vma-footer {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .vma-results .elementor-counter-number-wrapper { font-size: 40px !important; }

  .elementor-column { width: 100% !important; }

  .vma-services-row .elementor-column { margin-bottom: 20px !important; }

  .vma-hero { padding-top: 100px !important; padding-bottom: 60px !important; }

  .vma-cta { padding-top: 80px !important; padding-bottom: 80px !important; }
}/* End custom CSS */