@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

*{
    scrollbar-color: var(--accent) var(--primary);
    scrollbar-width: thin;
    
    font-family: 'Inter', sans-serif;
}


:root {
    --primary: #8750f7;
    --primarytr: #faaf40df;
    --bg: #140c1c;
    --bgtr: #060709;
    --light: #fff;
    --dark: #59576b;
    --trlight: #ffffff10;
    --accent: #d4c0fb;
    --cream: #f9f8f5;
}

body,
ul,
li,p{
    margin: 0;
    padding: 0;
}


/* Global Button Styles */
.btn-primary{
    color: #fff;
    border-radius: 50px;
    transition: all 500ms ease-in-out;
    background-image: linear-gradient(to right, var(--primary) 0%, var(--accent) 100%);
    padding: 15px 25px;
    position: relative;
    font-size: 18px;
    font-weight: 500;
    z-index: 1;
    text-decoration: none;
}

.btn-primary:hover {
    color: var(--light);
    background-image: linear-gradient(to right, var(--accent) 0%, var(--primary) 100%);
}


.btn-secondary{
    border-radius: 50px;
    transition: all 500ms ease-in-out;
    padding: 15px 25px;
    position: relative;
    font-size: 18px;
    font-weight: 500;
    z-index: 1;
    text-decoration: none;
    border: 2px solid var(--accent);
    color: var(--accent);
}

.btn-primary:hover {
    color: var(--light);
    background-image: linear-gradient(to right, var(--accent) 0%, var(--primary) 100%);
}

h5 {
    color: #fff;
    font-size: 24px;
    text-align: center;
}

h1 {
    background-image: linear-gradient(to right, var(--accent) 0%, var(--primary) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 32px;
    font-weight: 700;
    text-align: center;
}

.floatanim{
    animation: float-animation-keyframes 6s ease-in-out infinite;
}

@keyframes float-animation-keyframes {
	0% {
		transform: translatey(0px);
	}
	50% {
		transform: translatey(-10px);
	}
	100% {
		transform: translatey(0px);
	}
}