/*!
* Digiscapes Theme 
* Copyright 2011-2026 by Atelier 26 AG
*/
:root {
  --grid6-line-color: hsl(from #000 h s l / .08);
}

.feature-item-content {
    font-size: var(--bs-font-size-small);
    line-height: var(--bs-line-height-small);
}

section .section-container::after,
footer section .section-container::after{
  content: "";
   position: absolute;
   inset: 0 var(--bs-container-padding);
   pointer-events: none;
   z-index: 0;
   background-image:
    linear-gradient(var(--grid6-line-color), var(--grid6-line-color)),
    linear-gradient(var(--grid6-line-color), var(--grid6-line-color)),
    linear-gradient(var(--grid6-line-color), var(--grid6-line-color)),
    linear-gradient(var(--grid6-line-color), var(--grid6-line-color)),
    linear-gradient(var(--grid6-line-color), var(--grid6-line-color)),
    linear-gradient(var(--grid6-line-color), var(--grid6-line-color)),
    linear-gradient(var(--grid6-line-color), var(--grid6-line-color)),
    linear-gradient(var(--grid6-line-color), var(--grid6-line-color)),
    linear-gradient(var(--grid6-line-color), var(--grid6-line-color)),
    linear-gradient(var(--grid6-line-color), var(--grid6-line-color)),
    linear-gradient(var(--grid6-line-color), var(--grid6-line-color)),
    linear-gradient(var(--grid6-line-color), var(--grid6-line-color));
   background-repeat: no-repeat;
   background-size: 1px 100%;
   background-position:
    0 0,
    calc((100% - 5 * var(--bs-gutter-x, 1.5rem)) / 6) 0,
    calc((100% - 5 * var(--bs-gutter-x, 1.5rem)) / 6 + var(--bs-gutter-x, 1.5rem)) 0,
    calc(2 * (100% - 5 * var(--bs-gutter-x, 1.5rem)) / 6 + var(--bs-gutter-x, 1.5rem)) 0,
    calc(2 * (100% - 5 * var(--bs-gutter-x, 1.5rem)) / 6 + 2 * var(--bs-gutter-x, 1.5rem)) 0,
    calc(3 * (100% - 5 * var(--bs-gutter-x, 1.5rem)) / 6 + 2 * var(--bs-gutter-x, 1.5rem)) 0,
    calc(3 * (100% - 5 * var(--bs-gutter-x, 1.5rem)) / 6 + 3 * var(--bs-gutter-x, 1.5rem)) 0,
    calc(4 * (100% - 5 * var(--bs-gutter-x, 1.5rem)) / 6 + 3 * var(--bs-gutter-x, 1.5rem)) 0,
    calc(4 * (100% - 5 * var(--bs-gutter-x, 1.5rem)) / 6 + 4 * var(--bs-gutter-x, 1.5rem)) 0,
    calc(5 * (100% - 5 * var(--bs-gutter-x, 1.5rem)) / 6 + 4 * var(--bs-gutter-x, 1.5rem)) 0,
    calc(5 * (100% - 5 * var(--bs-gutter-x, 1.5rem)) / 6 + 5 * var(--bs-gutter-x, 1.5rem)) 0,
    100% 0;
   mix-blend-mode: multiply;
  }

[class*="content-"] {
  z-index: 1;
}

.navbar .container::before {
    display: none !important;
}


/* ===============================================
   MASH GRADIENT SYSTEM
   Verwendung: <div class="mash-base mash-animation-1">
               <div class="mash-base mash-animation-2">
   =============================================== */

.mash-duration-5 {
    --mash-duration: 5s;
}
.mash-duration-10 {
    --mash-duration: 10s;
}
.mash-duration-15 {
    --mash-duration: 15s;
}
.mash-duration-20 {
    --mash-duration: 20s;
}
.mash-duration-25 {
    --mash-duration: 25s;
}
.mash-duration-30 {
    --mash-duration: 30s;
}
.mash-duration-40 {
    --mash-duration: 40s;
}
.mash-duration-45 {
    --mash-duration: 45s;
}
.mash-duration-50 {
    --mash-duration: 50s;
}
.mash-duration-60 {
    --mash-duration: 60s;
}

.mash-forward {
    --mash-direction: alternate;
}
.mash-reverse {
    --mash-direction: alternate-reverse;
}




/* -----------------------------------------------
   @property – einmal global, neutrale Initialwerte
   Konkrete Werte kommen von den Varianten-Klassen
----------------------------------------------- */

@property --c-0 { syntax: '<color>';      inherits: false; initial-value: transparent }
@property --x-0 { syntax: '<percentage>'; inherits: false; initial-value: 50% }
@property --y-0 { syntax: '<percentage>'; inherits: false; initial-value: 50% }
@property --s-start-0 { syntax: '<percentage>'; inherits: false; initial-value: 0% }
@property --s-end-0   { syntax: '<percentage>'; inherits: false; initial-value: 50% }

@property --c-1 { syntax: '<color>';      inherits: false; initial-value: transparent }
@property --x-1 { syntax: '<percentage>'; inherits: false; initial-value: 50% }
@property --y-1 { syntax: '<percentage>'; inherits: false; initial-value: 50% }
@property --s-start-1 { syntax: '<percentage>'; inherits: false; initial-value: 0% }
@property --s-end-1   { syntax: '<percentage>'; inherits: false; initial-value: 50% }

@property --c-2 { syntax: '<color>';      inherits: false; initial-value: transparent }
@property --x-2 { syntax: '<percentage>'; inherits: false; initial-value: 50% }
@property --y-2 { syntax: '<percentage>'; inherits: false; initial-value: 50% }
@property --s-start-2 { syntax: '<percentage>'; inherits: false; initial-value: 0% }
@property --s-end-2   { syntax: '<percentage>'; inherits: false; initial-value: 50% }

@property --c-3 { syntax: '<color>';      inherits: false; initial-value: transparent }
@property --x-3 { syntax: '<percentage>'; inherits: false; initial-value: 50% }
@property --y-3 { syntax: '<percentage>'; inherits: false; initial-value: 50% }
@property --s-start-3 { syntax: '<percentage>'; inherits: false; initial-value: 0% }
@property --s-end-3   { syntax: '<percentage>'; inherits: false; initial-value: 50% }

@property --c-4 { syntax: '<color>';      inherits: false; initial-value: transparent }
@property --x-4 { syntax: '<percentage>'; inherits: false; initial-value: 50% }
@property --y-4 { syntax: '<percentage>'; inherits: false; initial-value: 50% }
@property --s-start-4 { syntax: '<percentage>'; inherits: false; initial-value: 0% }
@property --s-end-4   { syntax: '<percentage>'; inherits: false; initial-value: 50% }

@property --c-5 { syntax: '<color>';      inherits: false; initial-value: transparent }
@property --x-5 { syntax: '<percentage>'; inherits: false; initial-value: 50% }
@property --y-5 { syntax: '<percentage>'; inherits: false; initial-value: 50% }
@property --s-start-5 { syntax: '<percentage>'; inherits: false; initial-value: 0% }
@property --s-end-5   { syntax: '<percentage>'; inherits: false; initial-value: 50% }

@property --c-6 { syntax: '<color>';      inherits: false; initial-value: transparent }
@property --x-6 { syntax: '<percentage>'; inherits: false; initial-value: 50% }
@property --y-6 { syntax: '<percentage>'; inherits: false; initial-value: 50% }
@property --s-start-6 { syntax: '<percentage>'; inherits: false; initial-value: 0% }
@property --s-end-6   { syntax: '<percentage>'; inherits: false; initial-value: 50% }

@property --c-7 { syntax: '<color>';      inherits: false; initial-value: transparent }
@property --x-7 { syntax: '<percentage>'; inherits: false; initial-value: 50% }
@property --y-7 { syntax: '<percentage>'; inherits: false; initial-value: 50% }
@property --s-start-7 { syntax: '<percentage>'; inherits: false; initial-value: 0% }
@property --s-end-7   { syntax: '<percentage>'; inherits: false; initial-value: 50% }

@property --c-8 { syntax: '<color>';      inherits: false; initial-value: transparent }
@property --x-8 { syntax: '<percentage>'; inherits: false; initial-value: 50% }
@property --y-8 { syntax: '<percentage>'; inherits: false; initial-value: 50% }
@property --s-start-8 { syntax: '<percentage>'; inherits: false; initial-value: 0% }
@property --s-end-8   { syntax: '<percentage>'; inherits: false; initial-value: 50% }

/* -----------------------------------------------
   Base – Gradient direkt auf Element, Blur auf ::after
----------------------------------------------- */

.mash-base {
    position: relative;
    overflow: hidden;
    background-color: var(--mash-bg, transparent);
    background-image: var(--mash-gradient);
    animation: var(--mash-animation);
}

.mash-base::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    -webkit-backdrop-filter: blur(80px);
    backdrop-filter: blur(80px);
}

