/* BuildKitly — shared INTERACTION / MOTION STANDARD (owner: agent "motion"). Loaded site-wide, after every
   other bk-*.css (alphabetical enqueue). Other components must NOT declare their own transitions / hover
   motion; they add the utility classes below to Elementor elements (Advanced > CSS Classes).

   One rhythm: 180ms, cubic-bezier(.2,.7,.2,1). Allowed feedback only:
     colour muted -> primary (bk-link) · lift 2px for buttons & cards (bk-lift) · border -> #987737 for
     tool/doc cards (bk-card-border) · arrow glyph nudge 2px inside a hovered link (bk-arrow [+ bk-arrow-e])
   No gold text on hover, no underline on hover (except inline links inside Text Editor body copy).
   Focus: 2px solid #987737, offset 4px, :focus-visible only. Active nav item = primary.
   prefers-reduced-motion: no transitions, no lifts/nudges.

   Scoping: everything is inside `.elementor` (page, header and footer documents) and excludes the editor's
   own in-canvas UI (add-section area, element overlays), so the Elementor editor chrome is unaffected.
   `:not(#bk-m)` = specificity booster (one ID) used only where Elementor emits per-element rules that
   would otherwise win (e.g. `.elementor-69 .elementor-element.elementor-element-x ... { transition: color .3s }`). */

:root {
  --bk-motion-dur: 180ms;
  --bk-motion-ease: cubic-bezier(.2, .7, .2, 1);
  --bk-ring: #987737;
  --bk-lift: -2px;
  --bk-nudge-x: 2px;
  --bk-nudge-y: -2px;          /* default glyph = north-east arrow; .bk-arrow-e sets 0 */
}

/* ---------------------------------------------------------------------------------------------
   1. One transition for every interactive element (replaces Elementor's all .3s / .4s / color .3s)
   --------------------------------------------------------------------------------------------- */
.elementor :is(
    a, button, summary, [role="button"],
    .elementor-button, .elementor-icon, .elementor-item, .elementor-sub-item, .elementor-menu-toggle,
    .elementor-icon-list-icon i, .elementor-icon-list-icon svg, .elementor-icon-list-text,
    .e-n-accordion-item-title, .e-n-accordion-item-title-icon i, .e-n-accordion-item-title-icon svg,
    .bk-lift, .bk-link, .bk-card-border
  ):not(#bk-m):where(:not(.elementor-add-section *, .elementor-element-overlay *, .elementor-add-section, .elementor-element-overlay)) {
  transition-property: color, background-color, border-color, fill, opacity, translate, transform, text-decoration-color;
  transition-duration: var(--bk-motion-dur);
  transition-timing-function: var(--bk-motion-ease);
  transition-delay: 0s;
}
/* Non-interactive layout pieces inside a linked card (nested containers / widget wrappers) share the rhythm too,
   so a hovered card never mixes 180ms with Elementor's 300/400ms container transitions. */
.elementor a :is(.e-con, .elementor-widget-container, .elementor-element):not(#bk-m) {
  transition-duration: var(--bk-motion-dur);
  transition-timing-function: var(--bk-motion-ease);
}

/* ---------------------------------------------------------------------------------------------
   2. No gold-on-hover. The Kit's link hover colour (accent) leaks onto links whose own colour is not
      set by a widget control: containers rendered as <a> (cards, rows), image/logo links and icon-list item links. Keep them
      at the Kit resting link colour (primary). Widget links (button, heading, nav, icon) are untouched.
   --------------------------------------------------------------------------------------------- */
body .elementor :is(a.e-con, .elementor-widget-image a, .elementor-widget-theme-site-logo a, .elementor-icon-list-item > a):is(:hover, :focus-visible) {
  color: var(--e-global-color-primary);
}

/* Inline links inside body copy (Text Editor) — the only place an underline is allowed. They take the
   paragraph colour (works on light and dark bands); hover strengthens the underline, never turns gold. */
body .elementor .elementor-widget-text-editor a:not(.elementor-button) {
  color: inherit;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: color-mix(in srgb, currentColor 40%, transparent);
}
body .elementor .elementor-widget-text-editor a:not(.elementor-button):is(:hover, :focus-visible) {
  color: inherit;
  text-decoration-color: currentColor;
}

/* ---------------------------------------------------------------------------------------------
   3. Nav: active item = primary (hover muted -> primary is set natively on each Nav Menu widget)
   --------------------------------------------------------------------------------------------- */
.elementor:not(.elementor-location-footer) .elementor-nav-menu :is(a.elementor-item-active, .current-menu-item > a, .current_page_item > a):not(#bk-m) {
  color: var(--e-global-color-primary);   /* footer lists stay muted like the reference */
}

/* ---------------------------------------------------------------------------------------------
   4. Focus ring (keyboard only)
   --------------------------------------------------------------------------------------------- */
