:root {
    --main-btn-color: #6280EB;
    --main-btn-border-color: #003D7B;
    --main-btn-text-color: #DBDCE1;
    --main-btn-hover-color: #2A4ECC;
    --main-btn-active-color: #0E30A7;
    --secondary-btn-color: transparent;
    --secondary-btn-border-color: #6280EB;
    --secondary-btn-text-color: #6280EB;
    --secondary-btn-hover-color: #6280EB;
    --secondary-btn-active-color: #2A4ECC;
}


.main-button-style {
    background-color: var(--main-btn-color);
    border-color: var(--main-btn-border-color);
    border-style: solid;
    border-width: 1px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.9vw;
    border: none;
    font-family: 'Inter', sans-serif;
    transition: 0.3s;
    color: var(--main-btn-text-color);
}
    .main-button-style:hover {
        background-color: var(--main-btn-hover-color);
        color: white;
    }
    .main-button-style:active {
        background-color: var(--main-btn-active-color);
        color: white;
    }

.secondary-button-style {
    background-color: var(--secondary-btn-color);
    border-color: var(--secondary-btn-border-color);
    border-style: solid;
    border-width: 1px;
    border-radius: 8px;
    color: var(--secondary-btn-text-color);
    font-weight: 600;
    font-size: 0.9vw;
  
    font-family: 'Inter', sans-serif;
    transition: 0.3s;
}
    .secondary-button-style:hover {
        background-color: var(--secondary-btn-hover-color);
        color:white;
    }

    .secondary-button-style:active {
        background-color: var(--secondary-btn-active-color);
        color: white;
    }