.mash-base > * {
    position: relative;
    z-index: 1;
}


/* ===============================================
   VARIANTE 1
   Verwendung: <div class="mash-base mash-animation-1">
   =============================================== */

@keyframes mash-key-1 {
    0% {
        --c-1: hsla(186, 100%, 36%, 1); --s-start-1: 0%; --s-end-1: 50%;    --x-1: 10%;    --y-1: 100%;
        --c-2: hsla(213, 90%, 35%, 1);  --s-start-2: 0%; --s-end-2: 50%;    --x-2: 90.58%; --y-2: 60.40%;
        --c-3: hsla(186, 74%, 31%, 1);  --s-start-3: 0%; --s-end-3: 50%;    --x-3: 64%;    --y-3: 9%;
    }
    50% {
        --c-1: hsla(186, 100%, 36%, 1); --s-start-1: 0%; --s-end-1: 66.01%; --x-1: 32.01%; --y-1: 50.85%;
        --c-2: hsla(213, 90%, 35%, 1);  --s-start-2: 0%; --s-end-2: 50%;    --x-2: 77.70%; --y-2: 48.64%;
        --c-3: hsla(186, 74%, 31%, 1);  --s-start-3: 0%; --s-end-3: 50%;    --x-3: 85.87%; --y-3: 39.11%;
    }
    100% {
        --c-1: hsla(186, 100%, 36%, 1); --s-start-1: 0%; --s-end-1: 58.17%; --x-1: 49.22%; --y-1: 93.04%;
        --c-2: hsla(213, 90%, 35%, 1);  --s-start-2: 0%; --s-end-2: 50%;    --x-2: 68.46%; --y-2: 91.85%;
    }
}

.mash-animation-1 {
    --mash-bg: hsla(192, 100%, 5%, 1);
    --mash-animation: mash-key-1 var(--mash-duration, 15s) linear infinite var(--mash-direction, alternate);
    --c-0: hsla(193, 100%, 5%, 1); --x-0: 9.556%; --y-0: 12.106%;
    --c-1: hsla(186, 100%, 36%, 1); --x-1: 10%; --y-1: 100%;
    --c-2: hsla(213, 90%, 35%, 1);  --x-2: 90.58%; --y-2: 60.40%;
    --c-3: hsla(186, 74%, 31%, 1);  --x-3: 64%; --y-3: 9%;
    --mash-gradient:
        radial-gradient(circle at var(--x-0) var(--y-0), var(--c-0) var(--s-start-0), transparent var(--s-end-0)),
        radial-gradient(circle at var(--x-1) var(--y-1), var(--c-1) var(--s-start-1), transparent var(--s-end-1)),
        radial-gradient(circle at var(--x-2) var(--y-2), var(--c-2) var(--s-start-2), transparent var(--s-end-2)),
        radial-gradient(circle at var(--x-3) var(--y-3), var(--c-3) var(--s-start-3), transparent var(--s-end-3));
}


/* ===============================================
   VARIANTE 2
   Verwendung: <div class="mash-base mash-animation-2">
   =============================================== */

@keyframes mash-key-2 {
    0% {
        --c-0: hsla(210, 18%, 4%, 1);  --s-start-0: 1%;  --s-end-0: 61%; --x-0: 91%; --y-0: 90%;
        --c-1: hsla(75, 0%, 0%, 1);    --s-start-1: 0%;  --s-end-1: 55%; --x-1: 17%; --y-1: 24%;
        --c-2: hsla(188, 100%, 13%, 1);--s-start-2: 19%; --s-end-2: 54%; --x-2: 11%; --y-2: 32%;
        --c-3: hsla(185, 100%, 36%, 1);--s-start-3: 0%;  --s-end-3: 67%; --x-3: 2%;  --y-3: 31%;
        --c-4: hsla(210, 18%, 4%, 1);  --s-start-4: 12%; --s-end-4: 82%; --x-4: 74%; --y-4: 93%;
    }
    100% {
        --c-0: hsla(210, 18%, 4%, 1);  --s-start-0: 19%; --s-end-0: 69%; --x-0: 49%; --y-0: 25%;
        --c-1: hsla(360, 0%, 0%, 1);   --s-start-1: 3%;  --s-end-1: 77%; --x-1: 1%;  --y-1: 41%;
        --c-2: hsla(321, 0%, 0%, 1);   --s-start-2: 6%;  --s-end-2: 73%; --x-2: 44%; --y-2: 93%;
        --c-3: hsla(185, 100%, 40%, 1);--s-start-3: 8%;  --s-end-3: 86%; --x-3: 97%; --y-3: 51%;
        --c-4: hsla(205, 11%, 11%, 1); --s-start-4: 20%; --s-end-4: 75%; --x-4: 10%; --y-4: 69%;
    }
}

