/* Shared Webshop palette. Variants use Sass lighten/darken HSL lightness offsets. */
:root {
    --primary-red: #B3001C;
    --primary-red-l1: hsl(350.61452514, 100%, 45.09803922%);
    --primary-red-l2: hsl(350.61452514, 100%, 55.09803922%);
    --primary-red-d1: hsl(350.61452514, 100%, 25.09803922%);
    --primary-red-d2: hsl(350.61452514, 100%, 15.09803922%);

    --primary-purple: #434055;
    --primary-purple-l1: hsl(248.57142857, 14.09395973%, 39.21568627%);
    --primary-purple-l2: hsl(248.57142857, 14.09395973%, 49.21568627%);
    --primary-purple-d1: hsl(248.57142857, 14.09395973%, 19.21568627%);
    --primary-purple-d2: hsl(248.57142857, 14.09395973%, 9.21568627%);

    --primary-success: #4ca657;
    --primary-success-l1: hsl(127.33333333, 37.19008264%, 57.45098039%);
    --primary-success-l2: hsl(127.33333333, 37.19008264%, 67.45098039%);
    --primary-success-d1: hsl(127.33333333, 37.19008264%, 37.45098039%);
    --primary-success-d2: hsl(127.33333333, 37.19008264%, 27.45098039%);

    --light-purple: #a4a4ae;
    --light-gray: #ececf2;
    --dark-gray: #00000029;
    --background: #ffffff;
    --background-light-purple: #f2f2f8;

    --light-text: #ffffff;
    --light-text-d1: hsl(0, 0%, 90%);
    --light-text-d2: hsl(0, 0%, 80%);
    --light-text-d5: hsl(0, 0%, 50%);

    --dark-text: #434055;
    --dark-text-l1: hsl(248.57142857, 14.09395973%, 39.21568627%);
    --dark-text-l2: hsl(248.57142857, 14.09395973%, 49.21568627%);
    --dark-text-l5: hsl(248.57142857, 14.09395973%, 79.21568627%);
}