.elementor-5618 .elementor-element.elementor-element-e8378dc{--display:flex;}.elementor-5618 .elementor-element.elementor-element-330b1f4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}/* Start custom CSS for html, class: .elementor-element-92ec7c3 */:root { --brand: #2A3B5A; }

/* Strong reset to beat theme rules */
.pill,
.pill:link,
.pill:visited,
.pill:hover,
.pill:focus,
.pill:focus-visible,
.pill:active {
  appearance: none;
  border: 1px solid transparent !important;
  border-radius: 999px !important;
  padding: 12px 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  background: var(--brand) !important;  /* default: brand bg */
  color: #fff !important;               /* default: white text */
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, color .18s ease, border-color .18s ease !important;
}

/* Keep inner elements white too */
.pill * { color: inherit !important; }
.pill svg { stroke: currentColor !important; }

/* Hover = reverse (white bg, brand text + border) */
.pill:hover {
  background: #fff !important;
  color: var(--brand) !important;
  border-color: var(--brand) !important;
  transform: translateY(-1px) scale(1.02);
  box-shadow: 0 8px 18px rgba(42,59,90,.15);
}

/* Active press */
.pill:active {
  transform: translateY(0) scale(.98);
  box-shadow: 0 4px 10px rgba(42,59,90,.20);
}

/* Accessible focus ring */
.pill:focus-visible {
  outline: none !important;
  box-shadow:
    0 0 0 3px #fff,
    0 0 0 6px rgba(42,59,90,.35) !important;
}

/* Optional: a “ghost” variant that starts reversed */
.pill--ghost,
.pill--ghost:link,
.pill--ghost:visited {
  background: #fff !important;
  color: var(--brand) !important;
  border-color: var(--brand) !important;
}
.pill--ghost:hover {
  background: var(--brand) !important;
  color: #fff !important;
  border-color: var(--brand) !important;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .pill { transition: none !important; }
}/* End custom CSS */