:root {
    --stroke-strong-950: #0D0D0D;
    --button-neutral-base: #242424;
    --neutral-800: #222530;
    --Gradient-Button-Stroke: rgba(255, 255, 255, 0.20);
    --button-primary-base: #F9B816;
    --base-primary-700: #D69B05;
    --purple-500: #F9B816;
    --base-primary-500: #F9B816;
    --base-primary-400: #FAC747;
    --button-primary-pressed: #BD8905;

    /* Text Colors */
    --text-white-0: #FFF;
    --text-soft-400: #99A0AE;
    --text-soft-300: #CACFD8;
    --text-strong-950: #0D0D0D;
    --text-sub-500: #9C9C9C;

    /* Gradients */
    --Gradient-Text-Heading: linear-gradient(180deg, var(--text-white-0) 0%, var(--text-soft-400) 100%);

    /* Backgrounds */
    --bg-strong-950: #0D0D0D;
    --bg-surface-900: #1A1A1A;
    --bg-surface-800: #242424;
    --bg-primary-500: #F9B816;
    --bg-surface-700: #2C2C2C;

    /* Stroke & Neutral Colors */
    --stroke-strong-700: #2C2C2C;
    --stroke-white-0: #FFF;
    --neutral-700: #2C2C2C;
    --neutral-200: #E1E4EA;

    /* Button Secondary */
    --button-secondary-base: #F5F7FA;

    /* New: Soft Border for Neutral Buttons */
    --button-neutral-flat-10: rgba(153, 160, 174, 0.10);
}


* {

    box-sizing: border-box;
}

html,
body {
    height: 100%;
    width: 100%;
}

body {
    background: var(--bg-strong-950, #0D0D0D);
    font-family: "Inter", sans-serif;
}

.white-btn-shad {
    box-shadow: 0px 0px 0px 1px var(--neutral-200, #E1E4EA), 0px 16px 24px -8px rgba(24, 27, 37, 0.10), 0px -2px 4px 0px rgba(14, 18, 27, 0.20) inset, 0px 2px 6px 0px #FFF inset;
}

.yellow-btn-shad {
    box-shadow: 0px 0px 0px 1px var(--base-primary-700, #D69B05), 0px 16px 24px -8px rgba(24, 27, 37, 0.10), 0px -2px 4px 0px rgba(14, 18, 27, 0.30) inset, 0px 2px 6px 0px rgba(255, 255, 255, 0.25) inset;
}

.black-btn-shad {
    box-shadow: 0px 0px 0px 1px var(--neutral-800, #222530), 0px 16px 24px -8px rgba(24, 27, 37, 0.10), 0px -2px 4px 0px #0E121B inset, 0px 2px 6px 0px rgba(255, 255, 255, 0.20) inset;
}

a,
button {
    cursor: pointer;
}

.text-h2-grad {
    background: var(--Gradient-Text-Heading, linear-gradient(180deg, var(--text-white-0, #FFF) 0%, var(--text-soft-400, #99A0AE) 100%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

@keyframes float {
    0% {
        transform: translateY(0px);
    }

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

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

.float-animation {
    animation: float 3s ease-in-out infinite;
}


@keyframes partner {
    0% {
        transform: translateX(5%);
    }

    50% {
        transform: translateX(-65%);
    }

    100% {
        transform: translateX(5%);
    }
}

.partner-marquee {

    animation: partner 18s linear infinite alternate-reverse;
}

/* Mobile Menu Styles */
#mobile-menu {
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
    border-left: 1px solid var(--stroke-strong-700);
}

#mobile-menu ul li a {
    transition: all 0.3s ease;
    border-radius: 8px;
    padding: 8px 12px;
}

#mobile-menu ul li a:hover {
    background-color: var(--bg-surface-700);
    color: var(--purple-500);
}

#close-menu {
    transition: transform 0.3s ease;
}

#close-menu:hover {
    transform: rotate(90deg);
}

#menu-overlay {
    transition: opacity 0.3s ease;
}

@media only screen and (max-width: 1024px) {

    @keyframes partner {
        0% {
            transform: translateX(5%);
        }

        50% {
            transform: translateX(-80%);
        }

        100% {
            transform: translateX(5%);
        }
    }

}

@media only screen and (max-width: 600px) {

    @keyframes partner {
        0% {
            transform: translateX(5%);
        }

        50% {
            transform: translateX(-400%);
        }

        100% {
            transform: translateX(5%);
        }
    }

}

.text-y-grad {
    background: linear-gradient(180deg, var(--button-primary-base, #F9B816) 0%, var(--button-primary-pressed, #BD8905) 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s;
    -webkit-text-fill-color: #ffffff;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}