[data-sonner-toaster][dir=ltr],
        html[dir=ltr] {
            --toast-icon-margin-start: -3px;
            --toast-icon-margin-end: 4px;
            --toast-svg-margin-start: -1px;
            --toast-svg-margin-end: 0px;
            --toast-button-margin-start: auto;
            --toast-button-margin-end: 0;
            --toast-close-button-start: 0;
            --toast-close-button-end: unset;
            --toast-close-button-transform: translate(-35%, -35%);
        }

        [data-sonner-toaster][dir=rtl],
        html[dir=rtl] {
            --toast-icon-margin-start: 4px;
            --toast-icon-margin-end: -3px;
            --toast-svg-margin-start: 0px;
            --toast-svg-margin-end: -1px;
            --toast-button-margin-start: 0;
            --toast-button-margin-end: auto;
            --toast-close-button-start: unset;
            --toast-close-button-end: 0;
            --toast-close-button-transform: translate(35%, -35%);
        }

        [data-sonner-toaster] {
            position: fixed;
            width: var(--width);
            font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
            --gray1: hsl(0, 0%, 99%);
            --gray2: hsl(0, 0%, 97.3%);
            --gray3: hsl(0, 0%, 95.1%);
            --gray4: hsl(0, 0%, 93%);
            --gray5: hsl(0, 0%, 90.9%);
            --gray6: hsl(0, 0%, 88.7%);
            --gray7: hsl(0, 0%, 85.8%);
            --gray8: hsl(0, 0%, 78%);
            --gray9: hsl(0, 0%, 56.1%);
            --gray10: hsl(0, 0%, 52.3%);
            --gray11: hsl(0, 0%, 43.5%);
            --gray12: hsl(0, 0%, 9%);
            --border-radius: 8px;
            box-sizing: border-box;
            padding: 0;
            margin: 0;
            list-style: none;
            outline: 0;
            z-index: 999999999;
            transition: transform .4s ease;
        }

        @media (hover:none) and (pointer:coarse) {
            [data-sonner-toaster][data-lifted=true] {
                transform: none;
            }
        }

        [data-sonner-toaster][data-x-position=right] {
            right: var(--offset-right);
        }

        [data-sonner-toaster][data-x-position=left] {
            left: var(--offset-left);
        }

        [data-sonner-toaster][data-x-position=center] {
            left: 50%;
            transform: translateX(-50%);
        }

        [data-sonner-toaster][data-y-position=top] {
            top: var(--offset-top);
        }

        [data-sonner-toaster][data-y-position=bottom] {
            bottom: var(--offset-bottom);
        }

        [data-sonner-toast] {
            --y: translateY(100%);
            --lift-amount: calc(var(--lift) * var(--gap));
            z-index: var(--z-index);
            position: absolute;
            opacity: 0;
            transform: var(--y);
            touch-action: none;
            transition: transform .4s, opacity .4s, height .4s, box-shadow .2s;
            box-sizing: border-box;
            outline: 0;
            overflow-wrap: anywhere;
        }

        [data-sonner-toast][data-styled=true] {
            padding: 16px;
            background: var(--normal-bg);
            border: 1px solid var(--normal-border);
            color: var(--normal-text);
            border-radius: var(--border-radius);
            box-shadow: 0 4px 12px rgba(0, 0, 0, .1);
            width: var(--width);
            font-size: 13px;
            display: flex;
            align-items: center;
            gap: 6px;
        }

        [data-sonner-toast]:focus-visible {
            box-shadow: 0 4px 12px rgba(0, 0, 0, .1), 0 0 0 2px rgba(0, 0, 0, .2);
        }

        [data-sonner-toast][data-y-position=top] {
            top: 0;
            --y: translateY(-100%);
            --lift: 1;
            --lift-amount: calc(1 * var(--gap));
        }

        [data-sonner-toast][data-y-position=bottom] {
            bottom: 0;
            --y: translateY(100%);
            --lift: -1;
            --lift-amount: calc(var(--lift) * var(--gap));
        }

        [data-sonner-toast][data-styled=true] [data-description] {
            font-weight: 400;
            line-height: 1.4;
            color: #3f3f3f;
        }

        [data-rich-colors=true][data-sonner-toast][data-styled=true] [data-description] {
            color: inherit;
        }

        [data-sonner-toaster][data-sonner-theme=dark] [data-description] {
            color: #e8e8e8;
        }

        [data-sonner-toast][data-styled=true] [data-title] {
            font-weight: 500;
            line-height: 1.5;
            color: inherit;
        }

        [data-sonner-toast][data-styled=true] [data-icon] {
            display: flex;
            height: 16px;
            width: 16px;
            position: relative;
            justify-content: flex-start;
            align-items: center;
            flex-shrink: 0;
            margin-left: var(--toast-icon-margin-start);
            margin-right: var(--toast-icon-margin-end);
        }

        [data-sonner-toast][data-promise=true] [data-icon]>svg {
            opacity: 0;
            transform: scale(.8);
            transform-origin: center;
            animation: sonner-fade-in .3s ease forwards;
        }

        [data-sonner-toast][data-styled=true] [data-icon]>* {
            flex-shrink: 0;
        }

        [data-sonner-toast][data-styled=true] [data-icon] svg {
            margin-left: var(--toast-svg-margin-start);
            margin-right: var(--toast-svg-margin-end);
        }

        [data-sonner-toast][data-styled=true] [data-content] {
            display: flex;
            flex-direction: column;
            gap: 2px;
        }

        [data-sonner-toast][data-styled=true] [data-button] {
            border-radius: 4px;
            padding-left: 8px;
            padding-right: 8px;
            height: 24px;
            font-size: 12px;
            color: var(--normal-bg);
            background: var(--normal-text);
            margin-left: var(--toast-button-margin-start);
            margin-right: var(--toast-button-margin-end);
            border: none;
            font-weight: 500;
            cursor: pointer;
            outline: 0;
            display: flex;
            align-items: center;
            flex-shrink: 0;
            transition: opacity .4s, box-shadow .2s;
        }

        [data-sonner-toast][data-styled=true] [data-button]:focus-visible {
            box-shadow: 0 0 0 2px rgba(0, 0, 0, .4);
        }

        [data-sonner-toast][data-styled=true] [data-button]:first-of-type {
            margin-left: var(--toast-button-margin-start);
            margin-right: var(--toast-button-margin-end);
        }

        [data-sonner-toast][data-styled=true] [data-cancel] {
            color: var(--normal-text);
            background: rgba(0, 0, 0, .08);
        }

        [data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast][data-styled=true] [data-cancel] {
            background: rgba(255, 255, 255, .3);
        }

        [data-sonner-toast][data-styled=true] [data-close-button] {
            position: absolute;
            left: var(--toast-close-button-start);
            right: var(--toast-close-button-end);
            top: 0;
            height: 20px;
            width: 20px;
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 0;
            color: var(--gray12);
            background: var(--normal-bg);
            border: 1px solid var(--gray4);
            transform: var(--toast-close-button-transform);
            border-radius: 50%;
            cursor: pointer;
            z-index: 1;
            transition: opacity .1s, background .2s, border-color .2s;
        }

        [data-sonner-toast][data-styled=true] [data-close-button]:focus-visible {
            box-shadow: 0 4px 12px rgba(0, 0, 0, .1), 0 0 0 2px rgba(0, 0, 0, .2);
        }

        [data-sonner-toast][data-styled=true] [data-disabled=true] {
            cursor: not-allowed;
        }

        [data-sonner-toast][data-styled=true]:hover [data-close-button]:hover {
            background: var(--gray2);
            border-color: var(--gray5);
        }

        [data-sonner-toast][data-swiping=true]::before {
            content: '';
            position: absolute;
            left: -100%;
            right: -100%;
            height: 100%;
            z-index: -1;
        }

        [data-sonner-toast][data-y-position=top][data-swiping=true]::before {
            bottom: 50%;
            transform: scaleY(3) translateY(50%);
        }

        [data-sonner-toast][data-y-position=bottom][data-swiping=true]::before {
            top: 50%;
            transform: scaleY(3) translateY(-50%);
        }

        [data-sonner-toast][data-swiping=false][data-removed=true]::before {
            content: '';
            position: absolute;
            inset: 0;
            transform: scaleY(2);
        }

        [data-sonner-toast][data-expanded=true]::after {
            content: '';
            position: absolute;
            left: 0;
            height: calc(var(--gap) + 1px);
            bottom: 100%;
            width: 100%;
        }

        [data-sonner-toast][data-mounted=true] {
            --y: translateY(0);
            opacity: 1;
        }

        [data-sonner-toast][data-expanded=false][data-front=false] {
            --scale: var(--toasts-before) * 0.05 + 1;
            --y: translateY(calc(var(--lift-amount) * var(--toasts-before))) scale(calc(-1 * var(--scale)));
            height: var(--front-toast-height);
        }

        [data-sonner-toast]>* {
            transition: opacity .4s;
        }

        [data-sonner-toast][data-x-position=right] {
            right: 0;
        }

        [data-sonner-toast][data-x-position=left] {
            left: 0;
        }

        [data-sonner-toast][data-expanded=false][data-front=false][data-styled=true]>* {
            opacity: 0;
        }

        [data-sonner-toast][data-visible=false] {
            opacity: 0;
            pointer-events: none;
        }

        [data-sonner-toast][data-mounted=true][data-expanded=true] {
            --y: translateY(calc(var(--lift) * var(--offset)));
            height: var(--initial-height);
        }

        [data-sonner-toast][data-removed=true][data-front=true][data-swipe-out=false] {
            --y: translateY(calc(var(--lift) * -100%));
            opacity: 0;
        }

        [data-sonner-toast][data-removed=true][data-front=false][data-swipe-out=false][data-expanded=true] {
            --y: translateY(calc(var(--lift) * var(--offset) + var(--lift) * -100%));
            opacity: 0;
        }

        [data-sonner-toast][data-removed=true][data-front=false][data-swipe-out=false][data-expanded=false] {
            --y: translateY(40%);
            opacity: 0;
            transition: transform .5s, opacity .2s;
        }

        [data-sonner-toast][data-removed=true][data-front=false]::before {
            height: calc(var(--initial-height) + 20%);
        }

        [data-sonner-toast][data-swiping=true] {
            transform: var(--y) translateY(var(--swipe-amount-y, 0)) translateX(var(--swipe-amount-x, 0));
            transition: none;
        }

        [data-sonner-toast][data-swiped=true] {
            user-select: none;
        }

        [data-sonner-toast][data-swipe-out=true][data-y-position=bottom],
        [data-sonner-toast][data-swipe-out=true][data-y-position=top] {
            animation-duration: .2s;
            animation-timing-function: ease-out;
            animation-fill-mode: forwards;
        }

        [data-sonner-toast][data-swipe-out=true][data-swipe-direction=left] {
            animation-name: swipe-out-left;
        }

        [data-sonner-toast][data-swipe-out=true][data-swipe-direction=right] {
            animation-name: swipe-out-right;
        }

        [data-sonner-toast][data-swipe-out=true][data-swipe-direction=up] {
            animation-name: swipe-out-up;
        }

        [data-sonner-toast][data-swipe-out=true][data-swipe-direction=down] {
            animation-name: swipe-out-down;
        }

        @keyframes swipe-out-left {
            from {
                transform: var(--y) translateX(var(--swipe-amount-x));
                opacity: 1;
            }

            to {
                transform: var(--y) translateX(calc(var(--swipe-amount-x) - 100%));
                opacity: 0;
            }
        }

        @keyframes swipe-out-right {
            from {
                transform: var(--y) translateX(var(--swipe-amount-x));
                opacity: 1;
            }

            to {
                transform: var(--y) translateX(calc(var(--swipe-amount-x) + 100%));
                opacity: 0;
            }
        }

        @keyframes swipe-out-up {
            from {
                transform: var(--y) translateY(var(--swipe-amount-y));
                opacity: 1;
            }

            to {
                transform: var(--y) translateY(calc(var(--swipe-amount-y) - 100%));
                opacity: 0;
            }
        }

        @keyframes swipe-out-down {
            from {
                transform: var(--y) translateY(var(--swipe-amount-y));
                opacity: 1;
            }

            to {
                transform: var(--y) translateY(calc(var(--swipe-amount-y) + 100%));
                opacity: 0;
            }
        }

        @media (max-width:600px) {
            [data-sonner-toaster] {
                position: fixed;
                right: var(--mobile-offset-right);
                left: var(--mobile-offset-left);
                width: 100%;
            }

            [data-sonner-toaster][dir=rtl] {
                left: calc(var(--mobile-offset-left) * -1);
            }

            [data-sonner-toaster] [data-sonner-toast] {
                left: 0;
                right: 0;
                width: calc(100% - var(--mobile-offset-left) * 2);
            }

            [data-sonner-toaster][data-x-position=left] {
                left: var(--mobile-offset-left);
            }

            [data-sonner-toaster][data-y-position=bottom] {
                bottom: var(--mobile-offset-bottom);
            }

            [data-sonner-toaster][data-y-position=top] {
                top: var(--mobile-offset-top);
            }

            [data-sonner-toaster][data-x-position=center] {
                left: var(--mobile-offset-left);
                right: var(--mobile-offset-right);
                transform: none;
            }
        }

        [data-sonner-toaster][data-sonner-theme=light] {
            --normal-bg: #fff;
            --normal-border: var(--gray4);
            --normal-text: var(--gray12);
            --success-bg: hsl(143, 85%, 96%);
            --success-border: hsl(145, 92%, 87%);
            --success-text: hsl(140, 100%, 27%);
            --info-bg: hsl(208, 100%, 97%);
            --info-border: hsl(221, 91%, 93%);
            --info-text: hsl(210, 92%, 45%);
            --warning-bg: hsl(49, 100%, 97%);
            --warning-border: hsl(49, 91%, 84%);
            --warning-text: hsl(31, 92%, 45%);
            --error-bg: hsl(359, 100%, 97%);
            --error-border: hsl(359, 100%, 94%);
            --error-text: hsl(360, 100%, 45%);
        }

        [data-sonner-toaster][data-sonner-theme=light] [data-sonner-toast][data-invert=true] {
            --normal-bg: #000;
            --normal-border: hsl(0, 0%, 20%);
            --normal-text: var(--gray1);
        }

        [data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast][data-invert=true] {
            --normal-bg: #fff;
            --normal-border: var(--gray3);
            --normal-text: var(--gray12);
        }

        [data-sonner-toaster][data-sonner-theme=dark] {
            --normal-bg: #000;
            --normal-bg-hover: hsl(0, 0%, 12%);
            --normal-border: hsl(0, 0%, 20%);
            --normal-border-hover: hsl(0, 0%, 25%);
            --normal-text: var(--gray1);
            --success-bg: hsl(150, 100%, 6%);
            --success-border: hsl(147, 100%, 12%);
            --success-text: hsl(150, 86%, 65%);
            --info-bg: hsl(215, 100%, 6%);
            --info-border: hsl(223, 43%, 17%);
            --info-text: hsl(216, 87%, 65%);
            --warning-bg: hsl(64, 100%, 6%);
            --warning-border: hsl(60, 100%, 9%);
            --warning-text: hsl(46, 87%, 65%);
            --error-bg: hsl(358, 76%, 10%);
            --error-border: hsl(357, 89%, 16%);
            --error-text: hsl(358, 100%, 81%)
        }

        [data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast] [data-close-button] {
            background: var(--normal-bg);
            border-color: var(--normal-border);
            color: var(--normal-text)
        }

        [data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast] [data-close-button]:hover {
            background: var(--normal-bg-hover);
            border-color: var(--normal-border-hover)
        }

        [data-rich-colors=true][data-sonner-toast][data-type=success] {
            background: var(--success-bg);
            border-color: var(--success-border);
            color: var(--success-text)
        }

        [data-rich-colors=true][data-sonner-toast][data-type=success] [data-close-button] {
            background: var(--success-bg);
            border-color: var(--success-border);
            color: var(--success-text)
        }

        [data-rich-colors=true][data-sonner-toast][data-type=info] {
            background: var(--info-bg);
            border-color: var(--info-border);
            color: var(--info-text)
        }

        [data-rich-colors=true][data-sonner-toast][data-type=info] [data-close-button] {
            background: var(--info-bg);
            border-color: var(--info-border);
            color: var(--info-text)
        }

        [data-rich-colors=true][data-sonner-toast][data-type=warning] {
            background: var(--warning-bg);
            border-color: var(--warning-border);
            color: var(--warning-text)
        }

        [data-rich-colors=true][data-sonner-toast][data-type=warning] [data-close-button] {
            background: var(--warning-bg);
            border-color: var(--warning-border);
            color: var(--warning-text)
        }

        [data-rich-colors=true][data-sonner-toast][data-type=error] {
            background: var(--error-bg);
            border-color: var(--error-border);
            color: var(--error-text)
        }

        [data-rich-colors=true][data-sonner-toast][data-type=error] [data-close-button] {
            background: var(--error-bg);
            border-color: var(--error-border);
            color: var(--error-text)
        }

        .sonner-loading-wrapper {
            --size: 16px;
            height: var(--size);
            width: var(--size);
            position: absolute;
            inset: 0;
            z-index: 10
        }

        .sonner-loading-wrapper[data-visible=false] {
            transform-origin: center;
            animation: sonner-fade-out .2s ease forwards
        }

        .sonner-spinner {
            position: relative;
            top: 50%;
            left: 50%;
            height: var(--size);
            width: var(--size)
        }

        .sonner-loading-bar {
            animation: sonner-spin 1.2s linear infinite;
            background: var(--gray11);
            border-radius: 6px;
            height: 8%;
            left: -10%;
            position: absolute;
            top: -3.9%;
            width: 24%
        }

        .sonner-loading-bar:first-child {
            animation-delay: -1.2s;
            transform: rotate(.0001deg) translate(146%)
        }

        .sonner-loading-bar:nth-child(2) {
            animation-delay: -1.1s;
            transform: rotate(30deg) translate(146%)
        }

        .sonner-loading-bar:nth-child(3) {
            animation-delay: -1s;
            transform: rotate(60deg) translate(146%)
        }

        .sonner-loading-bar:nth-child(4) {
            animation-delay: -.9s;
            transform: rotate(90deg) translate(146%)
        }

        .sonner-loading-bar:nth-child(5) {
            animation-delay: -.8s;
            transform: rotate(120deg) translate(146%)
        }

        .sonner-loading-bar:nth-child(6) {
            animation-delay: -.7s;
            transform: rotate(150deg) translate(146%)
        }

        .sonner-loading-bar:nth-child(7) {
            animation-delay: -.6s;
            transform: rotate(180deg) translate(146%)
        }

        .sonner-loading-bar:nth-child(8) {
            animation-delay: -.5s;
            transform: rotate(210deg) translate(146%)
        }

        .sonner-loading-bar:nth-child(9) {
            animation-delay: -.4s;
            transform: rotate(240deg) translate(146%)
        }

        .sonner-loading-bar:nth-child(10) {
            animation-delay: -.3s;
            transform: rotate(270deg) translate(146%)
        }

        .sonner-loading-bar:nth-child(11) {
            animation-delay: -.2s;
            transform: rotate(300deg) translate(146%)
        }

        .sonner-loading-bar:nth-child(12) {
            animation-delay: -.1s;
            transform: rotate(330deg) translate(146%)
        }

        @keyframes sonner-fade-in {
            0% {
                opacity: 0;
                transform: scale(.8)
            }

            100% {
                opacity: 1;
                transform: scale(1)
            }
        }

        @keyframes sonner-fade-out {
            0% {
                opacity: 1;
                transform: scale(1)
            }

            100% {
                opacity: 0;
                transform: scale(.8)
            }
        }

        @keyframes sonner-spin {
            0% {
                opacity: 1
            }

            100% {
                opacity: .15
            }
        }

        @media (prefers-reduced-motion) {

            .sonner-loading-bar,
            [data-sonner-toast],
            [data-sonner-toast]>* {
                transition: none !important;
                animation: none !important
            }
        }

        .sonner-loader {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            transform-origin: center;
            transition: opacity .2s, transform .2s
        }

        .sonner-loader[data-visible=false] {
            opacity: 0;
            transform: scale(.8) translate(-50%, -50%)
        }

          .mobile-break {
                    display: none;
                }

                @media (max-width: 768px) {
                    .mobile-break {
                        display: inline;
                    }
                }

                /* Animations — GPU-composited with will-change for smooth 60fps */
                .fade-up {
                    opacity: 0;
                    transform: translateY(20px);
                    animation: fadeUp 0.6s cubic-bezier(0.25, 0.1, 0.25, 1) forwards;
                    will-change: opacity, transform;
                }

                @keyframes fadeUp {
                    to {
                        opacity: 1;
                        transform: translateY(0);
                    }
                }

                .d1 {
                    animation-delay: 0.1s;
                }

                .d2 {
                    animation-delay: 0.2s;
                }

                .d3 {
                    animation-delay: 0.3s;
                }

                .d4 {
                    animation-delay: 0.4s;
                }

                .d5 {
                    animation-delay: 0.5s;
                }

                .d6 {
                    animation-delay: 0.6s;
                }

                .d7 {
                    animation-delay: 0.7s;
                }

                /* Scroll-reveal animation — GPU-composited */
                .scroll-reveal {
                    opacity: 0;
                    transform: translateY(24px);
                    transition: opacity 0.7s cubic-bezier(0.25, 0.1, 0.25, 1), transform 0.7s cubic-bezier(0.25, 0.1, 0.25, 1);
                    will-change: opacity, transform;
                }

                .scroll-reveal.revealed {
                    opacity: 1;
                    transform: translateY(0);
                    will-change: auto;
                }

                .scroll-reveal.sr-d1 {
                    transition-delay: 0.1s;
                }

                .scroll-reveal.sr-d2 {
                    transition-delay: 0.2s;
                }

                .scroll-reveal.sr-d3 {
                    transition-delay: 0.3s;
                }

                .scroll-reveal.sr-d4 {
                    transition-delay: 0.4s;
                }

                .scroll-reveal.sr-d5 {
                    transition-delay: 0.5s;
                }

                /* Respect reduced motion preferences */
                @media (prefers-reduced-motion: reduce) {
                    .fade-up {
                        animation: none !important;
                        opacity: 1 !important;
                        transform: none !important;
                    }

                    .scroll-reveal {
                        transition: none !important;
                        opacity: 1 !important;
                        transform: none !important;
                    }

                    .marquee-track {
                        animation: none !important;
                    }

                    .pulse-dot {
                        animation: none !important;
                    }
                }

                /* Pulse dot animation */
                @keyframes pulse {

                    0%,
                    100% {
                        opacity: 1;
                    }

                    50% {
                        opacity: 0.4;
                    }
                }

                .pulse-dot {
                    animation: pulse 2s ease-in-out infinite;
                }



                /* Float animation for channel icons */
                @keyframes float {

                    0%,
                    100% {
                        transform: translateY(0px);
                    }

                    50% {
                        transform: translateY(-12px);
                    }
                }

                /* Infinite marquee animation */
                @-webkit-keyframes marqueeScroll {
                    0% {
                        -webkit-transform: translateX(0);
                        transform: translateX(0);
                    }

                    100% {
                        -webkit-transform: translateX(-33.333%);
                        transform: translateX(-33.333%);
                    }
                }

                @keyframes marqueeScroll {
                    0% {
                        -webkit-transform: translateX(0);
                        transform: translateX(0);
                    }

                    100% {
                        -webkit-transform: translateX(-33.333%);
                        transform: translateX(-33.333%);
                    }
                }

                .marquee-track {
                    -webkit-animation: marqueeScroll 35s linear infinite;
                    animation: marqueeScroll 35s linear infinite;
                    will-change: transform;
                    -webkit-transform: translateZ(0);
                    transform: translateZ(0);
                    -webkit-backface-visibility: hidden;
                    backface-visibility: hidden;
                }

                /* ============ RESPONSIVE ============ */

                /* Hide side graphics on smaller screens */
                @media (max-width: 1024px) {

                    .side-graphics-left,
                    .side-graphics-right {
                        display: none !important;
                    }
                }

                /* --- Tablet landscape / small desktop (1024px) --- */
                @media (max-width: 1024px) {
                    #hero {
                        padding-top: 64px !important;
                    }

                    .hero-grid {
                        grid-template-columns: 1fr !important;
                        gap: 40px !important;
                        text-align: center !important;
                    }

                    .hero-content {
                        padding-bottom: 0 !important;
                        align-items: center !important;
                        display: flex !important;
                        flex-direction: column !important;
                    }

                    .hero-bullets {
                        align-items: flex-start !important;
                    }

                    .hero-visual-desktop {
                        max-width: 600px !important;
                        margin: 0 auto !important;
                    }

                    .client-grid {
                        grid-template-columns: repeat(4, 1fr) !important;
                    }

                    .stat-cards-grid {
                        grid-template-columns: 1fr 1fr !important;
                    }

                    .stat-cards-grid>div {
                        border-color: #E2E8F0 !important;
                    }

                    .email-compare-grid {
                        gap: 20px !important;
                    }

                    .testimonial-grid {
                        grid-template-columns: 1fr 1fr !important;
                    }

                    .pricing-table-header {
                        padding: 32px 36px !important;
                    }

                    .pricing-columns {
                        grid-template-columns: repeat(3, 1fr) !important;
                    }

                    /* Testimonial carousel — smaller cards on tablet */
                    .testimonial-card {
                        flex: 0 0 340px !important;
                        min-height: 300px !important;
                        padding: 28px 24px !important;
                    }

                    .testimonial-card h4 {
                        font-size: 14px !important;
                    }

                    /* Comparison grids — stack on tablet too for readability */
                    .comparison-grid {
                        grid-template-columns: 1fr !important;
                        gap: 36px !important;
                    }

                    .comparison-them {
                        border-right: none !important;
                        border-bottom: 2px solid rgba(148, 163, 184, 0.25) !important;
                        padding-bottom: 32px !important;
                    }

                    /* Email compare — stack on tablet */
                    .email-compare-grid {
                        grid-template-columns: 1fr !important;
                        gap: 24px !important;
                    }

                    /* Section #2 dark bg — visible divider on stacked cards */
                    #lead-quality .comparison-grid {
                        gap: 0 !important;
                        max-width: 600px !important;
                        margin: 0 auto !important;
                    }

                    #lead-quality .comparison-them {
                        padding: 0 32px 32px 32px !important;
                        border-bottom: 2px solid rgba(96, 165, 250, 0.2) !important;
                        max-width: 100% !important;
                    }

                    #lead-quality .comparison-us {
                        padding: 32px 32px 0 32px !important;
                        border-bottom: none !important;
                    }

                    /* Vertical pipeline spacing for tablet */
                    .pipeline-vertical {
                        flex-direction: column !important;
                        align-items: center !important;
                        padding: 0 !important;
                    }

                    /* Center bounce rate stat on tablet */
                    .pipeline-stat {
                        justify-content: center !important;
                        margin-top: 32px !important;
                    }

                    /* Section #6 dark bg — visible divider on stacked cards */
                    #crm-sync .comparison-grid {
                        max-width: 600px !important;
                        margin: 0 auto !important;
                    }

                    #crm-sync .comparison-them {
                        padding: 0 32px 28px 32px !important;
                        border-bottom: 2px solid rgba(96, 165, 250, 0.2) !important;
                    }

                    #crm-sync .comparison-us {
                        padding: 28px 32px 0 32px !important;
                        border-bottom: none !important;
                    }

                    /* Vertical pipeline on tablet too */
                    .pipeline-horizontal {
                        display: none !important;
                    }

                    .pipeline-vertical {
                        display: flex !important;
                    }

                    /* Reduce section padding on tablet */
                    section {
                        padding-top: 72px !important;
                        padding-bottom: 72px !important;
                    }

                    #social-proof {
                        padding-top: 40px !important;
                        padding-bottom: 40px !important;
                    }

                    #hero {
                        padding-top: 80px !important;
                        padding-bottom: 48px !important;
                    }
                }

                /* --- Tablet portrait / large phone (768px) --- */
                @media (max-width: 768px) {
                    /* Nav styles moved to global index.css */

                    /* Hero */
                    #hero {
                        padding-top: 96px !important;
                    }

                    .hero-grid {
                        gap: 28px !important;
                        display: flex !important;
                        flex-direction: column !important;
                    }

                    .hero-content {
                        order: unset !important;
                    }

                    .hero-visual-desktop {
                        max-width: 100% !important;
                        margin: 0 auto !important;
                    }

                    /* Logo grid */
                    .client-grid {
                        grid-template-columns: repeat(3, 1fr) !important;
                        gap: 16px !important;
                    }

                    /* All comparison grids stack */
                    .comparison-grid {
                        grid-template-columns: 1fr !important;
                        gap: 32px !important;
                    }

                    .comparison-them {
                        border-right: none !important;
                        border-bottom: 2px solid rgba(148, 163, 184, 0.25) !important;
                        padding: 0 0 28px 0 !important;
                    }

                    .comparison-us {
                        padding: 28px 0 0 0 !important;
                    }

                    /* Section          /* Section #5 — visible divider on stacked cards */
                    #campaign-mgmt .comparison-grid {
                        max-width: 600px !important;
                        margin: 0 auto !important;
                    }

                    #campaign-mgmt .comparison-them {
                        padding: 0 32px 28px 32px !important;
                        border-bottom: 2px solid rgba(100, 116, 139, 0.2) !important;
                    }

                    #campaign-mgmt .comparison-us {
                        padding: 28px 32px 0 32px !important;
                        border-bottom: none !important;
                    }

                    #lead-quality .comparison-grid {
                        gap: 32px !important;
                    }

                    /* Section #2: center all content within pipeline cards on mobile */
                    #lead-quality .pipeline-competitor,
                    #lead-quality .pipeline-leadbird {
                        display: flex !important;
                        flex-direction: column !important;
                        align-items: center !important;
                        text-align: center !important;
                        padding: 0 16px !important;
                        max-width: 100% !important;
                        border-right: none !important;
                    }

                    /* Center the header row (dot + label) */
                    #lead-quality .pipeline-competitor>div:first-child,
                    #lead-quality .pipeline-leadbird>div:first-child {
                        justify-content: center !important;
                    }

                    /* Center pipeline circle rows */
                    .pipeline-circle-row {
                        justify-content: center !important;
                    }

                    /* Center pipeline labels */
                    .pipeline-labels-row {
                        justify-content: center !important;
                    }

                    /* Hide horizontal pipeline, show vertical on mobile */
                    .pipeline-horizontal {
                        display: none !important;
                    }

                    .pipeline-vertical {
                        display: flex !important;
                        flex-direction: column !important;
                        align-items: center !important;
                    }

                    /* Stack trusted-by badge vertically on mobile */
                    .trusted-by-bar {
                        flex-direction: column !important;
                        gap: 8px !important;
                    }

                    .trusted-by-bar p {
                        text-align: center !important;
                    }

                    /* Center problems/benefits list */
                    .pipeline-list {
                        align-items: center !important;
                    }

                    /* Center bounce rate row */
                    .pipeline-stat {
                        justify-content: center !important;
                        margin-top: 32px !important;
                    }

                    /* Section #1 — visible divider on stacked cards */
                    .comparison-grid {
                        grid-template-columns: 1fr !important;
                        gap: 24px !important;
                        max-width: 600px !important;
                        margin: 0 auto !important;
                    }

                    .comparison-them {
                        padding: 0 32px 28px 32px !important;
                        border-bottom: 2px solid rgba(100, 116, 139, 0.2) !important;
                    }

                    .comparison-us {
                        padding: 28px 32px 0 32px !important;
                        border-bottom: none !important;
                    }

                    /* CRM lead cards — tag + action wrap on mobile */
                    #crm-sync [style*="space-between"] {
                        flex-wrap: wrap !important;
                        gap: 6px !important;
                    }

                    /* Email compare grid stacks */
                    .email-compare-grid {
                        grid-template-columns: 1fr !important;
                        gap: 24px !important;
                    }

                    /* Pricing table responsive */
                    .pricing-table-header {
                        flex-direction: column !important;
                        text-align: center !important;
                        padding: 28px 24px !important;
                    }

                    .pricing-columns {
                        grid-template-columns: 1fr !important;
                    }

                    .pricing-columns>div {
                        border-left: none !important;
                        border-bottom: 1px solid #E2E8F0 !important;
                    }

                    .pricing-columns>div:last-child {
                        border-bottom: none !important;
                    }

                    /* Stat cards stack to 1 col */
                    .stat-cards-grid {
                        grid-template-columns: 1fr !important;
                    }

                    .stat-cards-grid>div {
                        border-right: none !important;
                        border-bottom: 1px solid #E2E8F0 !important;
                        padding: 20px 16px !important;
                    }

                    .stat-cards-grid>div:last-child {
                        border-bottom: none !important;
                    }

                    /* Testimonials stack */
                    .testimonial-grid {
                        grid-template-columns: 1fr !important;
                        gap: 16px !important;
                    }

                    /* Testimonial carousel — one full card per scroll on mobile */
                    .results-carousel {
                        padding-left: 20px !important;
                        padding-right: 20px !important;
                        scroll-snap-type: x mandatory !important;
                        gap: 16px !important;
                        scroll-padding-left: 20px !important;
                    }

                    .results-carousel>div:first-child {
                        flex: 0 0 0px !important;
                        display: none !important;
                    }

                    .testimonial-card {
                        flex: 0 0 calc(100vw - 56px) !important;
                        scroll-snap-align: start !important;
                    }

                    /* Infrastructure section bullet points — tighter on mobile */
                    .infra-bullets {
                        gap: 10px !important;
                    }

                    .infra-bullets>div span {
                        font-size: 13px !important;
                    }

                    /* Section #7 dashboard — hide HTML mockup, show PNG on mobile */
                    .dashboard-mockup {
                        display: none !important;
                    }

                    .dashboard-mobile-img {
                        display: block !important;
                    }

                    /* KPI grid — 2x2 on tablet/mobile */
                    .kpi-grid {
                        grid-template-columns: 1fr 1fr !important;
                    }

                    /* Chart grid — stack on mobile */
                    .chart-grid {
                        grid-template-columns: 1fr !important;
                    }

                    /* Campaign breakdown — single column on mobile */
                    .campaign-breakdown-grid {
                        grid-template-columns: 1fr !important;
                    }

                    /* Section #6 CRM lead cards - stack tag + action */
                    .comparison-grid [style*="justifyContent"] {
                        flex-wrap: wrap !important;
                    }

                    /* KPI grid: 2x2 on mobile */
                    .kpi-grid {
                        grid-template-columns: 1fr 1fr !important;
                    }

                    /* Campaign breakdown: stack on mobile */
                    .campaign-breakdown-grid {
                        grid-template-columns: 1fr !important;
                    }

                    /* Pipeline competitor remove maxWidth on mobile */
                    .pipeline-competitor {
                        max-width: 100% !important;
                        padding: 0 16px !important;
                        border-right: none !important;
                    }

                    .pipeline-leadbird {
                        padding: 0 16px !important;
                    }

                    /* Section #2 pipeline cards — center and prevent overflow on mobile */
                    .comparison-grid>div {
                        max-width: 100% !important;
                        overflow: hidden !important;
                    }

                    /* Ensure vertical pipeline is visible on small mobile too */
                    .pipeline-vertical {
                        display: flex !important;
                        flex-direction: column !important;
                        align-items: center !important;
                    }

                    .pipeline-horizontal {
                        display: none !important;
                    }

                    /* Prevent horizontal overflow on all sections */
                    section {
                        overflow-x: hidden !important;
                    }

                    /* Section subtitles tighter */
                    h2 {
                        font-size: clamp(30px, 5.5vw, 42px) !important;
                    }

                    /* Reduce section padding on mobile */
                    section {
                        padding-top: 56px !important;
                        padding-bottom: 56px !important;
                    }

                    #social-proof {
                        padding-top: 32px !important;
                        padding-bottom: 32px !important;
                    }

                    #hero {
                        padding-top: 104px !important;
                        padding-bottom: 40px !important;
                    }

                    /* Footer stacks */
                }

                /* --- Mobile (480px) --- */
                @media (max-width: 480px) {

                    /* Logo grid tighter */
                    .client-grid {
                        grid-template-columns: repeat(2, 1fr) !important;
                        gap: 10px !important;
                    }

                    /* Stat cards single col */
                    .stat-cards-grid {
                        grid-template-columns: 1fr !important;
                    }

                    .stat-cards-grid>div {
                        border-right: none !important;
                        border-bottom: 1px solid #E2E8F0 !important;
                        padding: 18px 16px !important;
                    }

                    .stat-cards-grid>div:last-child {
                        border-bottom: none !important;
                    }

                    /* Dashboard — PNG already shown from 768px breakpoint */

                    /* Tighter section padding */
                    section {
                        padding-top: 40px !important;
                        padding-bottom: 40px !important;
                    }

                    #social-proof {
                        padding-top: 24px !important;
                        padding-bottom: 24px !important;
                    }

                    #hero {
                        padding-top: 56px !important;
                        padding-bottom: 32px !important;
                    }

                    /* Closing CTA — compact mobile */
                    #book {
                        padding: 24px 0 !important;
                    }

                    .cta-card {
                        padding: 24px 16px !important;
                        border-radius: 14px !important;
                    }

                    .cta-heading {
                        margin: 0 auto 6px !important;
                        font-size: clamp(26px, 7vw, 36px) !important;
                    }

                    .cta-subtitle {
                        margin: 0 auto 16px !important;
                        font-size: 13px !important;
                        line-height: 1.3 !important;
                    }

                    .cta-buttons {
                        gap: 8px !important;
                    }

                    .cta-buttons a {
                        padding: 10px 22px !important;
                        font-size: 13px !important;
                    }

                    .trusted-by-bar {
                        margin-top: 14px !important;
                        gap: 6px !important;
                    }

                    .trusted-by-bar img {
                        width: 30px !important;
                        height: 30px !important;
                    }

                    .trusted-by-bar p {
                        font-size: 12px !important;
                    }

                    /* Hero visual full width */
                    .hero-visual-desktop {
                        max-width: 100% !important;
                        margin: 0 auto !important;
                    }

                    /* Play button smaller */
                    .play-btn {
                        width: 56px !important;
                        height: 56px !important;
                    }

                    .play-btn svg {
                        width: 18px !important;
                        height: 18px !important;
                    }

                    /* Headings bigger on mobile */
                    h2 {
                        font-size: clamp(28px, 7vw, 36px) !important;
                        line-height: 1.1 !important;
                    }

                    h1 {
                        font-size: clamp(36px, 10vw, 48px) !important;
                        line-height: 1.1 !important;
                    }

                    /* CTA buttons stack on mobile */
                    .hero-content [style*="flexWrap"] {
                        flex-direction: column !important;
                        width: 100% !important;
                    }

                    .hero-content [style*="flexWrap"] a {
                        width: 100% !important;
                        text-align: center !important;
                        justify-content: center !important;
                    }

                    /* Rating badge responsive on mobile */
                    .rating-badge {
                        gap: 8px !important;
                        flex-wrap: wrap !important;
                        justify-content: center !important;
                    }

                    .pulse-dot {
                        display: none !important;
                    }

                    .rating-content {
                        gap: 10px !important;
                        justify-content: center !important;
                    }

                    .rating-text,
                    .rating-clients {
                        font-size: 10px !important;
                        letter-spacing: 0.5px !important;
                    }

                    .rating-stars svg,
                    .rating-stars div {
                        width: 14px !important;
                        height: 14px !important;
                    }

                    /* Hero H1 bigger on mobile */
                    .hero-h1 {
                        font-size: 42px !important;
                    }

                    /* Trust badges single row on mobile */
                    .fade-up.d6 {
                        display: flex !important;
                        flex-wrap: nowrap !important;
                        gap: clamp(8px, 2vw, 16px) !important;
                        justify-content: center !important;
                        align-items: center !important;
                        margin-top: 12px !important;
                        padding: 24px 4px 0 4px !important;
                    }

                    .fade-up.d6 img {
                        height: clamp(48px, 12vw, 64px) !important;
                        width: auto !important;
                    }

                    /* Tables scroll horizontally */
                    table {
                        min-width: 320px !important;
                    }

                    /* Comparison card padding tighter */
                    .comparison-them,
                    .comparison-us {
                        padding: 0 0 20px 0 !important;
                    }

                    /* Dark sections: visible dividers on small phones */
                    #lead-quality .comparison-them {
                        padding: 0 0 24px 0 !important;
                        border-bottom: 2px solid rgba(96, 165, 250, 0.2) !important;
                    }

                    #lead-quality .comparison-us {
                        padding: 24px 0 0 0 !important;
                    }

                    #crm-sync .comparison-them {
                        padding: 0 0 24px 0 !important;
                        border-bottom: 2px solid rgba(96, 165, 250, 0.2) !important;
                    }

                    #crm-sync .comparison-us {
                        padding: 24px 0 0 0 !important;
                    }

                    /* Testimonial carousel cards on small phones */
                    .results-carousel {
                        padding-left: 16px !important;
                        padding-right: 16px !important;
                        gap: 12px !important;
                        scroll-snap-type: x mandatory !important;
                        scroll-padding-left: 16px !important;
                    }

                    .results-carousel>div:first-child {
                        flex: 0 0 0px !important;
                        display: none !important;
                    }

                    .testimonial-card {
                        flex: 0 0 calc(100vw - 48px) !important;
                        scroll-snap-align: start !important;
                    }

                    /* Testimonial cards tighter */
                    .testimonial-grid>div {
                        padding: 20px !important;
                    }
                }

                /* Smooth scrolling */
                html {
                    scroll-behavior: smooth;
                }

                /* Reset defaults */
                * {
                    margin: 0;
                    padding: 0;
                    box-sizing: border-box;
                }

                body {
                    -webkit-font-smoothing: antialiased;
                    -moz-osx-font-smoothing: grayscale;
                    overflow-x: hidden;
                }

                a {
                    text-decoration: none;
                    color: inherit;
                }

                img {
                    max-width: 100%;
                    height: auto;
                    display: block;
                }

