/* ==========================================================
   FONT FACE
========================================================== */

@font-face {
    font-family: "Spirits Neutral";
    src: url("../fonts/Spirits-Neutral-Regular.otf") format("opentype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Spirits Neutral";
    src: url("../fonts/Spirits-Neutral-.otf") format("opentype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}


/* ==========================================================
   ROOT VARIABLES
========================================================== */

:root {

    /* ==========================
       Colors
    ========================== */

    --color-bg: #343839;
    --color-bg-alt: #2f3334;
    --color-white: #ffffff;
    --color-black: #000000;

    --color-primary: #d3bf92;
    --color-primary-hover: #c5af7d;

    --color-border: rgba(255,255,255,.10);

    --color-text: #ffffff;
    --color-text-light: rgba(255,255,255,.75);



    /* ==========================
       Typography
    ========================== */

    --font-heading: "Spirits Neutral", serif;
    --font-body: "Spirits Neutral", serif;

    --font-size-xs: .75rem;
    --font-size-sm: .875rem;
    --font-size-base: 1rem;
    --font-size-md: 1.125rem;
    --font-size-lg: 1.5rem;
    --font-size-xl: 2rem;
    --font-size-2xl: 3rem;
    --font-size-3xl: 4rem;



    /* ==========================
       Font Weight
    ========================== */

    --fw-regular: 400;
    --fw-medium: 500;
    --fw-bold: 700;



    /* ==========================
       Layout
    ========================== */

    --container-width: 1400px;
    --section-padding: 90px;
    --navbar-height: 70px;

    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 16px;



    /* ==========================
       Shadow
    ========================== */

    --shadow-sm: 0 2px 8px rgba(0,0,0,.15);
    --shadow-md: 0 6px 18px rgba(0,0,0,.20);



    /* ==========================
       Transition
    ========================== */

    --transition: .3s ease;



    /* ==========================
       Z-Index
    ========================== */

    --z-navbar: 1000;
    --z-dropdown: 1100;
    --z-modal: 1200;
    --z-loader: 1300;
}