:root{
    --main-font: 'Agrandir Regular';
    --main-font-heavy: 'Agrandir Grand Heavy';
    --main-font-bold: 'Agrandir Bold';
}
body {
    font-family: var(--main-font);
    font-weight: 500;
}
.main-bg {
    background-image: linear-gradient(to right, rgba(255, 255, 255, 0.05) 1px, transparent 1px), linear-gradient(to bottom, rgba(255, 255, 255, 0.05) 1px, transparent 1px), radial-gradient(circle at 100% 0%, rgba(0, 255, 200, 0.65), transparent 25%), radial-gradient(circle at 20% 95%, rgba(150, 80, 255, 0.65), transparent 40%) !important;
    background-size: 40px 40px, 40px 40px, cover, cover !important;
    background-repeat: repeat, repeat, no-repeat, no-repeat !important;
    background-position: top left, top left, top right, bottom left !important;
}
.main-bg-2 {
    background-image: linear-gradient(25deg,#260F33 25%,#347e64 75%);
}
.main-bg-3 {
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.05) 1px, transparent 1px), linear-gradient(to bottom, rgba(0, 0, 0, 0.05) 1px, transparent 1px), radial-gradient(circle at 0% 100%, rgba(0, 255, 200, 0.65), transparent 25%), radial-gradient(circle at 120% 0%, rgba(150, 80, 255, 0.65), transparent 40%) !important;
    background-size: 40px 40px, 40px 40px, cover, cover !important;
    background-repeat: repeat, repeat, no-repeat, no-repeat !important;
    background-position: top left, top left, top right, bottom left !important;
}
.title h1 {
    font-family: var(--main-font-bold);
}
.title-2 h3 {
    font-family: var(--main-font-heavy);
}
h1 .talent {
    background: -webkit-linear-gradient(#8853EC 25%, #69E0B6 75%, #69E0B6 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

@keyframes marquee {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

.animate-marquee {
    animation: marquee 20s linear infinite;
}
.main-content {
    font-size: var(--main-font-heavy);
}