.box {
  margin-top: 35px;
}
.CVbtn {
    position: relative;
    padding: 13px 35px;
    background: var(--color);
    font-size: 20px;
    font-weight: 640;
    color: #181818;
    border: 3px solid var(--color);
    border-radius: 16px;
    box-shadow: 0 0 0 #22cde48c;
    transition: all 0.55s ease-in-out;
    cursor: pointer;
    text-decoration: none;
    overflow: hidden; /* This is crucial to hide the stars initially */
}

/* This targets the text inside the button */
.CVbtn .text {
    position: relative;
    z-index: 2; /* Ensures the text is always on top of the stars */
}

/* Star base styles */
.star-1, .star-2, .star-3, .star-4, .star-5, .star-6 {
    position: absolute;
    height: auto;
    filter: drop-shadow(0 0 0 transparent); /* Stars are invisible by default */
    z-index: 1;
    opacity: 0; /* Makes them fully transparent initially */
    /* Increased duration for a slower, more elegant movement */
    transition: all .8s ease-in-out;
}

/* Individual star initial positions */
.star-1 { top: 20%; left: 20%; width: 25px; }
.star-2 { top: 45%; left: 45%; width: 15px; }
.star-3 { top: 40%; left: 40%; width: 5px; }
.star-4 { top: 20%; left: 40%; width: 8px; }
.star-5 { top: 25%; left: 45%; width: 15px; }
.star-6 { top: 5%; left: 50%; width: 5px; }

/* Button hover state */
.CVbtn:hover {
    background: transparent;
    color: var(--color); /* Use the variable color for text on hover */
    box-shadow: 0 0 55px #22e3e48c;
}

/* Star hover animations */
.CVbtn:hover .star-1 { top: -50%; left: -30%; filter: drop-shadow(0 0 10px #fffdef); z-index: 2; opacity: 1; }
.CVbtn:hover .star-2 { top: -25%; left: 10%; filter: drop-shadow(0 0 10px #fffdef); z-index: 2; opacity: 1; }
.CVbtn:hover .star-3 { top: 55%; left: 25%; filter: drop-shadow(0 0 10px #fffdef); z-index: 2; opacity: 1; }
.CVbtn:hover .star-4 { top: 30%; left: 80%; filter: drop-shadow(0 0 10px #fffdef); z-index: 2; opacity: 1; }
.CVbtn:hover .star-5 { top: 25%; left: 115%; filter: drop-shadow(0 0 10px #fffdef); z-index: 2; opacity: 1; }
.CVbtn:hover .star-6 { top: 5%; left: 60%; filter: drop-shadow(0 0 10px #fffdef); z-index: 2; opacity: 1; }

.fil0 {
    fill: #FFFDEF;
}