/* --- Custom overrides: hover zoom + responsive nav --- */

/* Navbar-only overrides to match the Leadbird header rhythm */
.site-nav {
    font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    background: rgba(255, 255, 255, 0.94) !important;
    border-bottom: 1px solid rgba(15, 23, 42, 0.06) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
}

.site-nav-inner {
    max-width: 1240px !important;
    padding: 0 clamp(24px, 5vw, 56px) !important;
    gap: 28px !important;
}

.site-nav-logo img {
    height: 28px !important;
}

.site-nav-links {
    gap: 40px !important;
}

.site-nav-link {
    display: inline-flex !important;
    align-items: center !important;
    padding: 8px 0 !important;
    font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    color: #111111 !important;
}

.site-nav-link:hover {
    color: #1041d6 !important;
}

.site-nav-cta {
    margin-left: 8px !important;
}

.site-nav-cta-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    min-height: 42px !important;
    padding: 10px 20px !important;
    border-radius: 9999px !important;
    font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
}

.site-nav-cta-link:hover {
    background: #0d35ad !important;
}

/* Subtle hover zoom for interactive/card elements */
.hover-zoom, .infra-card-hover, .comparison-them .infra-card-hover, .infra-card-hover * , .comparison-us .infra-card-hover, .client-grid > div, .stat-cards-grid > div, .pipeline-inboxgen, .comparison-us, .comparison-them, .email-compare-grid > div > div, .hero-visual-desktop > div, .play-btn {
    transition: transform .22s cubic-bezier(.2,.8,.2,1), box-shadow .22s;
    will-change: transform;
}
@media (hover: hover) and (pointer: fine) {
    .hover-zoom:hover, .infra-card-hover:hover, .client-grid > div:hover, .stat-cards-grid > div:hover, .pipeline-inboxgen:hover, .comparison-us:hover, .comparison-them:hover, .email-compare-grid > div > div:hover, .hero-visual-desktop > div:hover, .play-btn:hover {
        transform: scale(1.02);
    }
}

