/* =========================================================
   02. BASE
   ========================================================= */

body {
    background: var(--color-black);
    color: var(--color-text);

    font-family: var(--font-body);
    font-size: var(--text-md);
    line-height: 1.6;

    overflow-x: hidden;

    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body.menu-open {
    overflow: hidden;
}

main,
section,
footer,
header {
    position: relative;
}

::selection {
    background: var(--color-white);
    color: var(--color-black);
}


/* Ambient canvas (global environment) */
.ambient-system {
    position: fixed;
    inset: 0;
    z-index: var(--z-background, 0);
    pointer-events: none;
    overflow: hidden;
}
#ambient-canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0.65;
}
.ambient-glow {
    position: absolute;
    width: 40vw;
    aspect-ratio: 1;
    border-radius: 50%;
    filter: blur(100px);
    opacity: 0.04;
}
.ambient-glow--one { top: -20%; left: -10%; background: rgba(0,119,255,0.9); opacity: 0.05; }
.ambient-glow--two { right: -10%; bottom: -20%; background: rgba(153,0,255,0.9); opacity: 0.045; }