.mash-animation-2 {
    --mash-bg: hsla(210, 18%, 4%, 1);
    --mash-animation: mash-key-2 var(--mash-duration, 25s) linear infinite var(--mash-direction, alternate);
    --c-0: hsla(210, 18%, 4%, 1);   --x-0: 91%;    --y-0: 90%;
    --c-1: hsla(75, 0%, 0%, 1);     --x-1: 17%;    --y-1: 24%;
    --c-2: hsla(188, 100%, 13%, 1); --x-2: 11%;    --y-2: 32%;
    --c-3: hsla(185, 100%, 36%, 1); --x-3: 2%;     --y-3: 31%;
    --c-4: hsla(210, 18%, 4%, 1);   --x-4: 74%;    --y-4: 93%;
    --mash-gradient:
        radial-gradient(circle at var(--x-0) var(--y-0), var(--c-0) var(--s-start-0), transparent var(--s-end-0)),
        radial-gradient(circle at var(--x-1) var(--y-1), var(--c-1) var(--s-start-1), transparent var(--s-end-1)),
        radial-gradient(circle at var(--x-2) var(--y-2), var(--c-2) var(--s-start-2), transparent var(--s-end-2)),
        radial-gradient(circle at var(--x-3) var(--y-3), var(--c-3) var(--s-start-3), transparent var(--s-end-3)),
        radial-gradient(circle at var(--x-4) var(--y-4), var(--c-4) var(--s-start-4), transparent var(--s-end-4));
}


/* ===============================================
   VARIANTE 3
   Verwendung: <div class="mash-base mash-animation-3">
   =============================================== */

@keyframes mash-key-3 {
    0% {
        --c-0: hsla(185, 100%, 40%, 1);  --s-start-0: 8%;     --s-end-0: 56.59%;  --x-0: 95%;    --y-0: 75%;
        --c-1: hsla(192, 100%, 5%, 1);   --s-start-1: 1%;     --s-end-1: 62.39%;  --x-1: 95%;    --y-1: 15%;
        --c-2: hsla(212, 90%, 35%, 1);   --s-start-2: 8.39%;  --s-end-2: 48.53%;  --x-2: 2%;     --y-2: 86%;
        --c-3: hsla(185, 100%, 36%, 1);  --s-start-3: 8.39%;  --s-end-3: 48.53%;  --x-3: 93%;    --y-3: 94%;
        --c-4: hsla(210, 100%, 40%, 1);  --s-start-4: 18%;    --s-end-4: 49.94%;  --x-4: 55%;    --y-4: 101%;
        --c-5: hsla(188, 100%, 13%, 1);  --s-start-5: 11.13%; --s-end-5: 51.76%;  --x-5: 90%;    --y-5: 47%;
        --c-6: hsla(186, 73%, 31%, 1);   --s-start-6: 6%;     --s-end-6: 36.02%;  --x-6: 46%;    --y-6: 72%;
    }
    50% {
        --c-0: hsla(185, 100%, 40%, 1);  --s-start-0: 9%;     --s-end-0: 47.63%;  --x-0: 25%;    --y-0: 90%;
        --c-1: hsla(192, 100%, 5%, 1);   --s-start-1: 9%;     --s-end-1: 73%;     --x-1: 3%;     --y-1: 12%;
        --c-2: hsla(212, 90%, 35%, 1);   --s-start-2: 9%;     --s-end-2: 49.05%;  --x-2: 75%;    --y-2: 71%;
        --c-3: hsla(185, 100%, 36%, 1);  --s-start-3: 9%;     --s-end-3: 49.05%;  --x-3: 51%;    --y-3: 97%;
        --c-4: hsla(210, 100%, 40%, 1);  --s-start-4: 9%;     --s-end-4: 49.07%;  --x-4: 28%;    --y-4: 75%;
        --c-5: hsla(188, 100%, 13%, 1);  --s-start-5: 9%;     --s-end-5: 49.49%;  --x-5: 42%;    --y-5: 102%;
        --c-6: hsla(186, 73%, 31%, 1);   --s-start-6: 9%;     --s-end-6: 47.08%;  --x-6: 42%;    --y-6: 97%;
    }
    100% {
        --c-1: hsla(192, 100%, 5%, 1);   --s-start-1: 9%;     --s-end-1: 38.76%;  --x-1: 54%;    --y-1: 14%;
        --c-2: hsla(212, 90%, 35%, 1);   --s-start-2: 10.2%;  --s-end-2: 50.46%;  --x-2: 98%;    --y-2: 95%;
        --c-3: hsla(185, 100%, 36%, 1);  --s-start-3: 10.2%;  --s-end-3: 50.46%;  --x-3: 25%;    --y-3: 74%;
        --c-6: hsla(186, 73%, 31%, 1);   --s-start-6: 9%;     --s-end-6: 47.08%;  --x-6: 90%;    --y-6: 93%;
    }
}

.mash-animation-3 {
    --mash-bg: hsla(192, 100%, 5%, 1);
    --mash-animation: mash-key-3 var(--mash-duration, 25s) linear infinite var(--mash-direction, alternate);
    --c-0: hsla(185, 100%, 40%, 1);  --x-0: 95%;    --y-0: 75%;
    --c-1: hsla(192, 100%, 5%, 1);   --x-1: 95%;    --y-1: 15%;
    --c-2: hsla(212, 90%, 35%, 1);   --x-2: 2%;     --y-2: 86%;
    --c-3: hsla(185, 100%, 36%, 1);  --x-3: 93%;    --y-3: 94%;
    --c-4: hsla(210, 100%, 40%, 1);  --x-4: 55%;    --y-4: 101%;
    --c-5: hsla(188, 100%, 13%, 1);  --x-5: 90%;    --y-5: 47%;
    --c-6: hsla(186, 73%, 31%, 1);   --x-6: 46%;    --y-6: 72%;
    --mash-gradient:
        radial-gradient(circle at var(--x-0) var(--y-0), var(--c-0) var(--s-start-0), transparent var(--s-end-0)),
        radial-gradient(circle at var(--x-1) var(--y-1), var(--c-1) var(--s-start-1), transparent var(--s-end-1)),
        radial-gradient(circle at var(--x-2) var(--y-2), var(--c-2) var(--s-start-2), transparent var(--s-end-2)),
        radial-gradient(circle at var(--x-3) var(--y-3), var(--c-3) var(--s-start-3), transparent var(--s-end-3)),
        radial-gradient(circle at var(--x-4) var(--y-4), var(--c-4) var(--s-start-4), transparent var(--s-end-4)),
        radial-gradient(circle at var(--x-5) var(--y-5), var(--c-5) var(--s-start-5), transparent var(--s-end-5)),
        radial-gradient(circle at var(--x-6) var(--y-6), var(--c-6) var(--s-start-6), transparent var(--s-end-6));
}


