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

.glass {
    background: rgba(20, 20, 25, 0.45);

    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: var(--radius-large);

    box-shadow:
        0 25px 80px rgba(0, 0, 0, 0.35),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);

    backdrop-filter: blur(24px) saturate(130%);
    -webkit-backdrop-filter: blur(24px) saturate(130%);
}


/* -------------------------
   GLASS VARIANTS
   ------------------------- */

.glass-light {
    background: rgba(255, 255, 255, 0.07);
}

.glass-dark {
    background: rgba(10, 10, 15, 0.50);
}

.glass-heavy {
    background: rgba(15, 15, 20, 0.65);

    backdrop-filter: blur(40px) saturate(140%);
    -webkit-backdrop-filter: blur(40px) saturate(140%);
}