/* Nested Card Slider v1.5.7 — frontend trailing empty cards excluded from navigation. */
.encs-root {
    --encs-cols: 3;
    --encs-group-cols: 3;
    --encs-step: 2;
    --encs-column-gap: 20px;
    --encs-slide-gap: 0px;
    --encs-peek: 16%;
    --encs-mobile-peek: 24%;
    --encs-mobile-fade-width: 45px;
    --encs-fade-width: 100px;
    --encs-nav-spacing: 16px;
    --encs-nav-align: flex-end;
    --encs-side-inset: 12px;
    --encs-min-height: 0px;
    width: 100%; min-width: 0; max-width: 100%; position: relative; box-sizing: border-box;
}
.encs-root *, .encs-root *::before, .encs-root *::after { box-sizing: border-box; }
.encs-root [hidden] { display: none !important; }
.encs-stage { position: relative; min-width: 0; }
.encs-viewport {
    width: 100%; min-width: 0; overflow-x: auto; overflow-y: hidden;
    scroll-snap-type: none; scroll-behavior: auto; overscroll-behavior-x: contain;
    scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch;
    touch-action: pan-x pan-y; cursor: grab;
}
/* Touch screens: handle only horizontal gestures in JavaScript. Allow native
   vertical page scrolling; avoiding native horizontal inertia means there is
   no wait between finger release and the continuation animation. */
@media (pointer: coarse) {
    .encs-root[data-swipe="yes"] .encs-viewport { touch-action: pan-y; }
}
.encs-viewport::-webkit-scrollbar { display: none; }
.encs-root[data-swipe="no"] .encs-viewport { cursor: auto; touch-action: pan-y; }
.encs-viewport.encs-is-dragging { cursor: grabbing; scroll-snap-type: none !important; user-select: none; -webkit-user-select: none; }
.encs-viewport.encs-is-dragging * { cursor: grabbing !important; }
.encs-viewport:focus:not(:focus-visible) { outline: none; }
.encs-viewport:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.encs-track { display: flex; align-items: stretch; gap: var(--encs-slide-gap); min-width: 0; width: 100%; position: relative; }
/* The outer shell always scrolls horizontally. The real Elementor slide
   container is a horizontal row of REAL Elementor card containers. This must
   override Elementor's default width:100% / flex-direction:column variables.
   Do not move/clone rendered elements: the editor's drop zones stay native. */
.encs-root .encs-track > .encs-slide,
.encs-root.encs-editor .encs-track > .elementor-element.encs-slide-shell {
    min-width: 0 !important;
    min-height: var(--encs-min-height);
    flex: 0 0 var(--encs-slide-width, 100%) !important;
    width: var(--encs-slide-width, 100%) !important;
    max-width: none !important;
    align-self: stretch;
    position: relative;
}
.encs-root .encs-track > .encs-slide { display: flex; align-items: stretch; }
.encs-root .encs-slide > .encs-slide-group {
    /* Allow individual native Elementor slide margins without overflowing
       the structural slider shell; the shell carries global margins/padding. */
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
}
.encs-root:not(.encs-columns-on) .encs-track > .encs-slide,
.encs-root:not(.encs-columns-on).encs-editor .encs-track > .encs-slide-shell {
    scroll-snap-align: start;
}
/* Actual slide container: laid out just like a one-row Elementor flex container. */
.encs-root.encs-columns-on .encs-slide-group {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: var(--encs-column-gap) !important;
    --display: flex;
    --flex-direction: row;
    --flex-wrap: nowrap;
    --gap: var(--encs-column-gap);
}
/* Elementor boxed-content mode inserts .e-con-inner between slide and cards. */
.encs-root.encs-columns-on .encs-slide-group > .e-con-inner {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: var(--encs-column-gap) !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: 1 1 100%;
}
/* Most important rule: cards have their own width. Slide width alone is not
   enough, as Elementor will otherwise expand a nested container to 100%. */
.encs-root.encs-columns-on .encs-slide-group .encs-card-column {
    --width: var(--encs-card-width);
    width: var(--encs-card-width) !important;
    flex: 0 0 var(--encs-card-width) !important;
    min-width: 0 !important;
    max-width: var(--encs-card-width) !important;
    align-self: stretch;
    scroll-snap-align: start;
    position: relative;
}
.encs-root.encs-columns-on .encs-slide-group .encs-card-column > .e-con-inner {
    width: 100%; min-width: 0;
}
/* Do not put mask-image on the carousel viewport. A mask on the ancestor
   flattens 3D compositing, which can make Elementor flip-box faces disappear
   entirely in Chrome's canvas. Paint the fade as a sibling overlay instead. */
