.i3d-widget {
    font-family: var(--dtc-font-body,inherit);
    --i3d-item-width: 270px;
    --i3d-radius: 380px;
    --i3d-rail-lift: 72px;
    --i3d-accent: var(--dtc-accent,#ededed);
    --i3d-rail-color: rgba(255,255,255,.28);
    --i3d-rail-glow: rgba(255,255,255,.14);
    --i3d-icon-color: var(--dtc-text,#edeee8);
    --i3d-icon-size: 46px;
    --i3d-text-color: var(--dtc-text,#edeee8);
    --i3d-inactive-opacity: .22;

    position: relative;
    width: 100%;
    padding: clamp(54px, 7vw, 96px) clamp(24px, 6vw, 92px);
    overflow: hidden;
    isolation: isolate;

    /* Important: the Elementor parent/container supplies the background. */
    background: transparent !important;
    color: #fff;
}

/* Ambient light only — no solid background is painted by the widget. */
.i3d-widget::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 62%;
    width: min(900px, 86vw);
    height: 250px;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: radial-gradient(
        ellipse at center,
        rgba(255,255,255,.055),
        rgba(255,255,255,.018) 38%,
        transparent 72%
    );
    filter: blur(30px);
    pointer-events: none;
    z-index: -1;
}

.i3d-copy {
    position: relative;
    z-index: 8;
    max-width: 800px;
}

.i3d-title {
    margin: 0 0 12px;
    color: #fff;
    font-size: clamp(36px, 4vw, 58px);
    line-height: 1.02;
    font-weight: 700;
    letter-spacing: -0.035em;
}

.i3d-description {
    margin: 0;
    color: #fff;
    font-size: clamp(16px, 1.4vw, 20px);
    line-height: 1.55;
}

.i3d-stage {
    position: relative;
    z-index: 3;
    width: 100%;
    height: 360px;
    overflow: hidden;
    perspective: 1250px;
    perspective-origin: 50% 46%;
    outline: none;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;

    /* Fade the actual content at the far edges without knowing the container color. */
    -webkit-mask-image: linear-gradient(
        to right,
        transparent 0,
        #000 7%,
        #000 93%,
        transparent 100%
    );
    mask-image: linear-gradient(
        to right,
        transparent 0,
        #000 7%,
        #000 93%,
        transparent 100%
    );
}

.i3d-stage:focus-visible {
    outline: 1px solid rgba(255,255,255,.42);
    outline-offset: 5px;
}

/* -------------------------------------------------------------------------
   Circular / elliptical 3D orbit rail.
   This is the visible UI track. Industry items remain clean icon + text.
   ------------------------------------------------------------------------- */
.i3d-rail {
    position: absolute;
    left: 50%;
    top: 53%;
    z-index: 1;
    width: min(1040px, 92%);
    height: 250px;
    transform:
        translate3d(-50%, -50%, -170px)
        rotateX(74deg);
    transform-style: preserve-3d;
    border: 1px solid var(--i3d-rail-color);
    border-radius: 50%;
    box-shadow:
        0 0 26px var(--i3d-rail-glow),
        inset 0 0 24px rgba(255,255,255,.035);
    pointer-events: none;
    opacity: .96;
}

.i3d-rail::before,
.i3d-rail::after,
.i3d-rail__inner {
    content: "";
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.i3d-rail::before {
    inset: -12px;
    border: 1px solid rgba(255,255,255,.055);
    box-shadow: 0 0 30px var(--i3d-rail-glow);
}

.i3d-rail::after {
    left: 50%;
    top: 50%;
    width: 68%;
    height: 1px;
    transform: translate(-50%, -50%);
    background: linear-gradient(
        to right,
        transparent,
        rgba(255,255,255,.20) 22%,
        rgba(255,255,255,.48) 50%,
        rgba(255,255,255,.20) 78%,
        transparent
    );
    box-shadow: 0 0 16px var(--i3d-rail-glow);
}

.i3d-rail__inner {
    inset: 18%;
    border: 1px solid rgba(255,255,255,.11);
    box-shadow: inset 0 0 20px rgba(255,255,255,.03);
}

.i3d-rail__node {
    position: absolute;
    top: 50%;
    width: 7px;
    height: 7px;
    margin: -3.5px 0 0 -3.5px;
    border-radius: 50%;
    background: #fff;
    box-shadow:
        0 0 0 5px rgba(255,255,255,.045),
        0 0 18px var(--i3d-rail-glow);
}

.i3d-rail__node--left   { left: 5.5%; }
.i3d-rail__node--center { left: 50%; }
.i3d-rail__node--right  { left: 94.5%; }

.i3d-scene {
    position: absolute;
    inset: 0;
    z-index: 3;
    transform-style: preserve-3d;
}

.i3d-item {
    position: absolute;
    left: 50%;
    top: 50%;
    width: var(--i3d-item-width);
    min-height: 142px;
    margin: 0;
    opacity: 0;
    transform-style: preserve-3d;
    transform-origin: 50% 50%;
    backface-visibility: hidden;
    will-change: transform, opacity, filter;
    contain: layout style;
}

.i3d-item__action {
    display: flex;
    width: 100%;
    min-height: 142px;
    padding: 20px 14px;
    border: 0;
    background: transparent;
    color: inherit;
    text-decoration: none;
    align-items: center;
    justify-content: center;
    cursor: grab;
    outline: none;
    -webkit-tap-highlight-color: transparent;
}

.i3d-item__action:active {
    cursor: grabbing;
}

/*
 * Prevent theme / Elementor global link colors from overriding the
 * Industry widget on hover, focus or visited states.
 */
.i3d-item__action,
.i3d-item__action:link,
.i3d-item__action:visited,
.i3d-item__action:hover,
.i3d-item__action:focus,
.i3d-item__action:active {
    color: var(--i3d-text-color) !important;
    text-decoration: none !important;
}

.i3d-item__action .i3d-item__title,
.i3d-item__action:hover .i3d-item__title,
.i3d-item__action:focus .i3d-item__title,
.i3d-item__action:visited .i3d-item__title {
    color: var(--i3d-text-color) !important;
}

.i3d-item__action .i3d-item__icon,
.i3d-item__action:hover .i3d-item__icon,
.i3d-item__action:focus .i3d-item__icon,
.i3d-item__action:visited .i3d-item__icon {
    color: var(--i3d-icon-color) !important;
}

.i3d-item__action .i3d-item__icon svg,
.i3d-item__action:hover .i3d-item__icon svg,
.i3d-item__action:focus .i3d-item__icon svg,
.i3d-item__action:visited .i3d-item__icon svg {
    fill: currentColor !important;
    color: inherit !important;
}

.i3d-orb {
    position: relative;
    display: flex;
    width: 100%;
    min-height: 120px;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 0;
    box-shadow: none;
    overflow: visible;
    transform-style: preserve-3d;
}

/* Small active indicator only; no circles/cards around industry items. */
.i3d-orb::before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -3px;
    width: 0;
    height: 1px;
    transform: translateX(-50%);
    background: rgba(255,255,255,.96);
    box-shadow: 0 0 20px rgba(255,255,255,.55);
    transition:
        width .38s cubic-bezier(.2,.8,.2,1),
        opacity .3s ease;
    opacity: 0;
}

.i3d-item.is-active .i3d-orb::before {
    width: min(116px, 54%);
    opacity: 1;
}

.i3d-orb__ring {
    display: none;
}

.i3d-orb__inner {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 15px;
    width: 100%;
    text-align: center;
    transform-style: preserve-3d;
}

.i3d-item__icon {
    display: grid;
    place-items: center;
    width: 1em;
    height: 1em;
    color: var(--i3d-icon-color);
    font-size: var(--i3d-icon-size);
    line-height: 1;
    transform: translateZ(42px);
    filter: drop-shadow(0 0 18px rgba(255,255,255,.10));
    transition: filter .3s ease, transform .3s ease;
}

.i3d-item.is-active .i3d-item__icon {
    filter: drop-shadow(0 0 25px rgba(255,255,255,.24));
}

.i3d-item__icon i {
    width: 1em;
    height: 1em;
    font-size: 1em;
    line-height: 1;
}

.i3d-item__icon svg {
    display: block;
    width: 1em;
    height: 1em;
    fill: currentColor;
}

.i3d-item__title {
    display: block;
    max-width: 100%;
    color: var(--i3d-text-color);
    font-size: clamp(17px, 1.65vw, 24px);
    font-weight: 650;
    line-height: 1.16;
    letter-spacing: -0.018em;
    text-wrap: balance;
    transform: translateZ(28px);
}

.i3d-item__action:focus-visible .i3d-item__title {
    text-decoration: underline;
    text-underline-offset: 7px;
}

.i3d-hint {
    position: absolute;
    left: 50%;
    bottom: 18px;
    z-index: 30;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    transform: translateX(-50%);
    color: rgba(255,255,255,.48);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .16em;
    white-space: nowrap;
    pointer-events: none;
}

.i3d-hint__line {
    display: block;
    width: 30px;
    height: 1px;
    background: currentColor;
    position: relative;
}

.i3d-hint__line::after {
    content: "";
    position: absolute;
    right: 0;
    top: -2px;
    width: 5px;
    height: 5px;
    border-right: 1px solid currentColor;
    border-bottom: 1px solid currentColor;
    transform: rotate(-45deg);
}

.i3d-actions {
    position: relative;
    z-index: 8;
    display: flex;
    justify-content: center;
    margin-top: 10px;
}

.i3d-button {
    min-width: 200px;
    min-height: 54px;
    padding: 16px 30px;
    border-color: rgba(255,255,255,.32);
    background: transparent;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
}

.i3d-button .i3d-neon-button__content {
    gap: 14px;
}

.i3d-button__arrow {
    font-size: 21px;
}

.i3d-button__arrow svg {
    width: 1em;
    height: 1em;
}

@media (max-width: 1024px) {
    .i3d-rail {
        width: min(860px, 96%);
        height: 220px;
    }
}

@media (max-width: 767px) {
    .i3d-widget {
        padding: 48px 20px 54px;
    }

    .i3d-title {
        font-size: clamp(32px, 10vw, 46px);
    }

    .i3d-stage {
        height: 285px;
        -webkit-mask-image: linear-gradient(
            to right,
            transparent 0,
            #000 3%,
            #000 97%,
            transparent 100%
        );
        mask-image: linear-gradient(
            to right,
            transparent 0,
            #000 3%,
            #000 97%,
            transparent 100%
        );
    }

    .i3d-rail {
        top: 52%;
        width: 720px;
        height: 190px;
        transform:
            translate3d(-50%, -50%, -150px)
            rotateX(76deg);
    }

    .i3d-hint {
        bottom: 7px;
    }

    .i3d-button {
        min-width: 190px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .i3d-button,
    .i3d-button__arrow,
    .i3d-orb::before,
    .i3d-item__icon {
        transition-duration: .01ms !important;
    }
}
/* ==========================================================================
   v1.3.2 HARD COLOR LOCK
   Some themes/Elementor kits apply global a:hover rules with !important or
   target Font Awesome/SVG descendants separately. These scoped rules ensure
   the Industries widget always follows its own Elementor color controls.
   ========================================================================== */

.i3d-widget .i3d-color-lock,
.i3d-widget .i3d-color-lock:link,
.i3d-widget .i3d-color-lock:visited,
.i3d-widget .i3d-color-lock:hover,
.i3d-widget .i3d-color-lock:focus,
.i3d-widget .i3d-color-lock:focus-visible,
.i3d-widget .i3d-color-lock:active {
    color: var(--i3d-text-color) !important;
    -webkit-text-fill-color: var(--i3d-text-color) !important;
    text-decoration-color: currentColor !important;
}

/* Industry label: lock every state and inherited descendant. */
.i3d-widget .i3d-color-lock .i3d-item__title,
.i3d-widget .i3d-color-lock:hover .i3d-item__title,
.i3d-widget .i3d-color-lock:focus .i3d-item__title,
.i3d-widget .i3d-color-lock:focus-visible .i3d-item__title,
.i3d-widget .i3d-color-lock:active .i3d-item__title,
.i3d-widget .i3d-color-lock:visited .i3d-item__title {
    color: var(--i3d-text-color) !important;
    -webkit-text-fill-color: var(--i3d-text-color) !important;
    text-decoration-color: var(--i3d-text-color) !important;
}

/* Icon wrapper + Font Awesome <i> + its ::before glyph. */
.i3d-widget .i3d-color-lock .i3d-item__icon,
.i3d-widget .i3d-color-lock:hover .i3d-item__icon,
.i3d-widget .i3d-color-lock:focus .i3d-item__icon,
.i3d-widget .i3d-color-lock:focus-visible .i3d-item__icon,
.i3d-widget .i3d-color-lock:active .i3d-item__icon,
.i3d-widget .i3d-color-lock:visited .i3d-item__icon,
.i3d-widget .i3d-color-lock .i3d-item__icon i,
.i3d-widget .i3d-color-lock:hover .i3d-item__icon i,
.i3d-widget .i3d-color-lock .i3d-item__icon i::before,
.i3d-widget .i3d-color-lock:hover .i3d-item__icon i::before,
.i3d-widget .i3d-color-lock:focus .i3d-item__icon i::before,
.i3d-widget .i3d-color-lock:active .i3d-item__icon i::before {
    color: var(--i3d-icon-color) !important;
    -webkit-text-fill-color: var(--i3d-icon-color) !important;
    border-color: currentColor !important;
}

/* SVGs can be authored with fill, stroke, path, use, g, polygon, etc. */
.i3d-widget .i3d-color-lock .i3d-item__icon svg,
.i3d-widget .i3d-color-lock:hover .i3d-item__icon svg,
.i3d-widget .i3d-color-lock:focus .i3d-item__icon svg,
.i3d-widget .i3d-color-lock:active .i3d-item__icon svg,
.i3d-widget .i3d-color-lock .i3d-item__icon svg *,
.i3d-widget .i3d-color-lock:hover .i3d-item__icon svg *,
.i3d-widget .i3d-color-lock:focus .i3d-item__icon svg *,
.i3d-widget .i3d-color-lock:active .i3d-item__icon svg * {
    color: var(--i3d-icon-color) !important;
    fill: var(--i3d-icon-color) !important;
}

/* Preserve line-style SVG icons as well. */
.i3d-widget .i3d-color-lock .i3d-item__icon svg [stroke]:not([stroke="none"]),
.i3d-widget .i3d-color-lock:hover .i3d-item__icon svg [stroke]:not([stroke="none"]),
.i3d-widget .i3d-color-lock:focus .i3d-item__icon svg [stroke]:not([stroke="none"]),
.i3d-widget .i3d-color-lock:active .i3d-item__icon svg [stroke]:not([stroke="none"]) {
    stroke: var(--i3d-icon-color) !important;
}

/* Stop theme hover animations/transitions from interpolating to a global link color. */
.i3d-widget .i3d-color-lock .i3d-item__title,
.i3d-widget .i3d-color-lock .i3d-item__icon,
.i3d-widget .i3d-color-lock .i3d-item__icon i,
.i3d-widget .i3d-color-lock .i3d-item__icon i::before,
.i3d-widget .i3d-color-lock .i3d-item__icon svg,
.i3d-widget .i3d-color-lock .i3d-item__icon svg * {
    transition-property: transform, filter, opacity !important;
}

/* Elementor/theme anchor selectors occasionally target direct span/svg children. */
.elementor .i3d-widget a.i3d-color-lock:hover .i3d-item__title,
.elementor .i3d-widget a.i3d-color-lock:focus .i3d-item__title {
    color: var(--i3d-text-color) !important;
    -webkit-text-fill-color: var(--i3d-text-color) !important;
}

.elementor .i3d-widget a.i3d-color-lock:hover .i3d-item__icon,
.elementor .i3d-widget a.i3d-color-lock:hover .i3d-item__icon i,
.elementor .i3d-widget a.i3d-color-lock:hover .i3d-item__icon i::before,
.elementor .i3d-widget a.i3d-color-lock:hover .i3d-item__icon svg,
.elementor .i3d-widget a.i3d-color-lock:hover .i3d-item__icon svg * {
    color: var(--i3d-icon-color) !important;
    -webkit-text-fill-color: var(--i3d-icon-color) !important;
    fill: var(--i3d-icon-color) !important;
}
/* ==========================================================================
   v1.3.3 TRANSPARENT HOVER LOCK
   Prevent global theme/plugin hover rules from painting a card/background
   behind linked industries. The industry action itself must always remain
   transparent; only the orbit UI and active underline belong to this widget.
   ========================================================================== */

.i3d-widget .i3d-color-lock,
.i3d-widget .i3d-color-lock:link,
.i3d-widget .i3d-color-lock:visited,
.i3d-widget .i3d-color-lock:hover,
.i3d-widget .i3d-color-lock:focus,
.i3d-widget .i3d-color-lock:focus-visible,
.i3d-widget .i3d-color-lock:active,
.elementor .i3d-widget a.i3d-color-lock,
.elementor .i3d-widget a.i3d-color-lock:hover,
.elementor .i3d-widget a.i3d-color-lock:focus,
.elementor .i3d-widget a.i3d-color-lock:active,
.elementor .i3d-widget a.i3d-color-lock:visited {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    background-size: 0 0 !important;
    background-position: 0 0 !important;
    border-color: transparent !important;
    box-shadow: none !important;
    text-shadow: none !important;
    outline-color: transparent !important;
}

/* Neutralize theme hover overlays made with anchor pseudo-elements. */
.i3d-widget .i3d-color-lock::before,
.i3d-widget .i3d-color-lock::after,
.i3d-widget .i3d-color-lock:hover::before,
.i3d-widget .i3d-color-lock:hover::after,
.i3d-widget .i3d-color-lock:focus::before,
.i3d-widget .i3d-color-lock:focus::after,
.elementor .i3d-widget a.i3d-color-lock::before,
.elementor .i3d-widget a.i3d-color-lock::after,
.elementor .i3d-widget a.i3d-color-lock:hover::before,
.elementor .i3d-widget a.i3d-color-lock:hover::after {
    content: none !important;
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    border: 0 !important;
}

/* The visual item shell must also remain transparent in every state. */
.i3d-widget .i3d-item,
.i3d-widget .i3d-item:hover,
.i3d-widget .i3d-item:focus-within,
.i3d-widget .i3d-orb,
.i3d-widget .i3d-color-lock:hover .i3d-orb,
.i3d-widget .i3d-color-lock:focus .i3d-orb {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    border-color: transparent !important;
}

/* Keep our own active underline; it belongs to .i3d-orb::before, not the link. */
.i3d-widget .i3d-item.is-active .i3d-orb::before {
    content: "" !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    background: rgba(255,255,255,.96) !important;
    box-shadow: 0 0 20px rgba(255,255,255,.55) !important;
}

/* Avoid animated theme transitions briefly interpolating to a hover background. */
.i3d-widget .i3d-color-lock {
    transition-property: transform, opacity, filter !important;
}