/* ===============================================
   VARIANTE 4
   Verwendung: <div class="mash-base mash-animation-4">
   =============================================== */

@keyframes mash-key-4 {
    0% {
        --c-0: hsla(193, 100%, 5%, 1);   --s-start-0: 0%;    --s-end-0: 50%;     --x-0: 0.74%;    --y-0: 1.44%;
        --c-1: hsla(193, 100%, 5%, 1);   --s-start-1: 0%;    --s-end-1: 50%;     --x-1: 70.37%;   --y-1: 98.26%;
        --c-2: hsla(186, 74%, 31%, 1);   --s-start-2: 0%;    --s-end-2: 56.05%;  --x-2: 52.70%;   --y-2: 90.37%;
        --c-3: hsla(186, 100%, 36%, 1);  --s-start-3: 5.10%; --s-end-3: 38.74%;  --x-3: 23.68%;   --y-3: 60.14%;
        --c-4: hsla(213, 90%, 35%, 1);   --s-start-4: 0%;    --s-end-4: 50%;     --x-4: 101.29%;  --y-4: 45.57%;
        --c-5: hsla(210, 100%, 40%, 1);  --s-start-5: 17.38%;--s-end-5: 50%;     --x-5: 101.29%;  --y-5: 45.57%;
    }
    100% {
        --c-0: hsla(193, 100%, 5%, 1);   --s-start-0: 7%;    --s-end-0: 62%;     --x-0: 18.55%;   --y-0: 14.95%;
        --c-1: hsla(193, 100%, 5%, 1);   --s-start-1: 7%;    --s-end-1: 62%;     --x-1: 59.04%;   --y-1: 82.47%;
        --c-2: hsla(186, 74%, 31%, 1);   --s-start-2: 7%;    --s-end-2: 63.07%;  --x-2: 43.14%;   --y-2: 61.34%;
        --c-3: hsla(186, 100%, 36%, 1);  --s-start-3: 5.37%; --s-end-3: 39.13%;  --x-3: 2.56%;    --y-3: 72.93%;
        --c-4: hsla(213, 90%, 35%, 1);   --s-start-4: 7%;    --s-end-4: 46.92%;  --x-4: 64.76%;   --y-4: 50.98%;
        --c-5: hsla(210, 100%, 40%, 1);  --s-start-5: 7%;    --s-end-5: 46.92%;  --x-5: 75.92%;   --y-5: 50.49%;
    }
}

.mash-animation-4 {
    --mash-bg: hsla(193, 100%, 5%, 1);
    --mash-animation: mash-key-4 var(--mash-duration, 25s) linear infinite var(--mash-direction, alternate);
    --c-0: hsla(193, 100%, 5%, 1);   --x-0: 0.74%;    --y-0: 1.44%;
    --c-1: hsla(193, 100%, 5%, 1);   --x-1: 70.37%;   --y-1: 98.26%;
    --c-2: hsla(186, 74%, 31%, 1);   --x-2: 52.70%;   --y-2: 90.37%;
    --c-3: hsla(186, 100%, 36%, 1);  --x-3: 23.68%;   --y-3: 60.14%;
    --c-4: hsla(213, 90%, 35%, 1);   --x-4: 101.29%;  --y-4: 45.57%;
    --c-5: hsla(210, 100%, 40%, 1);  --x-5: 101.29%;  --y-5: 45.57%;
    --mash-gradient:
        radial-gradient(circle at var(--x-0) var(--y-0), var(--c-0) var(--s-start-0), transparent var(--s-end-0)),
        radial-gradient(circle at var(--x-1) var(--y-1), var(--c-1) var(--s-start-1), transparent var(--s-end-1)),
        radial-gradient(circle at var(--x-2) var(--y-2), var(--c-2) var(--s-start-2), transparent var(--s-end-2)),
        radial-gradient(circle at var(--x-3) var(--y-3), var(--c-3) var(--s-start-3), transparent var(--s-end-3)),
        radial-gradient(circle at var(--x-4) var(--y-4), var(--c-4) var(--s-start-4), transparent var(--s-end-4)),
        radial-gradient(circle at var(--x-5) var(--y-5), var(--c-5) var(--s-start-5), transparent var(--s-end-5));
}


/* ===============================================
   VARIANTE 5
   Verwendung: <div class="mash-base mash-animation-5">
   =============================================== */

@keyframes mash-key-5 {
    0% {
        --c-0: hsla(193, 100%, 5%, 1);   --s-start-0: 0%;  --s-end-0: 50%;  --x-0: 0.74%;   --y-0: 1.44%;
        --c-1: hsla(186, 100%, 36%, 1);  --s-start-1: 0%;  --s-end-1: 50%;  --x-1: 98.03%;  --y-1: 3.19%;
        --c-2: hsla(186, 74%, 31%, 1);   --s-start-2: 0%;  --s-end-2: 50%;  --x-2: 39.62%;  --y-2: 0.86%;
        --c-3: hsla(213, 90%, 35%, 1);   --s-start-3: 0%;  --s-end-3: 50%;  --x-3: 8%;      --y-3: 90%;
    }
    100% {
        --c-0: hsla(193, 100%, 5%, 1);   --s-start-0: 7%;  --s-end-0: 62%;  --x-0: 15.28%;  --y-0: 29.75%;
        --c-1: hsla(186, 100%, 36%, 1);  --s-start-1: 7%;  --s-end-1: 62%;  --x-1: 74.12%;  --y-1: 37.13%;
        --c-2: hsla(186, 74%, 31%, 1);   --s-start-2: 7%;  --s-end-2: 62%;  --x-2: 45.74%;  --y-2: 43.11%;
        --c-3: hsla(213, 90%, 35%, 1);   --s-start-3: 7%;  --s-end-3: 62%;  --x-3: 27.44%;  --y-3: 55.04%;
    }
}

.mash-animation-5 {
    --mash-bg: hsla(193, 100%, 5%, 1);
    --mash-animation: mash-key-5 var(--mash-duration, 25s) linear infinite var(--mash-direction, alternate);
    --c-0: hsla(193, 100%, 5%, 1);   --x-0: 0.74%;   --y-0: 1.44%;
    --c-1: hsla(186, 100%, 36%, 1);  --x-1: 98.03%;  --y-1: 3.19%;
    --c-2: hsla(186, 74%, 31%, 1);   --x-2: 39.62%;  --y-2: 0.86%;
    --c-3: hsla(213, 90%, 35%, 1);   --x-3: 8%;      --y-3: 90%;
    --mash-gradient:
        radial-gradient(circle at var(--x-0) var(--y-0), var(--c-0) var(--s-start-0), transparent var(--s-end-0)),
        radial-gradient(circle at var(--x-1) var(--y-1), var(--c-1) var(--s-start-1), transparent var(--s-end-1)),
        radial-gradient(circle at var(--x-2) var(--y-2), var(--c-2) var(--s-start-2), transparent var(--s-end-2)),
        radial-gradient(circle at var(--x-3) var(--y-3), var(--c-3) var(--s-start-3), transparent var(--s-end-3));
}


