/* XpertLab Sticky Icon — frontend */
.xlsi-sticky {
    position: fixed;
    z-index: 99999;
    display: inline-block;
    width: var(--xlsi-size, 84px);
    height: var(--xlsi-size, 84px);
    line-height: 0;
    text-decoration: none;
    transition: transform .25s ease, opacity .3s ease, visibility 0s linear 0s;
    animation: xlsi-pop-in .35s ease both;
}

.xlsi-sticky:hover { transform: translateY(-3px); }

.xlsi-sticky .xlsi-icon-wrap {
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.xlsi-sticky .xlsi-icon-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Shapes */
.xlsi-shape-circle .xlsi-icon-wrap,
.xlsi-shape-circle .xlsi-icon-wrap img {
    border-radius: 50%;
}
.xlsi-shape-square .xlsi-icon-wrap,
.xlsi-shape-square .xlsi-icon-wrap img {
    border-radius: 18px;
}
.xlsi-shape-original .xlsi-icon-wrap {
    overflow: visible;
}
.xlsi-shape-original .xlsi-icon-wrap img {
    object-fit: contain;
    border-radius: 0;
    background: transparent;
}

/* Shadow */
.xlsi-sticky.xlsi-has-shadow .xlsi-icon-wrap {
    box-shadow: 0 10px 28px rgba(15, 23, 42, .18), 0 2px 6px rgba(15, 23, 42, .08);
}
.xlsi-sticky.xlsi-has-shadow.xlsi-shape-original .xlsi-icon-wrap {
    box-shadow: none;
    filter: drop-shadow(0 8px 18px rgba(15, 23, 42, .22)) drop-shadow(0 2px 4px rgba(15, 23, 42, .12));
}

/* Spin (image-only mode) */
.xlsi-sticky.xlsi-spin .xlsi-icon-wrap img {
    animation: xlsi-spin 14s linear infinite;
}
.xlsi-sticky.xlsi-spin:hover .xlsi-icon-wrap img {
    animation-duration: 4s;
}

/* ─── Rotating Text Badge ─────────────────────────────────────────────── */
.xlsi-sticky.xlsi-badge { position: fixed; }
.xlsi-sticky.xlsi-badge .xlsi-badge-svg {
    width: 100%;
    height: 100%;
    display: block;
    overflow: visible;
}
.xlsi-sticky.xlsi-badge .xlsi-badge-rotor {
    transform-origin: 50% 50%;
    transform-box: view-box;
    animation: xlsi-spin var(--xlsi-rotate-duration, 14s) linear infinite;
}
.xlsi-sticky.xlsi-badge.xlsi-badge-ccw .xlsi-badge-rotor {
    animation-direction: reverse;
}
.xlsi-sticky.xlsi-badge .xlsi-badge-logo {
    position: absolute;
    inset: var(--xlsi-logo-inset, 28%);
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}
.xlsi-sticky.xlsi-badge .xlsi-badge-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}
/* Year counter center */
.xlsi-sticky.xlsi-badge .xlsi-badge-year-counter {
    position: absolute;
    inset: var(--xlsi-logo-inset, 28%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    line-height: 1;
    gap: 0;
}
.xlsi-badge-year-num {
    display: block;
    font-size: calc(var(--xlsi-size, 84px) * 0.28);
    font-weight: 900;
    color: var(--xlsi-year-num-color, #ffffff);
    line-height: 1;
    text-align: center;
}
.xlsi-badge-year-lbl {
    display: block;
    font-size: calc(var(--xlsi-size, 84px) * 0.115);
    font-weight: 700;
    color: var(--xlsi-year-label-color, #ffffff);
    /* text-transform: uppercase; */
    letter-spacing: 0.05em;
    text-align: center;
    margin-top: 0;
}

/* The disc already has its own bg via the SVG circle, so reset wrapper bg */
.xlsi-sticky.xlsi-badge.xlsi-has-shadow {
    filter: drop-shadow(0 8px 18px rgba(15, 23, 42, .22)) drop-shadow(0 2px 4px rgba(15, 23, 42, .12));
}
.xlsi-sticky.xlsi-badge.xlsi-has-shadow .xlsi-icon-wrap { box-shadow: none; }

/* Pulse ring on hover */
.xlsi-sticky.xlsi-pulse { position: fixed; }
.xlsi-sticky.xlsi-pulse::before,
.xlsi-sticky.xlsi-pulse::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
}
.xlsi-sticky.xlsi-pulse.xlsi-shape-circle::before,
.xlsi-sticky.xlsi-pulse.xlsi-shape-circle::after {
    border-radius: 50%;
}
.xlsi-sticky.xlsi-pulse.xlsi-shape-square::before,
.xlsi-sticky.xlsi-pulse.xlsi-shape-square::after {
    border-radius: 18px;
}
.xlsi-sticky.xlsi-pulse::before {
    box-shadow: 0 0 0 0 rgba(34, 113, 177, .35);
    animation: xlsi-pulse 2.2s ease-out infinite;
}
.xlsi-sticky.xlsi-pulse::after {
    box-shadow: 0 0 0 0 rgba(34, 113, 177, .25);
    animation: xlsi-pulse 2.2s ease-out infinite 1.1s;
}

/* Footer-overlap hide state */
.xlsi-sticky.xlsi-is-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(20px) scale(.92);
    transition: opacity .3s ease, transform .3s ease, visibility 0s linear .3s;
}
.xlsi-pos-middle-right.xlsi-is-hidden { transform: translate(20px, -50%) scale(.92); }
.xlsi-pos-middle-left.xlsi-is-hidden  { transform: translate(-20px, -50%) scale(.92); }
.xlsi-pos-top-right.xlsi-is-hidden,
.xlsi-pos-top-left.xlsi-is-hidden     { transform: translateY(-20px) scale(.92); }

/* Positions */
.xlsi-pos-bottom-right { right: var(--xlsi-offset-x, 24px); bottom: var(--xlsi-offset-y, 24px); }
.xlsi-pos-bottom-left  { left:  var(--xlsi-offset-x, 24px); bottom: var(--xlsi-offset-y, 24px); }
.xlsi-pos-top-right    { right: var(--xlsi-offset-x, 24px); top:    var(--xlsi-offset-y, 24px); }
.xlsi-pos-top-left     { left:  var(--xlsi-offset-x, 24px); top:    var(--xlsi-offset-y, 24px); }
.xlsi-pos-middle-right { right: var(--xlsi-offset-x, 24px); top: 50%; transform: translateY(-50%); }
.xlsi-pos-middle-left  { left:  var(--xlsi-offset-x, 24px); top: 50%; transform: translateY(-50%); }
.xlsi-pos-middle-right:hover,
.xlsi-pos-middle-left:hover { transform: translateY(calc(-50% - 3px)); }

/* Mobile */
@media (max-width: 768px) {
    .xlsi-sticky.xlsi-hide-mobile { display: none !important; }
    .xlsi-sticky {
        width: calc(var(--xlsi-size, 84px) * 0.8);
        height: calc(var(--xlsi-size, 84px) * 0.8);
    }
    .xlsi-pos-bottom-right,
    .xlsi-pos-bottom-left { bottom: max(env(safe-area-inset-bottom, 0px), var(--xlsi-offset-y, 16px)); }
}

/* Animations */
@keyframes xlsi-pop-in {
    0%   { opacity: 0; transform: translateY(8px) scale(.92); }
    100% { opacity: 1; transform: translateY(0)   scale(1); }
}
.xlsi-pos-middle-right { animation-name: xlsi-pop-in-right; }
.xlsi-pos-middle-left  { animation-name: xlsi-pop-in-left; }
@keyframes xlsi-pop-in-right {
    0%   { opacity: 0; transform: translate(8px, -50%) scale(.92); }
    100% { opacity: 1; transform: translate(0,    -50%) scale(1); }
}
@keyframes xlsi-pop-in-left {
    0%   { opacity: 0; transform: translate(-8px, -50%) scale(.92); }
    100% { opacity: 1; transform: translate(0,    -50%) scale(1); }
}
@keyframes xlsi-spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
@keyframes xlsi-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(34, 113, 177, .35); }
    70%  { box-shadow: 0 0 0 22px rgba(34, 113, 177, 0); }
    100% { box-shadow: 0 0 0 0 rgba(34, 113, 177, 0); }
}

@media (prefers-reduced-motion: reduce) {
    .xlsi-sticky,
    .xlsi-sticky.xlsi-spin .xlsi-icon-wrap img,
    .xlsi-sticky.xlsi-pulse::before,
    .xlsi-sticky.xlsi-pulse::after { animation: none !important; transition: none !important; }
    .xlsi-sticky:hover { transform: none; }
}