.elementor :is(a, button, summary, [role="button"], [tabindex]:not([tabindex="-1"])):focus-visible:where(:not(.elementor-add-section *, .elementor-element-overlay *)),
.bk-focus:focus-visible,
.bk-focus :focus-visible,
.skip-link:focus-visible {
  outline: 2px solid var(--bk-ring);
  outline-offset: 4px;
  box-shadow: none;
}
.elementor :is(input, select, textarea):not([type="hidden"]):focus-visible:not(#bk-m) {
  outline: 2px solid var(--bk-ring);
  outline-offset: 2px;           /* fields already have a border; a detached 4px ring reads as a glitch */
}
.elementor :is(a, button, summary):focus:not(:focus-visible) { outline: none; }

/* ---------------------------------------------------------------------------------------------
   5. Utilities
   --------------------------------------------------------------------------------------------- */

/* bk-lift — buttons & cards rise 2px. Put it on: a container rendered as <a>, a Button widget, a Form widget
   (lifts its submit), an Icon widget with a link, a Heading widget with a link, an Icon List item link.
   Uses the independent `translate` property, so it composes with Elementor rotate/offset transforms. */
.bk-lift .elementor-heading-title > a { display: inline-block; }
:is(a.bk-lift, button.bk-lift, .bk-lift .elementor-button, .bk-lift a.elementor-icon,
    .bk-lift .elementor-heading-title > a, .bk-lift .elementor-icon-list-item > a):is(:hover, :focus-visible) {
  translate: 0 var(--bk-lift);
}

/* bk-link — muted text -> primary on hover. On a Heading/Text widget with a link, or on a container <a>. */
:is(.bk-link a, a.bk-link):not(#bk-m) { color: var(--e-global-color-text); }
:is(.bk-link a, a.bk-link):not(#bk-m):is(:hover, :focus-visible),
:is(.bk-link a, a.bk-link).bk-is-active:not(#bk-m) { color: var(--e-global-color-primary); }

/* bk-card-border — tool / doc cards: border -> ring gold. On a container with a 1px border (native border). */
.bk-card-border:not(#bk-m):is(:hover, :focus-visible, :focus-within) {
  --border-color: var(--bk-ring);
  border-color: var(--bk-ring);
}

/* bk-arrow — the arrow glyph inside a hovered link nudges 2px (north-east by default; add bk-arrow-e for →).
   Put it on the widget holding the link (Heading / Button) or on a container rendered as <a>.
   Glyphs recognised: .bk-glyph (any inline span, or an Icon widget carrying the class), Elementor button
   icons, BuildKitly inline arrows (.bk-ha-ico) and CSS-mask arrows drawn as ::after of the link / heading. */
.bk-arrow-e { --bk-nudge-y: 0px; }
.bk-glyph:not(.elementor-widget) { display: inline-block; }   /* inline spans are not transformable */
:is(.bk-arrow, a.bk-arrow) :is(.bk-glyph:not(.elementor-widget), .elementor-widget.bk-glyph .elementor-icon, .bk-ha-ico, .elementor-button-icon),
.bk-arrow a::after,
a.bk-arrow .elementor-heading-title::after {
  transition: translate var(--bk-motion-dur) var(--bk-motion-ease);
}
:is(.bk-arrow a, a.bk-arrow, .bk-arrow button):is(:hover, :focus-visible)
  :is(.bk-glyph:not(.elementor-widget), .elementor-widget.bk-glyph .elementor-icon, .bk-ha-ico, .elementor-button-icon),
.bk-arrow a:is(:hover, :focus-visible)::after,
a.bk-arrow:is(:hover, :focus-visible) .elementor-heading-title::after {
  translate: var(--bk-nudge-x) var(--bk-nudge-y);
}

/* ---------------------------------------------------------------------------------------------
   6. Reduced motion: no transitions, no lifts / nudges (colour + border changes still apply instantly)
   --------------------------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .elementor *, .elementor *::before, .elementor *::after {
    transition-duration: 0s !important;
    transition-delay: 0s !important;
    scroll-behavior: auto !important;
  }
  :root { --bk-lift: 0px; --bk-nudge-x: 0px; --bk-nudge-y: 0px; }
  .bk-arrow-e { --bk-nudge-y: 0px; }
  :is(a.bk-lift, button.bk-lift, .bk-lift .elementor-button, .bk-lift a.elementor-icon,
      .bk-lift .elementor-heading-title > a, .bk-lift .elementor-icon-list-item > a):is(:hover, :focus-visible),
  :is(.bk-arrow a, a.bk-arrow, .bk-arrow button):is(:hover, :focus-visible)
    :is(.bk-glyph:not(.elementor-widget), .elementor-widget.bk-glyph .elementor-icon, .bk-ha-ico, .elementor-button-icon),
  .bk-arrow a:is(:hover, :focus-visible)::after,
  a.bk-arrow:is(:hover, :focus-visible) .elementor-heading-title::after {
    translate: none !important;
  }
}