/* ===============================================
   VARIANTE 6
   Verwendung: <div class="mash-base mash-animation-6">
   =============================================== */

@keyframes mash-key-6 {
    0% {
        --c-0: hsla(193, 100%, 5%, 1);   --s-start-0: 0%;  --s-end-0: 50%;     --x-0: 98.16%;  --y-0: 4.85%;
        --c-1: hsla(193, 100%, 5%, 1);   --s-start-1: 0%;  --s-end-1: 50%;     --x-1: 0.74%;   --y-1: 1.44%;
        --c-2: hsla(186, 100%, 36%, 1);  --s-start-2: 0%;  --s-end-2: 38.74%;  --x-2: 100.72%; --y-2: 40.78%;
        --c-3: hsla(186, 74%, 31%, 1);   --s-start-3: 0%;  --s-end-3: 50%;     --x-3: 39.62%;  --y-3: 0.86%;
        --c-4: hsla(213, 90%, 35%, 1);   --s-start-4: 0%;  --s-end-4: 50%;     --x-4: 0.50%;   --y-4: 45.74%;
    }
    100% {
        --c-0: hsla(193, 100%, 5%, 1);   --s-start-0: 7%;  --s-end-0: 62%;     --x-0: 72.12%;  --y-0: 5.67%;
        --c-1: hsla(193, 100%, 5%, 1);   --s-start-1: 7%;  --s-end-1: 62%;     --x-1: 18.55%;  --y-1: 14.95%;
        --c-2: hsla(186, 100%, 36%, 1);  --s-start-2: 7%;  --s-end-2: 31.80%;  --x-2: 67.86%;  --y-2: 53.73%;
        --c-3: hsla(186, 74%, 31%, 1);   --s-start-3: 7%;  --s-end-3: 62%;     --x-3: 45.74%;  --y-3: 43.11%;
        --c-4: hsla(213, 90%, 35%, 1);   --s-start-4: 7%;  --s-end-4: 46.92%;  --x-4: 37.64%;  --y-4: 60.09%;
    }
}

.mash-animation-6 {
    --mash-bg: hsla(193, 100%, 5%, 1);
    --mash-animation: mash-key-6 var(--mash-duration, 25s) linear infinite var(--mash-direction, alternate);
    --c-0: hsla(193, 100%, 5%, 1);   --x-0: 98.16%;  --y-0: 4.85%;
    --c-1: hsla(193, 100%, 5%, 1);   --x-1: 0.74%;   --y-1: 1.44%;
    --c-2: hsla(186, 100%, 36%, 1);  --x-2: 100.72%; --y-2: 40.78%;
    --c-3: hsla(186, 74%, 31%, 1);   --x-3: 39.62%;  --y-3: 0.86%;
    --c-4: hsla(213, 90%, 35%, 1);   --x-4: 0.50%;   --y-4: 45.74%;
    --mash-gradient:
        radial-gradient(circle at var(--x-0) var(--y-0), var(--c-0) var(--s-start-0), transparent var(--s-end-0)),
        radial-gradient(circle at var(--x-1) var(--y-1), var(--c-1) var(--s-start-1), transparent var(--s-end-1)),
        radial-gradient(circle at var(--x-2) var(--y-2), var(--c-2) var(--s-start-2), transparent var(--s-end-2)),
        radial-gradient(circle at var(--x-3) var(--y-3), var(--c-3) var(--s-start-3), transparent var(--s-end-3)),
        radial-gradient(circle at var(--x-4) var(--y-4), var(--c-4) var(--s-start-4), transparent var(--s-end-4));
}


/* ===============================================
   VARIANTE 7
   Verwendung: <div class="mash-base mash-animation-7">
   =============================================== */

@keyframes mash-key-7 {
    0% {
        --c-0: hsla(192, 100%, 5%, 1);    --s-start-0: 9%;  --s-end-0: 55%;  --x-0: 85%;  --y-0: 80%;
        --c-1: hsla(188, 100%, 13%, 0.55);--s-start-1: 5%;  --s-end-1: 72%;  --x-1: 60%;  --y-1: 24%;
        --c-2: hsla(188, 100%, 13%, 0.29);--s-start-2: 5%;  --s-end-2: 52%;  --x-2: 13%;  --y-2: 82%;
    }
    100% {
        --c-0: hsla(192, 100%, 5%, 1);    --s-start-0: 9%;  --s-end-0: 55%;  --x-0: 31%;  --y-0: 94%;
        --c-1: hsla(188, 100%, 13%, 0.58);--s-start-1: 5%;  --s-end-1: 72%;  --x-1: 2%;   --y-1: 25%;
        --c-2: hsla(188, 100%, 13%, 0.37);--s-start-2: 5%;  --s-end-2: 52%;  --x-2: 98%;  --y-2: 20%;
    }
}

.mash-animation-7 {
    --mash-bg: hsla(210, 0%, 0%, 1);
    --mash-animation: mash-key-7 var(--mash-duration, 25s) linear infinite var(--mash-direction, alternate);
    --c-0: hsla(192, 100%, 5%, 1);    --x-0: 85%;  --y-0: 80%;
    --c-1: hsla(188, 100%, 13%, 0.55);--x-1: 60%;  --y-1: 24%;
    --c-2: hsla(188, 100%, 13%, 0.29);--x-2: 13%;  --y-2: 82%;
    --mash-gradient:
        radial-gradient(circle at var(--x-0) var(--y-0), var(--c-0) var(--s-start-0), transparent var(--s-end-0)),
        radial-gradient(circle at var(--x-1) var(--y-1), var(--c-1) var(--s-start-1), transparent var(--s-end-1)),
        radial-gradient(circle at var(--x-2) var(--y-2), var(--c-2) var(--s-start-2), transparent var(--s-end-2));
}


/* ===============================================
   VARIANTE 8
   Verwendung: <div class="mash-base mash-animation-8">
   =============================================== */