/* Responsive navbar: show hamburger on small screens, toggle menu */
.nav-links{display:flex}
.nav-hamburger{display:none}
@media (max-width: 768px){
    /* Force-hide nav links on mobile (override inline styles) */
    .site-nav-inner{padding:0 20px !important; gap:16px !important}
    .site-nav-links{display:none !important; position:absolute; top:72px; left:0; right:0; background: rgba(255,255,255,0.98); flex-direction:column; align-items:flex-start !important; gap:2px !important; padding:14px 20px 18px !important; box-shadow:0 8px 24px rgba(0,0,0,0.08)}
    .site-nav-links li{width:100%}
    .site-nav-link{width:100% !important; padding:10px 0 !important; font-size:15px !important}
    .site-nav-toggle{display:flex !important; align-items:center; justify-content:center; padding:8px 0 8px 8px !important}
    .site-nav-toggle-bar{width:22px !important; height:2px !important}
    .nav-links.show{display:flex !important}
    .nav-hamburger{display:flex !important; align-items:center}
    .nav-cta{display:none}
}

/* Client logos marquee */
.client-marquee{overflow:hidden}
.client-track{display:flex; align-items:center; gap:24px; padding:0 10px; will-change:transform;}
.client-track > div{flex:0 0 auto}
@keyframes marquee {
    from{transform: translateX(0)}
    to{transform: translateX(-50%)}
}
/* default: slightly faster than before (was 36s) */
.client-track{animation: marquee 30s linear infinite}

