/* ==========================================
   NRCube V1 Premium Effects Engine
   ========================================== */

/* ------------------------------------------
   Rack LED Layer
------------------------------------------ */

.rack-led-layer {

    position: absolute;

    inset: 0;

    pointer-events: none;

    overflow: hidden;

    opacity: 0.35;

    z-index: 2;
}

.rack-led {

    position: absolute;

    width: 3px;

    height: 3px;

    border-radius: 50%;

    background: var(--color-gold);

    box-shadow:
        0 0 4px rgba(215,155,50,.8),
        0 0 10px rgba(215,155,50,.6);

    animation:
        rackBlink
        3s
        infinite;
}

.rack-led.teal {

    background: var(--color-primary);

    box-shadow:
        0 0 4px rgba(15,111,115,.8),
        0 0 10px rgba(15,111,115,.6);
}

@keyframes rackBlink {

    0% {
        opacity: .15;
    }

    20% {
        opacity: 1;
    }

    40% {
        opacity: .2;
    }

    100% {
        opacity: .15;
    }
}

/* ------------------------------------------
   Pedestal Effects
------------------------------------------ */

.pedestal-container {

    position: absolute;

    bottom: 8%;

    left: 50%;

    transform: translateX(-50%);

    width: 75%;

    pointer-events: none;

    z-index: 4;
}

.pedestal-glow {

    position: absolute;

    width: 100%;

    height: 32px;

    border-radius: 999px;

    filter: blur(22px);

    opacity: .75;

    background:
        radial-gradient(
            ellipse at center,
            rgba(215,155,50,.75),
            rgba(15,111,115,.35),
            transparent
        );
}

/* ------------------------------------------
   Optical Trails
------------------------------------------ */

.fiber-layer {

    position: absolute;

    inset: 0;

    overflow: hidden;

    pointer-events: none;

    z-index: 1;
}

.fiber-line {

    position: absolute;

    width: 180%;

    height: 2px;

    left: -40%;

    border-radius: 999px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(15,111,115,.8),
            rgba(215,155,50,.95),
            transparent
        );

    filter: blur(1px);

    opacity: .4;
}

.fiber-line:nth-child(1) {
    top: 20%;
}

.fiber-line:nth-child(2) {
    top: 45%;
}

.fiber-line:nth-child(3) {
    top: 70%;
}

/* ------------------------------------------
   Ambient Atmosphere
------------------------------------------ */

.hero-atmosphere {

    position: absolute;

    inset: 0;

    pointer-events: none;

    z-index: 0;
}

.hero-atmosphere::before {

    content: "";

    position: absolute;

    width: 500px;

    height: 500px;

    background:
        rgba(15,111,115,.18);

    border-radius: 50%;

    filter: blur(100px);

    top: 20%;

    left: 50%;
}

.hero-atmosphere::after {

    content: "";

    position: absolute;

    width: 350px;

    height: 350px;

    background:
        rgba(215,155,50,.16);

    border-radius: 50%;

    filter: blur(90px);

    bottom: 10%;

    left: 45%;
}