/* Separate pseudo-element overlays keep 3D flip-box faces visible. */
.encs-stage::before, .encs-stage::after { content: none; }
@media (min-width: 1025px) {
    /* The right edge fades while there are additional cards to reveal. */
    .encs-root[data-peek="yes"][data-fade="yes"]:not(.encs-at-end) .encs-stage::after {
        content: "";
        position: absolute;
        inset: 0 0 0 auto;
        width: min(35%, var(--encs-fade-width));
        pointer-events: none;
        z-index: 4;
        background: linear-gradient(to right, transparent, var(--encs-fade-color, #fff));
    }
    /* Only at the final scroll position, fade the clipped previous card on the left.
       At every earlier position, display just the existing right-side fade. */
    .encs-root[data-peek="yes"][data-fade="yes"].encs-at-end:not(.encs-at-start) .encs-stage::before {
        content: "";
        position: absolute;
        inset: 0 auto 0 0;
        width: min(35%, var(--encs-fade-width));
        pointer-events: none;
        z-index: 4;
        background: linear-gradient(to left, transparent, var(--encs-fade-color, #fff));
    }
    /* Editor uses only outlines. Never fade, tint, or cover real widget content. */
    .elementor-editor-active .encs-root.encs-editor .encs-stage::before,
    .elementor-editor-active .encs-root.encs-editor .encs-stage::after { content: none !important; }
    .encs-root:not(.encs-columns-on)[data-peek="yes"] .encs-track > .encs-slide,
    .encs-root:not(.encs-columns-on)[data-peek="yes"].encs-editor .encs-track > .elementor-element {
        flex-basis: calc(100% - var(--encs-peek)); width: calc(100% - var(--encs-peek));
    }
}
@media (max-width: 1024px) { .encs-root { --encs-cols: 2; } }
@media (max-width: 767px) {
    /* Independent mobile peek: one complete card remains visible. The extra
       right-hand space shows the next card and is excluded from card sizing. */
    .encs-root:not(.encs-columns-on)[data-mobile-peek="yes"] .encs-track > .encs-slide,
    .encs-root:not(.encs-columns-on)[data-mobile-peek="yes"].encs-editor .encs-track > .elementor-element {
        flex-basis: calc(100% - var(--encs-mobile-peek));
        width: calc(100% - var(--encs-mobile-peek));
    }
    /* Fades are siblings of the viewport (not masks) to preserve 3D flipboxes.
       Matching the desktop rule, the right fade applies at all positions until
       the final scroll, when only the previous card on the left fades. */
    .encs-root[data-mobile-peek="yes"][data-mobile-fade="yes"]:not(.encs-at-end) .encs-stage::after {
        content: "";
        position: absolute;
        inset: 0 0 0 auto;
        width: min(35%, var(--encs-mobile-fade-width));
        pointer-events: none;
        z-index: 4;
        background: linear-gradient(to right, transparent, var(--encs-fade-color, #fff));
    }
    .encs-root[data-mobile-peek="yes"][data-mobile-fade="yes"].encs-at-end:not(.encs-at-start) .encs-stage::before {
        content: "";
        position: absolute;
        inset: 0 auto 0 0;
        width: min(35%, var(--encs-mobile-fade-width));
        pointer-events: none;
        z-index: 4;
        background: linear-gradient(to left, transparent, var(--encs-fade-color, #fff));
    }
}
/* All editor drop-zones stay transparent and visible even with mobile fade on. */
.elementor-editor-active .encs-root.encs-editor .encs-stage::before,
.elementor-editor-active .encs-root.encs-editor .encs-stage::after { content: none !important; }
@media (max-width: 767px) {
    .encs-root { --encs-cols: 1; --encs-step: 1; }
    .encs-root[data-mobile-arrows="no"] .encs-nav { display: none !important; }
}
/* Do NOT force nav display:none: v1.1 accidentally hid navigation on every device. */
.encs-root .encs-nav {
    display: flex; justify-content: var(--encs-nav-align, flex-end); align-items: center;
    gap: 10px; min-height: 0; position: relative; z-index: 8;
    visibility: visible;
}
.encs-root[data-placement="above"] > .encs-nav { margin-bottom: var(--encs-nav-spacing); }
.encs-root[data-placement="below"] > .encs-nav { margin-top: var(--encs-nav-spacing); }
.encs-root[data-placement="overlay"] .encs-nav {
    position: absolute; inset: 0; z-index: 15;
    display: flex; justify-content: space-between !important;
    align-items: center; pointer-events: none; padding-inline: var(--encs-side-inset);
}
.encs-root[data-placement="overlay"] .encs-nav .encs-arrow { pointer-events: auto; }
.encs-root .encs-arrow {
    cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
    flex: 0 0 auto; position: relative; line-height: 1;
    font-family: inherit; font-size: inherit; color: inherit;
    background-color: transparent; border: 1px solid currentColor;
    border-radius: 50%; width: 44px; height: 44px; padding: 0;
    appearance: none; -webkit-appearance: none;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease, opacity .2s ease;
    -webkit-tap-highlight-color: transparent;
}
.encs-root .encs-arrow:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.encs-root .encs-arrow:disabled { cursor: not-allowed; opacity: .35; }
.encs-root .encs-arrow-icon { display: inline-flex; align-items: center; justify-content: center; line-height: 1; font-size: 18px; color: inherit; }
.encs-root .encs-arrow-icon i { display: block; line-height: 1; }
.encs-root .encs-arrow-icon svg { display: block; width: 1em; height: 1em; color: inherit; fill: currentColor; }
.encs-root .encs-arrow-icon svg[fill="none"] { fill: none; }
.encs-sr-status { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
@media (prefers-reduced-motion: reduce) {
    .encs-arrow { transition: none; }
    .encs-viewport { scroll-behavior: auto !important; }
}
/* Elementor editor guides: true containers, no translucent backgrounds.
   Only decorate the structural elements. Never tint or mask child widgets. */
.elementor-editor-active .encs-root.encs-editor .encs-slide-shell {
    min-height: 0;
    outline: 1px dashed rgba(104, 112, 127, .35);
    outline-offset: -1px;
    background-color: transparent !important;
    background-image: none !important;
}
.elementor-editor-active .encs-root.encs-editor .encs-slide-group {
    min-height: 0;
    background-color: transparent !important;
    background-image: none !important;
}
.elementor-editor-active .encs-root.encs-editor.encs-columns-on .encs-card-column {
    min-height: 0 !important;
    outline: 1px dashed rgba(98, 106, 124, .65);
    outline-offset: -2px;
    border-radius: 0;
    background-color: transparent !important;
    background-image: none !important;
    overflow: visible;
}
.elementor-editor-active .encs-root.encs-editor.encs-columns-on .encs-card-column.encs-empty-column {
    min-height: 145px !important;
}
.elementor-editor-active .encs-root.encs-editor.encs-columns-on .encs-card-column::before {
    content: attr(data-encs-card-label);
    position: absolute;
    top: 5px; left: 5px;
    padding: 2px 4px;
    z-index: 5;
    font: 600 10px/1.4 Arial, sans-serif;
    letter-spacing: .35px;
    color: #4e647f;
    background: transparent;
    border-radius: 2px;
    pointer-events: none;
}
.elementor-editor-active .encs-root.encs-editor.encs-columns-on .encs-card-column.encs-empty-column::after {
    content: 'Drop Elementor widgets here';
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% - 24px);
    color: #64748b;
    font: 12px/1.5 Arial, sans-serif;
    text-align: center;
    z-index: 2;
    pointer-events: none;
}
.elementor-editor-active .encs-root.encs-editor .encs-slide-shell::before {
    content: 'SLIDE ' attr(data-encs-slide-label);
    position: absolute; top: 0; right: 0; z-index: 5;
    color: #526783; background: transparent;
    padding: 2px 5px;
    pointer-events: none;
    font: 600 10px/1.6 Arial, sans-serif; letter-spacing: .6px;
}
/* Elementor can paint large opaque blue-gray selected-container overlays.
   Disable their paint ONLY on fixed slider structures, not child widgets. */
.elementor-editor-active .encs-root.encs-editor .encs-slide-shell > .elementor-element-overlay,
.elementor-editor-active .encs-root.encs-editor .encs-slide-group > .elementor-element-overlay,
.elementor-editor-active .encs-root.encs-editor .encs-card-column > .elementor-element-overlay {
    background: transparent !important;
    box-shadow: none !important;
    pointer-events: none;
}
/* Keep real flip boxes and every other nested widget in the paint stack. */
.elementor-editor-active .encs-root.encs-editor .encs-card-column > .elementor-widget,
.elementor-editor-active .encs-root.encs-editor .encs-card-column > .e-con-inner > .elementor-widget {
    position: relative;
    z-index: 1;
    visibility: visible !important;
    opacity: 1 !important;
}
.elementor-editor-active .encs-root.encs-editor .encs-arrow { pointer-events: auto; }
/* The structural elements stay fixed, but widgets inside remain editable. */
.elementor-editor-active .encs-root.encs-editor .encs-slide-shell > .elementor-editor-element-settings,
.elementor-editor-active .encs-root.encs-editor .encs-slide-shell > .elementor-element-overlay > .elementor-editor-element-settings,
.elementor-editor-active .encs-root.encs-editor .encs-card-column > .elementor-editor-element-settings,
.elementor-editor-active .encs-root.encs-editor .encs-card-column > .elementor-element-overlay > .elementor-editor-element-settings {
    display: none !important;
}