@utility question

[jechaviz]

What I'm doing wrong?
I can't do migration. I miss how to use ::. Maybe I have other errors. Please help me with migration.
@utility wizard-btn::before

`@import "tailwindcss";

@layer base {
:root {
--color-1st: #7a0a0a; /* wine /
--color-2nd: #ab2114; / orange /
--color-3rd: #fe3e00; / red /
--color-acc1: #000; / black /
--color-acc2: #fff; / white */
}
body {
@apply font-['Roboto_Flex'] text-[1.7rem] leading-[1.58] text-[var(--color-acc1)] bg-[var(--color-acc2)] overflow-x-hidden;
}
h1, h2, h3 {
@apply font-['Bebas_Neue'];
}
}

@Utility btn {
@apply px-6 py-2 border border-white text-white hover:bg-white hover:text-[#fe3e00] transition duration-300;
}

@Utility btn-dark {
@apply inline-flex items-center justify-center font-['Bebas_Neue'] text-[2rem] px-6 py-2 border-2 border-[var(--color-1st)] text-[var(--color-1st)] hover:bg-[var(--color-1st)] hover:text-[var(--color-acc2)] transition duration-300;
}

@Utility card-hover {
@apply transition duration-300 hover:scale-105 hover:shadow-lg;
}

@Utility overlay-hover {
@apply absolute inset-0 bg-[var(--color-acc1)] bg-opacity-0 hover:bg-opacity-20 transition duration-300;
}

@Utility wizard-btn {
@apply min-w-[220px] min-h-[50px] border-2 border-white text-white bg-transparent rounded-md cursor-pointer relative z-0 overflow-hidden transition duration-300;
}

@Utility wizard-btn::before {
content: '';
@apply absolute inset-[-2px] bg-gradient-to-r from-[#ff0000] via-[#00ffd5] to-[#ff0000] bg-[length:400%] animate-[glowing_20s_linear_infinite] blur-md z-[-1] opacity-0;
}

@Utility wizard-btn:hover:not(:disabled)::before {
@apply opacity-100;
}

@Utility wizard-btn:disabled {
@apply opacity-50 cursor-not-allowed bg-gray-600;
}

@Utility form-input {
@apply w-full px-3 py-2 border border-white rounded-md bg-transparent text-white focus:ring-2 focus:ring-[#fe3e00] transition duration-300;
}

@Utility form-select {
@apply w-full px-3 py-2 border border-white rounded-md bg-transparent text-white focus:ring-2 focus:ring-[#fe3e00] transition duration-300 appearance-none;
}

@Utility modal-content {
@apply relative mx-auto h-full w-full max-w-md lg:max-w-[33.333%] bg-black/70 text-white flex flex-col p-8;
}

@Utility glow-effect {
@apply animate-[glow_2s_infinite];
}

@layer utilities {
@Keyframes glowing {
0% { background-position: 0 0; }
50% { background-position: 400% 0; }
100% { background-position: 0 0; }
}
@Keyframes glow {
0% { filter: drop-shadow(0 0 5px #fe3e00); }
50% { filter: drop-shadow(0 0 20px #fe3e00); }
100% { filter: drop-shadow(0 0 5px #fe3e00); }
}
@Keyframes bounce {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-10px); }
}
}
`