/* =====================================================================
   ALYA FOUNDATION — site-wide reskin for LEGACY Elementor pages.

   Re-skins the Elementor Global Kit + generic widget classes so the old
   (classic Section/Column) pages adopt the ALYA brand — Manrope type,
   navy/neon palette, pill buttons — WITHOUT rebuilding them.

   • Targets ONLY generic Elementor classes (.elementor-button,
     .elementor-widget-heading, .elementor-counter …) + kit CSS vars, so
     it reaches pages that have no custom classes of their own.
   • Lives in the theme (survives the wptransporter DB sync).
   • Loads BEFORE the component layer (alya.css); page-specific component
     classes there stay more specific and win where both apply.
   ===================================================================== */

/* ── 1. Global Kit tokens → ALYA palette ──────────────────────────────
   Old kit: primary #005B93 (blue) · secondary #56AB46 (green) ·
            text #7A7A7A · accent #05466C — all map to navy/grey so text
            keeps good contrast on light backgrounds. Neon is reserved
            for buttons (where we control bg + text together). */
body[class*="elementor-kit-"] {
  --e-global-color-primary:   #021F4B;
  --e-global-color-secondary: #021F4B;
  --e-global-color-text:      #5A7090;
  --e-global-color-accent:    #021F4B;
  --e-global-typography-primary-font-family:   "Manrope";
  --e-global-typography-secondary-font-family: "Manrope";
  --e-global-typography-text-font-family:      "Manrope";
  --e-global-typography-accent-font-family:    "Manrope";
}

/* ── 2. Headings → Manrope, tighter, heavier ─────────────────────────── */
.elementor-widget-heading .elementor-heading-title {
  font-family: "Manrope", sans-serif !important;
  letter-spacing: -0.02em;
}
.elementor-widget-heading .elementor-heading-title,
.elementor-widget-heading .elementor-heading-title a { color: #021F4B; }

/* ── 3. Body / list / icon-box text → Manrope ─────────────────────────── */
.elementor-widget-text-editor,
.elementor-widget-text-editor p,
.elementor-widget-icon-box .elementor-icon-box-title,
.elementor-widget-icon-box .elementor-icon-box-description,
.elementor-widget-icon-list .elementor-icon-list-text,
.elementor-widget-image-box .elementor-image-box-title,
.elementor-widget-image-box .elementor-image-box-description {
  font-family: "Manrope", sans-serif;
}
.elementor-widget-icon-box .elementor-icon-box-title,
.elementor-widget-image-box .elementor-image-box-title { font-weight: 700; letter-spacing: -0.01em; }

/* ── 4. Buttons → ALYA pill (neon primary) ────────────────────────────── */
.elementor-button,
a.elementor-button,
.elementor-widget-button .elementor-button {
  font-family: "Manrope", sans-serif !important;
  border-radius: 9999px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  background-color: #7FFA7B !important;
  color: #021F4B !important;
  border: none !important;
  fill: #021F4B !important;
  transition: transform .2s cubic-bezier(.34,1.56,.64,1), background-color .2s, box-shadow .2s;
}
.elementor-button:hover,
a.elementor-button:hover,
.elementor-widget-button .elementor-button:hover {
  background-color: #A3FBA0 !important;
  color: #021F4B !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(127,250,123,.25);
}
.elementor-button .elementor-button-icon svg,
.elementor-button .elementor-button-icon i { color: #021F4B !important; fill: #021F4B !important; }

/* ── 5. Counters / stat numbers → navy Manrope ────────────────────────── */
.elementor-counter .elementor-counter-number-wrapper {
  font-family: "Manrope", sans-serif !important;
  color: #021F4B !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em;
}
.elementor-counter .elementor-counter-title {
  font-family: "Manrope", sans-serif !important;
  color: #5A7090 !important;
}

/* ── 6. Standalone icons → navy, neon-tinted containers ──────────────── */
.elementor-widget-icon .elementor-icon i,
.elementor-widget-icon .elementor-icon svg,
.elementor-widget-icon-box .elementor-icon i,
.elementor-widget-icon-box .elementor-icon svg { color: #021F4B; fill: #021F4B; }

/* ── 7. Links inside content → navy with green hover ──────────────────── */
.elementor-widget-text-editor a,
.elementor-widget-text-editor a:visited { color: #021F4B; text-decoration-color: rgba(2,31,75,.3); }
.elementor-widget-text-editor a:hover { color: #0BA84A; }

/* ── 8. Dividers → ALYA hairline ──────────────────────────────────────── */
.elementor-widget-divider .elementor-divider-separator { border-color: #C8DAF2 !important; }