@keyframes mash-key-8 {
    0% {
        --c-0: hsla(193, 100%, 5%, 1);   --s-start-0: 0%;    --s-end-0: 50%;     --x-0: 97.78%;   --y-0: 3.93%;
        --c-1: hsla(193, 100%, 5%, 1);   --s-start-1: 0%;    --s-end-1: 50%;     --x-1: 53.44%;   --y-1: 101.03%;
        --c-2: hsla(193, 100%, 5%, 1);   --s-start-2: 0%;    --s-end-2: 50%;     --x-2: 5.83%;    --y-2: 96.80%;
        --c-3: hsla(193, 100%, 5%, 1);   --s-start-3: 0%;    --s-end-3: 50%;     --x-3: 0.74%;    --y-3: 1.44%;
        --c-4: hsla(186, 100%, 36%, 1);  --s-start-4: 5.10%; --s-end-4: 38.74%;  --x-4: 23.68%;   --y-4: 60.14%;
        --c-5: hsla(193, 100%, 5%, 1);   --s-start-5: 0%;    --s-end-5: 50%;     --x-5: 70.37%;   --y-5: 98.26%;
        --c-6: hsla(186, 74%, 31%, 1);   --s-start-6: 0%;    --s-end-6: 56.05%;  --x-6: 52.70%;   --y-6: 90.37%;
        --c-7: hsla(213, 90%, 35%, 1);   --s-start-7: 0%;    --s-end-7: 50%;     --x-7: 101.29%;  --y-7: 45.57%;
        --c-8: hsla(210, 100%, 40%, 1);  --s-start-8: 17.38%;--s-end-8: 50%;     --x-8: 101.29%;  --y-8: 45.57%;
    }
    100% {
        --c-0: hsla(193, 100%, 5%, 1);   --s-start-0: 7%;    --s-end-0: 62%;     --x-0: 69.43%;   --y-0: 13.76%;
        --c-1: hsla(193, 100%, 5%, 1);   --s-start-1: 7%;    --s-end-1: 62%;     --x-1: 100.20%;  --y-1: 70.93%;
        --c-2: hsla(193, 100%, 5%, 1);   --s-start-2: 7%;    --s-end-2: 62%;     --x-2: 38.07%;   --y-2: 89.32%;
        --c-3: hsla(193, 100%, 5%, 1);   --s-start-3: 7%;    --s-end-3: 62%;     --x-3: 26.44%;   --y-3: 17.71%;
        --c-4: hsla(186, 100%, 36%, 1);  --s-start-4: 5.37%; --s-end-4: 39.13%;  --x-4: 2.56%;    --y-4: 72.93%;
        --c-5: hsla(193, 100%, 5%, 1);   --s-start-5: 7%;    --s-end-5: 62%;     --x-5: 59.04%;   --y-5: 82.47%;
        --c-6: hsla(186, 74%, 31%, 1);   --s-start-6: 7%;    --s-end-6: 63.07%;  --x-6: 43.14%;   --y-6: 61.34%;
        --c-7: hsla(213, 90%, 35%, 1);   --s-start-7: 7%;    --s-end-7: 46.92%;  --x-7: 64.76%;   --y-7: 50.98%;
        --c-8: hsla(210, 100%, 40%, 1);  --s-start-8: 7%;    --s-end-8: 46.92%;  --x-8: 69.57%;   --y-8: 52.32%;
    }
}

.mash-animation-8 {
    --mash-bg: hsla(193, 100%, 5%, 1);
    --mash-animation: mash-key-8 var(--mash-duration, 30s) linear infinite var(--mash-direction, alternate-reverse);
    --c-0: hsla(193, 100%, 5%, 1);   --x-0: 97.78%;   --y-0: 3.93%;
    --c-1: hsla(193, 100%, 5%, 1);   --x-1: 53.44%;   --y-1: 101.03%;
    --c-2: hsla(193, 100%, 5%, 1);   --x-2: 5.83%;    --y-2: 96.80%;
    --c-3: hsla(193, 100%, 5%, 1);   --x-3: 0.74%;    --y-3: 1.44%;
    --c-4: hsla(186, 100%, 36%, 1);  --x-4: 23.68%;   --y-4: 60.14%;
    --c-5: hsla(193, 100%, 5%, 1);   --x-5: 70.37%;   --y-5: 98.26%;
    --c-6: hsla(186, 74%, 31%, 1);   --x-6: 52.70%;   --y-6: 90.37%;
    --c-7: hsla(213, 90%, 35%, 1);   --x-7: 101.29%;  --y-7: 45.57%;
    --c-8: hsla(210, 100%, 40%, 1);  --x-8: 101.29%;  --y-8: 45.57%;
    --mash-gradient:
        radial-gradient(circle at var(--x-0) var(--y-0), var(--c-0) var(--s-start-0), transparent var(--s-end-0)),
        radial-gradient(circle at var(--x-1) var(--y-1), var(--c-1) var(--s-start-1), transparent var(--s-end-1)),
        radial-gradient(circle at var(--x-2) var(--y-2), var(--c-2) var(--s-start-2), transparent var(--s-end-2)),
        radial-gradient(circle at var(--x-3) var(--y-3), var(--c-3) var(--s-start-3), transparent var(--s-end-3)),
        radial-gradient(circle at var(--x-4) var(--y-4), var(--c-4) var(--s-start-4), transparent var(--s-end-4)),
        radial-gradient(circle at var(--x-5) var(--y-5), var(--c-5) var(--s-start-5), transparent var(--s-end-5)),
        radial-gradient(circle at var(--x-6) var(--y-6), var(--c-6) var(--s-start-6), transparent var(--s-end-6)),
        radial-gradient(circle at var(--x-7) var(--y-7), var(--c-7) var(--s-start-7), transparent var(--s-end-7)),
        radial-gradient(circle at var(--x-8) var(--y-8), var(--c-8) var(--s-start-8), transparent var(--s-end-8));
}


/* ===============================================
   VARIANTE 9
   Verwendung: <div class="mash-base mash-animation-9">
   =============================================== */

