/* ==========================================
   BUTTON SYSTEM
========================================== */
.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:14px 24px;
    border:none;
    border-radius:14px;
    cursor:pointer;
    font-family:inherit;
    font-size:15px;
    font-weight:600;
    transition:.25s ease;
    text-decoration:none;
}
.btn-primary{
    box-shadow:
    0 15px 35px rgba(239,68,68,.25);
}
.btn-primary:hover{
    transform:translateY(-3px);
}
.btn-secondary{
    background:var(--surface);
    color:var(--text);
    border:1px solid var(--border);
}
.btn-secondary:hover{
    background:var(--background);
}
.btn-success{
    background:#22C55E;
    color:white;
}
.btn-success:hover{
    background:#16A34A;
}
.btn-danger{
    background:#EF4444;
    color:white;
}
.btn-danger:hover{
    background:#DC2626;
}
.btn-outline{
    background:none;
    border:2px solid var(--primary);
    color:var(--primary);
}
.btn-outline:hover{
    background:var(--primary);
    color:white;
}
.btn-icon{
    width:46px;
    height:46px;
    padding:0;
    border-radius:50%;
}
.btn-block{
    width:100%;
}
.btn-sm{
    padding:10px 18px;
    font-size:13px;
}
.btn-lg{
    padding:18px 34px;
    font-size:17px;
}
.btn:disabled{
    opacity:.6;
    cursor:not-allowed;
}
.store-hero .btn{
    width:auto;
    align-self:flex-start;
    padding:14px 28px;
}