/* ==========================================================
   CITYGO BUTTON SYSTEM
========================================================== */

.cg-btn{

    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;

    height:52px;
    padding:0 26px;

    border:none;
    border-radius:999px;

    cursor:pointer;

    font-family:inherit;
    font-size:15px;
    font-weight:700;

    transition:
        all var(--cg-speed) var(--cg-ease);

}

/* ================= PRIMARY ================= */

.cg-btn-primary{

    background:var(--cg-primary);
    color:#fff;

}

.cg-btn-primary:hover{

    background:var(--cg-primary-hover);

    transform:translateY(-2px);

    box-shadow:0 14px 34px rgba(16,183,200,.28);

}

/* ================= SECONDARY ================= */

.cg-btn-secondary{

    background:var(--cg-surface);

    color:var(--cg-text);

    border:1px solid var(--cg-border);

}

.cg-btn-secondary:hover{

    border-color:var(--cg-primary);

}

/* ================= GLASS ================= */

.cg-btn-glass{

    background:rgba(255,255,255,.14);

    color:#fff;

    backdrop-filter:blur(18px);

    border:1px solid rgba(255,255,255,.18);

}

html[data-theme="dark"] .cg-btn-glass{

    background:rgba(255,255,255,.08);

}

/* ================= ICON ================= */

.cg-btn-icon{

    width:52px;

    padding:0;

    border-radius:50%;

}