@keyframes mash-key-9 {
    0% {
        --c-0: hsla(193, 100%, 5%, 1);   --s-start-0: 0%;    --s-end-0: 50%;     --x-0: 97.78%;   --y-0: 3.93%;
        --c-1: hsla(193, 100%, 5%, 1);   --s-start-1: 0%;    --s-end-1: 50%;     --x-1: 53.44%;   --y-1: 101.03%;
        --c-2: hsla(193, 100%, 5%, 1);   --s-start-2: 0%;    --s-end-2: 50%;     --x-2: 5.83%;    --y-2: 96.80%;
        --c-3: hsla(193, 100%, 5%, 1);   --s-start-3: 0%;    --s-end-3: 50%;     --x-3: 0.74%;    --y-3: 1.44%;
        --c-4: hsla(186, 100%, 36%, 1);  --s-start-4: 5.10%; --s-end-4: 38.74%;  --x-4: 23.68%;   --y-4: 60.14%;
        --c-5: hsla(193, 100%, 5%, 1);   --s-start-5: 0%;    --s-end-5: 50%;     --x-5: 70.37%;   --y-5: 98.26%;
        --c-6: hsla(186, 74%, 31%, 1);   --s-start-6: 0%;    --s-end-6: 56.05%;  --x-6: 52.70%;   --y-6: 90.37%;
        --c-7: hsla(210, 100%, 40%, 1);  --s-start-7: 17.38%;--s-end-7: 50%;     --x-7: 101.29%;  --y-7: 45.57%;
        --c-8: hsla(213, 90%, 35%, 1);   --s-start-8: 0%;    --s-end-8: 50%;     --x-8: 101.29%;  --y-8: 45.57%;
    }
    100% {
        --c-0: hsla(193, 100%, 5%, 1);   --s-start-0: 7%;    --s-end-0: 62%;     --x-0: 69.43%;   --y-0: 13.76%;
        --c-1: hsla(193, 100%, 5%, 1);   --s-start-1: 7%;    --s-end-1: 62%;     --x-1: 100.20%;  --y-1: 70.93%;
        --c-2: hsla(193, 100%, 5%, 1);   --s-start-2: 7%;    --s-end-2: 62%;     --x-2: 38.07%;   --y-2: 89.32%;
        --c-3: hsla(193, 100%, 5%, 1);   --s-start-3: 7%;    --s-end-3: 62%;     --x-3: 26.44%;   --y-3: 17.71%;
        --c-4: hsla(186, 100%, 36%, 1);  --s-start-4: 5.37%; --s-end-4: 39.13%;  --x-4: 2.56%;    --y-4: 72.93%;
        --c-5: hsla(193, 100%, 5%, 1);   --s-start-5: 7%;    --s-end-5: 62%;     --x-5: 59.04%;   --y-5: 82.47%;
        --c-6: hsla(186, 74%, 31%, 1);   --s-start-6: 7%;    --s-end-6: 63.07%;  --x-6: 43.14%;   --y-6: 61.34%;
        --c-7: hsla(210, 100%, 40%, 1);  --s-start-7: 7%;    --s-end-7: 46.92%;  --x-7: 69.57%;   --y-7: 52.32%;
        --c-8: hsla(213, 90%, 35%, 1);   --s-start-8: 7%;    --s-end-8: 46.92%;  --x-8: 64.76%;   --y-8: 50.98%;
    }
}

.mash-animation-9 {
    --mash-bg: hsla(193, 100%, 5%, 1);
    --mash-animation: mash-key-9 var(--mash-duration, 40s) linear infinite var(--mash-direction, alternate);
    --c-0: hsla(193, 100%, 5%, 1);   --x-0: 97.78%;   --y-0: 3.93%;
    --c-1: hsla(193, 100%, 5%, 1);   --x-1: 53.44%;   --y-1: 101.03%;
    --c-2: hsla(193, 100%, 5%, 1);   --x-2: 5.83%;    --y-2: 96.80%;
    --c-3: hsla(193, 100%, 5%, 1);   --x-3: 0.74%;    --y-3: 1.44%;
    --c-4: hsla(186, 100%, 36%, 1);  --x-4: 23.68%;   --y-4: 60.14%;
    --c-5: hsla(193, 100%, 5%, 1);   --x-5: 70.37%;   --y-5: 98.26%;
    --c-6: hsla(186, 74%, 31%, 1);   --x-6: 52.70%;   --y-6: 90.37%;
    --c-7: hsla(210, 100%, 40%, 1);  --x-7: 101.29%;  --y-7: 45.57%;
    --c-8: hsla(213, 90%, 35%, 1);   --x-8: 101.29%;  --y-8: 45.57%;
    --mash-gradient:
        radial-gradient(circle at var(--x-0) var(--y-0), var(--c-0) var(--s-start-0), transparent var(--s-end-0)),
        radial-gradient(circle at var(--x-1) var(--y-1), var(--c-1) var(--s-start-1), transparent var(--s-end-1)),
        radial-gradient(circle at var(--x-2) var(--y-2), var(--c-2) var(--s-start-2), transparent var(--s-end-2)),
        radial-gradient(circle at var(--x-3) var(--y-3), var(--c-3) var(--s-start-3), transparent var(--s-end-3)),
        radial-gradient(circle at var(--x-4) var(--y-4), var(--c-4) var(--s-start-4), transparent var(--s-end-4)),
        radial-gradient(circle at var(--x-5) var(--y-5), var(--c-5) var(--s-start-5), transparent var(--s-end-5)),
        radial-gradient(circle at var(--x-6) var(--y-6), var(--c-6) var(--s-start-6), transparent var(--s-end-6)),
        radial-gradient(circle at var(--x-7) var(--y-7), var(--c-7) var(--s-start-7), transparent var(--s-end-7)),
        radial-gradient(circle at var(--x-8) var(--y-8), var(--c-8) var(--s-start-8), transparent var(--s-end-8));
}


/* ===============================================
   VARIANTE 11
   Verwendung: <div class="mash-base mash-animation-11">
   =============================================== */

@keyframes mash-key-11 {
    0% {
        --c-4: hsla(186, 100%, 36%, 1);  --s-start-4: 1%;  --s-end-4: 47%;     --x-4: 52.02%;  --y-4: 34.17%;
        --c-6: hsla(186, 74%, 31%, 1);   --s-start-6: 0%;  --s-end-6: 50%;     --x-6: 64%;     --y-6: 9%;
        --c-7: hsla(213, 90%, 35%, 1);   --s-start-7: 0%;  --s-end-7: 31%;     --x-7: 91.32%;  --y-7: 36.08%;
        --c-8: hsla(186, 100%, 36%, 1);  --s-start-8: 1%;  --s-end-8: 44%;     --x-8: 29.49%;  --y-8: 57.89%;
    }
    50% {
        --c-4: hsla(186, 100%, 36%, 1);  --s-start-4: 0%;  --s-end-4: 48%;     --x-4: 40.95%;  --y-4: 37.08%;
        --c-6: hsla(186, 74%, 31%, 1);   --s-start-6: 0%;  --s-end-6: 50%;     --x-6: 85.87%;  --y-6: 39.11%;
        --c-7: hsla(213, 90%, 35%, 1);   --s-start-7: 0%;  --s-end-7: 31%;     --x-7: 87.44%;  --y-7: 60.60%;
        --c-8: hsla(186, 100%, 36%, 1);  --s-start-8: 0%;  --s-end-8: 66.01%;  --x-8: 41.28%;  --y-8: 53.36%;
    }
    100% {
        --c-4: hsla(186, 100%, 36%, 1);  --s-start-4: 0%;  --s-end-4: 58.17%;  --x-4: 27.23%;  --y-4: 33.95%;
        --c-7: hsla(213, 90%, 35%, 1);   --s-start-7: 0%;  --s-end-7: 26%;     --x-7: 68.26%;  --y-7: 75.07%;
        --c-8: hsla(186, 100%, 36%, 1);  --s-start-8: 0%;  --s-end-8: 43%;     --x-8: 54.91%;  --y-8: 60.28%;
    }
}

