/* Variante Regular (Normal) */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400; /* 400 corresponde a Regular */
    src: url('/assets/font/poppins/Poppins-Regular.ttf') format('truetype');
}

/* Variante Medium */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500; /* 500 corresponde a Medium */
    src: url('/assets/font/poppins/Poppins-Medium.ttf') format('truetype');
}

/* Variante Semibold */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600; /* 600 corresponde a SemiBold */
    src: url('/assets/font/poppins/Poppins-SemiBold.ttf') format('truetype');
}

/* Variante Bold (Negrita) */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 700; /* 700 corresponde a Bold */
    src: url('/assets/font/poppins/Poppins-Bold.ttf') format('truetype');
}

*, *::before, *::after {
    box-sizing: border-box;
}

/* Esto afectará a todas las imágenes del sitio */
img {
    user-select: none;
    -webkit-user-drag: none;
}

html, body {
    margin: 0;
    height: 100%;
    padding: 0;
    width: 100%;
    overflow-x: hidden;
}

body {
    background: #1B1F23;
    color: #E9E9E9;
    font-family: 'Poppins', sans-serif;
}

#header-root{
    position: relative;
    width: 100%;
}

:root {
    /* ESCALA DE GRISES */
    --color-neutral-100: #ffffff;
    --color-neutral-125: #f7f7f7;
    --color-neutral-150: #efefef;
    --color-neutral-175: #e7e7e7;
    --color-neutral-200: #dfdfdf;
    --color-neutral-225: #d7d7d7;
    --color-neutral-250: #cfcfcf;
    --color-neutral-275: #c7c7c7;
    --color-neutral-300: #bfbfbf;
    --color-neutral-325: #b7b7b7;
    --color-neutral-350: #afafaf;
    --color-neutral-375: #a7a7a7;
    --color-neutral-400: #9f9f9f;
    --color-neutral-425: #979797;
    --color-neutral-450: #8f8f8f;
    --color-neutral-475: #878787;
    --color-neutral-500: #7f7f7f;
    --color-neutral-525: #777777;
    --color-neutral-550: #6f6f6f;
    --color-neutral-575: #676767;
    --color-neutral-600: #5f5f5f;
    --color-neutral-625: #575757;
    --color-neutral-650: #4f4f4f;
    --color-neutral-675: #474747;
    --color-neutral-700: #3f3f3f;
    --color-neutral-725: #373737;
    --color-neutral-750: #2f2f2f;
    --color-neutral-775: #272727;
    --color-neutral-800: #1f1f1f;
    --color-neutral-825: #171717;
    --color-neutral-850: #0f0f0f;
    --color-neutral-875: #070707;
    --color-neutral-900: #000000;

    /* ESCALA DEL COLOR PRINCIPAL */
    --color-primary-100: #fff5f3;
    --color-primary-125: #ffece7;
    --color-primary-150: #ffe2db;
    --color-primary-175: #ffd9cf;
    --color-primary-200: #ffcfc3;
    --color-primary-225: #ffc6b7;
    --color-primary-250: #ffbcab;
    --color-primary-275: #ffb39f;
    --color-primary-300: #ffa993;
    --color-primary-325: #ffa087;
    --color-primary-350: #ff967b;
    --color-primary-375: #ff8d6f;
    --color-primary-400: #ff8364;
    --color-primary-425: #ff7a58;
    --color-primary-450: #ff704c;
    --color-primary-475: #ff6842;
    --color-primary-500: #ff6740; /* COLOR BASE ORIGINAL */
    --color-primary-525: #ef613c;
    --color-primary-550: #df5a38;
    --color-primary-575: #cf5434;
    --color-primary-600: #bf4d30;
    --color-primary-625: #af472c;
    --color-primary-650: #9f4028;
    --color-primary-675: #8f3a24;
    --color-primary-700: #7f3320;
    --color-primary-725: #6f2d1c;
    --color-primary-750: #5f2618;
    --color-primary-775: #4f2014;
    --color-primary-800: #401a10;
    --color-primary-825: #30130c;
    --color-primary-850: #200d08;
    --color-primary-875: #100604;
    --color-primary-900: #000000;
}