/* Mobile: reduce vertical spacing and speed up the loop a bit */
@media (max-width: 768px){
    .client-track{animation-duration:20s; gap:16px}
    /* override inline padding on the track and each logo container to reduce top/bottom space */
    .client-track{padding:8px 6px !important}
    .client-track > div{padding:8px 10px !important; min-height:40px !important}
    .client-track img{height:auto; max-height:56px}
}

/* Respect reduced motion preference */
@media (prefers-reduced-motion: reduce){
    .client-track{animation: none}
}

/* Animated pipeline stepper (5 steps) */
/* per-index highlight colors (used for glow during active pulse) */
.lb-circle[data-index="0"] { --lb-color: 96,165,250; }
.lb-circle[data-index="1"] { --lb-color: 251,191,36; }
.lb-circle[data-index="2"] { --lb-color: 74,222,128; }
.lb-circle[data-index="3"] { --lb-color: 192,132,252; }
.lb-circle[data-index="4"] { --lb-color: 34,211,238; }

@keyframes lbPulse {
    0% { transform: scale(1); box-shadow: none; }
    10% { transform: scale(1.18); box-shadow: 0 18px 40px rgba(var(--lb-color), 0.20); }
    30% { transform: scale(1.06); box-shadow: 0 8px 20px rgba(var(--lb-color), 0.10); }
    100% { transform: scale(1); box-shadow: none; }
}