.mash-animation-11 {
    --mash-bg: hsla(192, 100%, 5%, 1);
    --mash-animation: mash-key-11 var(--mash-duration, 15s) linear infinite var(--mash-direction, alternate);
    --c-0: hsla(193, 100%, 5%, 1);       --x-0: 98.87%;  --y-0: 1.45%;
    --c-1: hsla(193, 100%, 5%, 1);       --x-1: 97.99%;  --y-1: 89.69%;
    --c-2: hsla(193, 100%, 5%, 1);       --x-2: 77.96%;  --y-2: 99.04%;
    --c-3: hsla(193, 100%, 5%, 0.61);    --x-3: 1.84%;   --y-3: 98.64%;
    --c-4: hsla(186, 100%, 36%, 1);      --x-4: 52.02%;  --y-4: 34.17%;
    --c-5: hsla(193, 100%, 5%, 1);       --x-5: 2.25%;   --y-5: 2.36%;
    --c-6: hsla(186, 74%, 31%, 1);       --x-6: 64%;     --y-6: 9%;
    --c-7: hsla(213, 90%, 35%, 1);       --x-7: 91.32%;  --y-7: 36.08%;
    --c-8: hsla(186, 100%, 36%, 1);      --x-8: 29.49%;  --y-8: 57.89%;
    --mash-gradient:
        radial-gradient(circle at var(--x-0) var(--y-0), var(--c-0) var(--s-start-0), transparent var(--s-end-0)),
        radial-gradient(circle at var(--x-1) var(--y-1), var(--c-1) var(--s-start-1), transparent var(--s-end-1)),
        radial-gradient(circle at var(--x-2) var(--y-2), var(--c-2) var(--s-start-2), transparent var(--s-end-2)),
        radial-gradient(circle at var(--x-3) var(--y-3), var(--c-3) var(--s-start-3), transparent var(--s-end-3)),
        radial-gradient(circle at var(--x-4) var(--y-4), var(--c-4) var(--s-start-4), transparent var(--s-end-4)),
        radial-gradient(circle at var(--x-5) var(--y-5), var(--c-5) var(--s-start-5), transparent var(--s-end-5)),
        radial-gradient(circle at var(--x-6) var(--y-6), var(--c-6) var(--s-start-6), transparent var(--s-end-6)),
        radial-gradient(circle at var(--x-7) var(--y-7), var(--c-7) var(--s-start-7), transparent var(--s-end-7)),
        radial-gradient(circle at var(--x-8) var(--y-8), var(--c-8) var(--s-start-8), transparent var(--s-end-8));
}


/* ===============================================
   VARIANTE 12
   Verwendung: <div class="mash-base mash-animation-12">
   =============================================== */

@keyframes mash-key-12 {
    0% {
        --c-1: hsla(186, 100%, 36%, 1);  --s-start-1: 1%;  --s-end-1: 47%;     --x-1: 52.02%;  --y-1: 34.17%;
        --c-3: hsla(186, 74%, 31%, 1);   --s-start-3: 0%;  --s-end-3: 50%;     --x-3: 64%;     --y-3: 9%;
        --c-4: hsla(213, 90%, 35%, 1);   --s-start-4: 0%;  --s-end-4: 31%;     --x-4: 91.32%;  --y-4: 36.08%;
        --c-5: hsla(186, 100%, 36%, 1);  --s-start-5: 1%;  --s-end-5: 44%;     --x-5: 29.49%;  --y-5: 57.89%;
    }
    50% {
        --c-1: hsla(186, 100%, 36%, 1);  --s-start-1: 0%;  --s-end-1: 48%;     --x-1: 40.95%;  --y-1: 37.08%;
        --c-3: hsla(186, 74%, 31%, 1);   --s-start-3: 0%;  --s-end-3: 50%;     --x-3: 85.87%;  --y-3: 39.11%;
        --c-4: hsla(213, 90%, 35%, 1);   --s-start-4: 0%;  --s-end-4: 31%;     --x-4: 87.44%;  --y-4: 60.60%;
        --c-5: hsla(186, 100%, 36%, 1);  --s-start-5: 0%;  --s-end-5: 66.01%;  --x-5: 41.28%;  --y-5: 53.36%;
    }
    100% {
        --c-1: hsla(186, 100%, 36%, 1);  --s-start-1: 0%;  --s-end-1: 58.17%;  --x-1: 27.23%;  --y-1: 33.95%;
        --c-4: hsla(213, 90%, 35%, 1);   --s-start-4: 0%;  --s-end-4: 26%;     --x-4: 68.26%;  --y-4: 75.07%;
        --c-5: hsla(186, 100%, 36%, 1);  --s-start-5: 0%;  --s-end-5: 43%;     --x-5: 54.91%;  --y-5: 60.28%;
    }
}

.mash-animation-12 {
    --mash-bg: hsla(192, 100%, 5%, 1);
    --mash-animation: mash-key-12 var(--mash-duration, 15s) linear infinite var(--mash-direction, alternate);
    --c-0: hsla(193, 100%, 5%, 1);       --x-0: 98.87%;  --y-0: 1.45%;
    --c-1: hsla(186, 100%, 36%, 1);      --x-1: 52.02%;  --y-1: 34.17%;
    --c-2: hsla(193, 100%, 5%, 1);       --x-2: 2.25%;   --y-2: 2.36%;
    --c-3: hsla(186, 74%, 31%, 1);       --x-3: 64%;     --y-3: 9%;
    --c-4: hsla(213, 90%, 35%, 1);       --x-4: 91.32%;  --y-4: 36.08%;
    --c-5: hsla(186, 100%, 36%, 1);      --x-5: 29.49%;  --y-5: 57.89%;
    --mash-gradient:
        radial-gradient(circle at var(--x-0) var(--y-0), var(--c-0) var(--s-start-0), transparent var(--s-end-0)),
        radial-gradient(circle at var(--x-1) var(--y-1), var(--c-1) var(--s-start-1), transparent var(--s-end-1)),
        radial-gradient(circle at var(--x-2) var(--y-2), var(--c-2) var(--s-start-2), transparent var(--s-end-2)),
        radial-gradient(circle at var(--x-3) var(--y-3), var(--c-3) var(--s-start-3), transparent var(--s-end-3)),
        radial-gradient(circle at var(--x-4) var(--y-4), var(--c-4) var(--s-start-4), transparent var(--s-end-4)),
        radial-gradient(circle at var(--x-5) var(--y-5), var(--c-5) var(--s-start-5), transparent var(--s-end-5));
}


/* ===============================================
   Statischer Gradient (kein mash-base nötig)
   =============================================== */

#mash-gradient-1 {
    background-color: hsla(186, 73%, 31%, 1);
    background-image:
        radial-gradient(circle at 87% 90%, hsla(192, 100%, 5%, 1) 0%, transparent 68.49%),
        radial-gradient(circle at 39% 88%, hsla(192, 100%, 5%, 1) 5.85%, transparent 78.62%),
        radial-gradient(circle at 92% 65%, hsla(192, 100%, 5%, 1) 5.85%, transparent 78.62%);
}