:root {

    /* MAIN COLORS */
    --black:        hsl(0 0 0%);
    --grey-05:      hsl(334 5% 5%);
    --grey-10:      hsl(334 5% 10%);
    --grey-15:      hsl(334 5% 15%);
    --grey-20:      hsl(334 5% 20%);
    --grey-25:      hsl(334 5% 25%);
    --grey-30:      hsl(334 5% 30%);
    --grey-35:      hsl(334 5% 35%);
    --grey-40:      hsl(334 5% 40%);
    --grey-45:      hsl(334 5% 45%);
    --grey-50:      hsl(334 5% 50%);
    --grey-55:      hsl(334 5% 55%);
    --grey-60:      hsl(334 5% 60%);
    --grey-65:      hsl(334 5% 65%);
    --grey-70:      hsl(334 5% 70%);
    --grey-75:      hsl(334 5% 75%);
    --grey-80:      hsl(334 5% 80%);
    --grey-85:      hsl(334 5% 85%);
    --grey-90:      hsl(334 5% 90%);
    --grey-95:      hsl(334 5% 95%);
    --white:        hsl(0 0 100%);

    --primary:      hsl(334 80% 50%);
    --secondary:    hsl(334 5% 12%);
    --tertiary:     hsl(334 80% 70%);

    --link:         hsl(248 65% 40%);
    --hover:        hsl(248 71% 30%);
    --active:       hsl(248 92% 10%);

    --bg-white:     var(--grey-95);
    --basic-txt:    var(--grey-05);

    /* CUSTOM COLORS */
    --magenta:      var(--primary);
    --antraciet:    var(--secondary);
    --whatsapp:     hsl(115 65% 40%);
}

@media (prefers-color-scheme: dark) {
    :root {
        --bg-white:     var(--grey-05);
        --basic-txt:    var(--grey-95);
    }
}