These are the properties that you will use when making an anchor tag look like a button.

Can we apply margin to inline elements?**: Top and bottom margins do not affect inline elements because inline elements flow with content on the page. You can set left and right margins/padding on an inline element but not top or bottom because it would disrupt the flow of content. so set display:inline-block to apply top and bottom margins.

.button {
     background-color: var(--secondary);
     padding: .5rem 3rem;
     border-radius: 5px;
     display: inline-block;
     margin-top: .5rem;
     font-weight: 700;
     text-decoration: none;
     text-transform: uppercase;
     font-size: 1.2rem;
     border: none;
     color: var(--white);
     transition: background-color .3s ease;
     cursor: pointer;
}
.button:hover {
    background-color: rgb(1, 123, 136);
}