@keyframes lbLinePulse {
    0% { opacity: 0.28; }
    10% { opacity: 1; }
    30% { opacity: 0.36; }
    100% { opacity: 0.36; }
}

@keyframes lbNumberColor {
    0% { color: inherit; }
    10% { color: rgb(var(--lb-color)); }
    30% { color: inherit; }
    100% { color: inherit; }
}

/* Slower, smoother cycle and eased timing for a calm left→right sequence */
/* total cycle: 4.8s; spacing: 0.8s between steps */
.lb-circle { animation: lbPulse 4.8s cubic-bezier(.2,.8,.2,1) infinite; transform-origin: center; }
.lb-line { animation: lbLinePulse 4.8s cubic-bezier(.2,.8,.2,1) infinite; }

/* Staggered positive delays to run left → right with 0.8s spacing */
.lb-circle[data-index="0"] { animation-delay: 0s; }
.lb-circle[data-index="1"] { animation-delay: 0.8s; }
.lb-circle[data-index="2"] { animation-delay: 1.6s; }
.lb-circle[data-index="3"] { animation-delay: 2.4s; }
.lb-circle[data-index="4"] { animation-delay: 3.2s; }

.lb-line[data-index="0"] { animation-delay: 0s; }
.lb-line[data-index="1"] { animation-delay: 0.8s; }
.lb-line[data-index="2"] { animation-delay: 1.6s; }
.lb-line[data-index="3"] { animation-delay: 2.4s; }

/* emphasize the number during its step (matching the circle pulse) */
.lb-circle span { display: inline-block; animation: lbPulse 4.8s cubic-bezier(.2,.8,.2,1) infinite, lbNumberColor 4.8s cubic-bezier(.2,.8,.2,1) infinite; transition: color .42s cubic-bezier(.2,.8,.2,1); }
.lb-circle[data-index="0"] span { animation-delay: 0s, 0s; }
.lb-circle[data-index="1"] span { animation-delay: 0.8s, 0.8s; }
.lb-circle[data-index="2"] span { animation-delay: 1.6s, 1.6s; }
.lb-circle[data-index="3"] span { animation-delay: 2.4s, 2.4s; }
.lb-circle[data-index="4"] span { animation-delay: 3.2s, 3.2s; }

/* allow the number color to transition to the step color when active */
.lb-circle span { color: inherit; }

@media (prefers-reduced-motion) {
    .lb-circle, .lb-line, .lb-circle span { animation: none !important; }
}