/* ==========================================
   GLOBAL CURSOR
========================================== */

html.js-enabled,
.js-enabled body,
.js-enabled a,
.js-enabled button,
.js-enabled .btn,
.js-enabled .info-card,
.js-enabled .progress-card,
.js-enabled .highlight-box,
.js-enabled .quote-box,
.js-enabled .nav-btn,
.js-enabled .logo{
    cursor:none;
}

@media (pointer:coarse){
    html.js-enabled,
    .js-enabled body,
    .js-enabled a,
    .js-enabled button,
    .js-enabled .btn,
    .js-enabled .info-card,
    .js-enabled .progress-card,
    .js-enabled .highlight-box,
    .js-enabled .quote-box,
    .js-enabled .nav-btn,
    .js-enabled .logo{
        cursor:auto;
    }
}

/* ==========================================
   CUSTOM CURSOR
========================================== */

.custom-cursor,
.cursor-ring{
    display:none;
    position:fixed;
    top:0;
    left:0;
    pointer-events:none;
    z-index:99999;
    transform:translate(-50%,-50%);
}

.js-enabled .custom-cursor,
.js-enabled .cursor-ring{
    display:block;
}

@media (pointer:coarse){
    .js-enabled .custom-cursor,
    .js-enabled .cursor-ring{
        display:none;
    }
}

.custom-cursor{
    width:8px;
    height:8px;
    background:var(--color-primary);
    border-radius:50%;
    box-shadow:0 0 18px rgba(255,106,0,.95);
}

.cursor-ring{
    width:34px;
    height:34px;
    border:1px solid rgba(255,106,0,.55);
    border-radius:50%;
    transition:width .2s ease, height .2s ease, opacity .2s ease, transform .2s ease;
}

body.cursor-hover .cursor-ring{
    width:54px;
    height:54px;
    opacity:.85;
}

body.cursor-click .custom-cursor{
    transform:translate(-50%,-50%) scale(.65);
}

body.cursor-click .cursor-ring{
    transform:translate(-50%,-50%) scale(1.25);
}
