:root {
            --bg-color: #FAFAFA;
            --text-main: #050505;
            --border-light: rgba(0, 0, 0, 0.06);
            --border-dark: rgba(255, 255, 255, 0.15);
        }


        h1,
        h2,
        h3,
        h4,
        h5,
        h6,
        .display-font {
            font-family: 'Space Grotesk', sans-serif;
            letter-spacing: -0.05em;
            /* Tighter Apple-like kerning */
        }

        /* Ambient Noise Texture for Premium Print Feel */



        @media (pointer: fine) {
            body {
                cursor: none;
            }

            a,
            button,
            input,
            textarea,
            select {
                cursor: none;
            }

            .cursor-dot {
                width: 5px;
                height: 5px;
                background-color: var(--text-main);
                display: block;
            }

            .cursor-outline {
                width: 36px;
                height: 36px;
                border: 1px solid rgba(0, 0, 0, 0.2);
                transition: width 0.25s ease, height 0.25s ease, background-color 0.25s ease, border-color 0.25s ease;
                display: block;
            }

            .cursor-hover .cursor-outline {
                width: 55px;
                height: 55px;
                background-color: rgba(0, 0, 0, 0.04);
                border-color: transparent;
            }

            .cursor-dark-hover .cursor-dot {
                background-color: #fff;
            }

            .cursor-dark-hover .cursor-outline {
                background-color: rgba(255, 255, 255, 0.1);
                border-color: transparent;
            }
        }

        /* Awwwards Style Magnetic Button with Shine */
        .btn-magnetic {
            position: relative;
            overflow: hidden;
            display: inline-flex;
            justify-content: center;
            items-center;
            z-index: 1;
            transition: color 0.3s ease, box-shadow 0.3s ease;
        }

        .btn-magnetic::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 50%;
            height: 100%;
            background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.25), transparent);
            transform: skewX(-20deg);
            z-index: 2;
            transition: none;
        }

        .btn-magnetic:hover::before {
            animation: shine 0.75s ease-in-out;
        }

        @keyframes shine {
            100% {
                left: 200%;
            }
        }


        /* Marquee Gradient Masking */

   

        ::-webkit-scrollbar {
            width: 6px;
        }

        ::-webkit-scrollbar-track {
            background: var(--bg-color);
        }

        ::-webkit-scrollbar-thumb {
            background: #C4C4C4;
            border-radius: 10px;
        }