.elementor-kit-8 {
  /* color tokens (use theme variables with hex fallbacks) */
  --e-global-color-primary: var(--primary-color, #f97316);        /* orange-500 */
  --e-global-color-secondary: var(--secondary-color, #14b8a6);    /* teal-400 */
  --e-global-color-text: var(--text-color, #0f172a);              /* slate-900 */
  --e-global-color-accent: var(--accent-color, #e11d48);          /* rose-600 */

  /* typography — matched to Tailwind config (swap back to Roboto if you want) */
  --e-global-typography-primary-font-family: "Lato", Roboto, sans-serif;
  --e-global-typography-primary-font-weight: 600;
  --e-global-typography-secondary-font-family: "Lato", "Roboto Slab", serif;
  --e-global-typography-secondary-font-weight: 400;
  --e-global-typography-text-font-family: "Lato", Roboto, sans-serif;
  --e-global-typography-text-font-weight: 400;
  --e-global-typography-accent-font-family: "Lato", Roboto, sans-serif;
  --e-global-typography-accent-font-weight: 500;
}

/* Optional small helpers so Elementor widgets pick up the new palette consistently */
.elementor-kit-8 .elementor-button,
.elementor-kit-8 .elementor-button .elementor-button-content-wrapper {
  background-color: var(--e-global-color-primary);
  color: #fff;
  border-color: transparent;
}

.elementor-kit-8 .elementor-widget-heading,
.elementor-kit-8 .elementor-widget-text-editor {
  color: var(--e-global-color-text);
}

.elementor-kit-8 .elementor-highlight,
.elementor-kit-8 .elementor-icon,
.elementor-kit-8 .elementor-bullet-list li::marker {
  color: var(--e-global-color-accent);
}

.elementor-kit-8 .elementor-background-overlay {
  background: linear-gradient(135deg, rgba(249,115,22,0.85) 0%, rgba(225,29,72,0.85) 100%);
}


.elementor-section.elementor-section-boxed>.elementor-container {
    max-width: 1140px;
}

.e-con {
    --container-max-width: 1140px;
}

.elementor-widget:not(:last-child) {
    margin-block-end: 20px;
}

.elementor-element {
    --widgets-spacing: 20px 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;
    }
}