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

body.onepage {
    background-color: var(--bs-surface-975);
}

.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;
}

/* menu-section-index */

.menu-section-index ul .nav-link {
    font-weight: var(--bs-font-weight-bold);
    text-transform: lowercase;
}

.menu-section-index ul .nav-link span::after {
    content: ".";
}

.slider-container .slide-visible > * {
    scroll-margin-top: 10rem;
}



/* ===============================================
   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;
}

@media (prefers-reduced-motion: reduce) {
    .mash-base {
        animation: none !important;
    }
}

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

@keyframes mash-key-1 {
    0% {
        --c-1: var(--bs-primary-600); --s-start-1: 0%; --s-end-1: 50%;    --x-1: 10%;    --y-1: 100%;
        --c-2: var(--bs-secondary-700);  --s-start-2: 0%; --s-end-2: 50%;    --x-2: 90.58%; --y-2: 60.40%;
        --c-3: var(--bs-primary-700);  --s-start-3: 0%; --s-end-3: 50%;    --x-3: 64%;    --y-3: 9%;
    }
    50% {
        --c-1: var(--bs-primary-600); --s-start-1: 0%; --s-end-1: 66.01%; --x-1: 32.01%; --y-1: 50.85%;
        --c-2: var(--bs-secondary-700);  --s-start-2: 0%; --s-end-2: 50%;    --x-2: 77.70%; --y-2: 48.64%;
        --c-3: var(--bs-primary-700);  --s-start-3: 0%; --s-end-3: 50%;    --x-3: 85.87%; --y-3: 39.11%;
    }
    100% {
        --c-1: var(--bs-primary-600); --s-start-1: 0%; --s-end-1: 58.17%; --x-1: 49.22%; --y-1: 93.04%;
        --c-2: var(--bs-secondary-700);  --s-start-2: 0%; --s-end-2: 50%;    --x-2: 68.46%; --y-2: 91.85%;
    }
}

.mash-animation-1 {
    --mash-bg: var(--bs-surface-975);
    --mash-animation: mash-key-1 var(--mash-duration, 15s) linear infinite var(--mash-direction, alternate);
    --c-0: var(--bs-surface-975); --x-0: 9.556%; --y-0: 12.106%;
    --c-1: var(--bs-primary-600); --x-1: 10%; --y-1: 100%;
    --c-2: var(--bs-secondary-700);  --x-2: 90.58%; --y-2: 60.40%;
    --c-3: var(--bs-primary-700);  --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: var(--bs-surface-975);  --s-start-0: 1%;  --s-end-0: 61%; --x-0: 91%; --y-0: 90%;
        --c-1: #000;    --s-start-1: 0%;  --s-end-1: 55%; --x-1: 17%; --y-1: 24%;
        --c-2: var(--bs-primary-900);--s-start-2: 19%; --s-end-2: 54%; --x-2: 11%; --y-2: 32%;
        --c-3: var(--bs-primary-600);--s-start-3: 0%;  --s-end-3: 67%; --x-3: 2%;  --y-3: 31%;
        --c-4: var(--bs-surface-975);  --s-start-4: 12%; --s-end-4: 82%; --x-4: 74%; --y-4: 93%;
    }
    100% {
        --c-0: var(--bs-surface-975);  --s-start-0: 19%; --s-end-0: 69%; --x-0: 49%; --y-0: 25%;
        --c-1: #000;   --s-start-1: 3%;  --s-end-1: 77%; --x-1: 1%;  --y-1: 41%;
        --c-2: #000;   --s-start-2: 6%;  --s-end-2: 73%; --x-2: 44%; --y-2: 93%;
        --c-3: var(--bs-primary-500);--s-start-3: 8%;  --s-end-3: 86%; --x-3: 97%; --y-3: 51%;
        --c-4: var(--bs-surface-975); --s-start-4: 20%; --s-end-4: 75%; --x-4: 10%; --y-4: 69%;
    }
}

.mash-animation-2 {
    --mash-bg: var(--bs-surface-975);
    --mash-animation: mash-key-2 var(--mash-duration, 25s) linear infinite var(--mash-direction, alternate);
    --c-0: var(--bs-surface-975);   --x-0: 91%;    --y-0: 90%;
    --c-1: #000;     --x-1: 17%;    --y-1: 24%;
    --c-2: var(--bs-primary-900); --x-2: 11%;    --y-2: 32%;
    --c-3: var(--bs-primary-600); --x-3: 2%;     --y-3: 31%;
    --c-4: var(--bs-surface-975);   --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: var(--bs-primary-500);  --s-start-0: 8%;     --s-end-0: 56.59%;  --x-0: 95%;    --y-0: 75%;
        --c-1: var(--bs-surface-975);   --s-start-1: 1%;     --s-end-1: 62.39%;  --x-1: 95%;    --y-1: 15%;
        --c-2: var(--bs-secondary-700);   --s-start-2: 8.39%;  --s-end-2: 48.53%;  --x-2: 2%;     --y-2: 86%;
        --c-3: var(--bs-primary-600);  --s-start-3: 8.39%;  --s-end-3: 48.53%;  --x-3: 93%;    --y-3: 94%;
        --c-4: var(--bs-secondary-600);  --s-start-4: 18%;    --s-end-4: 49.94%;  --x-4: 55%;    --y-4: 101%;
        --c-5: var(--bs-primary-900);  --s-start-5: 11.13%; --s-end-5: 51.76%;  --x-5: 90%;    --y-5: 47%;
        --c-6: var(--bs-primary-700);   --s-start-6: 6%;     --s-end-6: 36.02%;  --x-6: 46%;    --y-6: 72%;
    }
    50% {
        --c-0: var(--bs-primary-500);  --s-start-0: 9%;     --s-end-0: 47.63%;  --x-0: 25%;    --y-0: 90%;
        --c-1: var(--bs-surface-975);   --s-start-1: 9%;     --s-end-1: 73%;     --x-1: 3%;     --y-1: 12%;
        --c-2: var(--bs-secondary-700);   --s-start-2: 9%;     --s-end-2: 49.05%;  --x-2: 75%;    --y-2: 71%;
        --c-3: var(--bs-primary-600);  --s-start-3: 9%;     --s-end-3: 49.05%;  --x-3: 51%;    --y-3: 97%;
        --c-4: var(--bs-secondary-600);  --s-start-4: 9%;     --s-end-4: 49.07%;  --x-4: 28%;    --y-4: 75%;
        --c-5: var(--bs-primary-900);  --s-start-5: 9%;     --s-end-5: 49.49%;  --x-5: 42%;    --y-5: 102%;
        --c-6: var(--bs-primary-700);   --s-start-6: 9%;     --s-end-6: 47.08%;  --x-6: 42%;    --y-6: 97%;
    }
    100% {
        --c-1: var(--bs-surface-975);   --s-start-1: 9%;     --s-end-1: 38.76%;  --x-1: 54%;    --y-1: 14%;
        --c-2: var(--bs-secondary-700);   --s-start-2: 10.2%;  --s-end-2: 50.46%;  --x-2: 98%;    --y-2: 95%;
        --c-3: var(--bs-primary-600);  --s-start-3: 10.2%;  --s-end-3: 50.46%;  --x-3: 25%;    --y-3: 74%;
        --c-6: var(--bs-primary-700);   --s-start-6: 9%;     --s-end-6: 47.08%;  --x-6: 90%;    --y-6: 93%;
    }
}

.mash-animation-3 {
    --mash-bg: var(--bs-surface-975);
    --mash-animation: mash-key-3 var(--mash-duration, 25s) linear infinite var(--mash-direction, alternate);
    --c-0: var(--bs-primary-500);  --x-0: 95%;    --y-0: 75%;
    --c-1: var(--bs-surface-975);   --x-1: 95%;    --y-1: 15%;
    --c-2: var(--bs-secondary-700);   --x-2: 2%;     --y-2: 86%;
    --c-3: var(--bs-primary-600);  --x-3: 93%;    --y-3: 94%;
    --c-4: var(--bs-secondary-600);  --x-4: 55%;    --y-4: 101%;
    --c-5: var(--bs-primary-900);  --x-5: 90%;    --y-5: 47%;
    --c-6: var(--bs-primary-700);   --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: var(--bs-surface-975);   --s-start-0: 0%;    --s-end-0: 50%;     --x-0: 0.74%;    --y-0: 1.44%;
        --c-1: var(--bs-surface-975);   --s-start-1: 0%;    --s-end-1: 50%;     --x-1: 70.37%;   --y-1: 98.26%;
        --c-2: var(--bs-primary-700);   --s-start-2: 0%;    --s-end-2: 56.05%;  --x-2: 52.70%;   --y-2: 90.37%;
        --c-3: var(--bs-primary-600);  --s-start-3: 5.10%; --s-end-3: 38.74%;  --x-3: 23.68%;   --y-3: 60.14%;
        --c-4: var(--bs-secondary-700);   --s-start-4: 0%;    --s-end-4: 50%;     --x-4: 101.29%;  --y-4: 45.57%;
        --c-5: var(--bs-secondary-600);  --s-start-5: 17.38%;--s-end-5: 50%;     --x-5: 101.29%;  --y-5: 45.57%;
    }
    100% {
        --c-0: var(--bs-surface-975);   --s-start-0: 7%;    --s-end-0: 62%;     --x-0: 18.55%;   --y-0: 14.95%;
        --c-1: var(--bs-surface-975);   --s-start-1: 7%;    --s-end-1: 62%;     --x-1: 59.04%;   --y-1: 82.47%;
        --c-2: var(--bs-primary-700);   --s-start-2: 7%;    --s-end-2: 63.07%;  --x-2: 43.14%;   --y-2: 61.34%;
        --c-3: var(--bs-primary-600);  --s-start-3: 5.37%; --s-end-3: 39.13%;  --x-3: 2.56%;    --y-3: 72.93%;
        --c-4: var(--bs-secondary-700);   --s-start-4: 7%;    --s-end-4: 46.92%;  --x-4: 64.76%;   --y-4: 50.98%;
        --c-5: var(--bs-secondary-600);  --s-start-5: 7%;    --s-end-5: 46.92%;  --x-5: 75.92%;   --y-5: 50.49%;
    }
}

.mash-animation-4 {
    --mash-bg: var(--bs-surface-975);
    --mash-animation: mash-key-4 var(--mash-duration, 25s) linear infinite var(--mash-direction, alternate);
    --c-0: var(--bs-surface-975);   --x-0: 0.74%;    --y-0: 1.44%;
    --c-1: var(--bs-surface-975);   --x-1: 70.37%;   --y-1: 98.26%;
    --c-2: var(--bs-primary-700);   --x-2: 52.70%;   --y-2: 90.37%;
    --c-3: var(--bs-primary-600);  --x-3: 23.68%;   --y-3: 60.14%;
    --c-4: var(--bs-secondary-700);   --x-4: 101.29%;  --y-4: 45.57%;
    --c-5: var(--bs-secondary-600);  --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: var(--bs-surface-975);   --s-start-0: 0%;  --s-end-0: 50%;  --x-0: 0.74%;   --y-0: 1.44%;
        --c-1: var(--bs-primary-600);  --s-start-1: 0%;  --s-end-1: 50%;  --x-1: 98.03%;  --y-1: 3.19%;
        --c-2: var(--bs-primary-700);   --s-start-2: 0%;  --s-end-2: 50%;  --x-2: 39.62%;  --y-2: 0.86%;
        --c-3: var(--bs-secondary-700);   --s-start-3: 0%;  --s-end-3: 50%;  --x-3: 8%;      --y-3: 90%;
    }
    100% {
        --c-0: var(--bs-surface-975);   --s-start-0: 7%;  --s-end-0: 62%;  --x-0: 15.28%;  --y-0: 29.75%;
        --c-1: var(--bs-primary-600);  --s-start-1: 7%;  --s-end-1: 62%;  --x-1: 74.12%;  --y-1: 37.13%;
        --c-2: var(--bs-primary-700);   --s-start-2: 7%;  --s-end-2: 62%;  --x-2: 45.74%;  --y-2: 43.11%;
        --c-3: var(--bs-secondary-700);   --s-start-3: 7%;  --s-end-3: 62%;  --x-3: 27.44%;  --y-3: 55.04%;
    }
}

.mash-animation-5 {
    --mash-bg: var(--bs-surface-975);
    --mash-animation: mash-key-5 var(--mash-duration, 25s) linear infinite var(--mash-direction, alternate);
    --c-0: var(--bs-surface-975);   --x-0: 0.74%;   --y-0: 1.44%;
    --c-1: var(--bs-primary-600);  --x-1: 98.03%;  --y-1: 3.19%;
    --c-2: var(--bs-primary-700);   --x-2: 39.62%;  --y-2: 0.86%;
    --c-3: var(--bs-secondary-700);   --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: var(--bs-surface-975);   --s-start-0: 0%;  --s-end-0: 50%;     --x-0: 98.16%;  --y-0: 4.85%;
        --c-1: var(--bs-surface-975);   --s-start-1: 0%;  --s-end-1: 50%;     --x-1: 0.74%;   --y-1: 1.44%;
        --c-2: var(--bs-primary-600);  --s-start-2: 0%;  --s-end-2: 38.74%;  --x-2: 100.72%; --y-2: 40.78%;
        --c-3: var(--bs-primary-700);   --s-start-3: 0%;  --s-end-3: 50%;     --x-3: 39.62%;  --y-3: 0.86%;
        --c-4: var(--bs-secondary-700);   --s-start-4: 0%;  --s-end-4: 50%;     --x-4: 0.50%;   --y-4: 45.74%;
    }
    100% {
        --c-0: var(--bs-surface-975);   --s-start-0: 7%;  --s-end-0: 62%;     --x-0: 72.12%;  --y-0: 5.67%;
        --c-1: var(--bs-surface-975);   --s-start-1: 7%;  --s-end-1: 62%;     --x-1: 18.55%;  --y-1: 14.95%;
        --c-2: var(--bs-primary-600);  --s-start-2: 7%;  --s-end-2: 31.80%;  --x-2: 67.86%;  --y-2: 53.73%;
        --c-3: var(--bs-primary-700);   --s-start-3: 7%;  --s-end-3: 62%;     --x-3: 45.74%;  --y-3: 43.11%;
        --c-4: var(--bs-secondary-700);   --s-start-4: 7%;  --s-end-4: 46.92%;  --x-4: 37.64%;  --y-4: 60.09%;
    }
}

.mash-animation-6 {
    --mash-bg: var(--bs-surface-975);
    --mash-animation: mash-key-6 var(--mash-duration, 25s) linear infinite var(--mash-direction, alternate);
    --c-0: var(--bs-surface-975);   --x-0: 98.16%;  --y-0: 4.85%;
    --c-1: var(--bs-surface-975);   --x-1: 0.74%;   --y-1: 1.44%;
    --c-2: var(--bs-primary-600);  --x-2: 100.72%; --y-2: 40.78%;
    --c-3: var(--bs-primary-700);   --x-3: 39.62%;  --y-3: 0.86%;
    --c-4: var(--bs-secondary-700);   --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: var(--bs-surface-975);    --s-start-0: 9%;  --s-end-0: 55%;  --x-0: 85%;  --y-0: 80%;
        --c-1: color-mix(in srgb, var(--bs-primary-900) 55%, transparent);--s-start-1: 5%;  --s-end-1: 72%;  --x-1: 60%;  --y-1: 24%;
        --c-2: color-mix(in srgb, var(--bs-primary-900) 29%, transparent);--s-start-2: 5%;  --s-end-2: 52%;  --x-2: 13%;  --y-2: 82%;
    }
    100% {
        --c-0: var(--bs-surface-975);    --s-start-0: 9%;  --s-end-0: 55%;  --x-0: 31%;  --y-0: 94%;
        --c-1: color-mix(in srgb, var(--bs-primary-900) 58%, transparent);--s-start-1: 5%;  --s-end-1: 72%;  --x-1: 2%;   --y-1: 25%;
        --c-2: color-mix(in srgb, var(--bs-primary-900) 37%, transparent);--s-start-2: 5%;  --s-end-2: 52%;  --x-2: 98%;  --y-2: 20%;
    }
}

.mash-animation-7 {
    --mash-bg: #000;
    --mash-animation: mash-key-7 var(--mash-duration, 25s) linear infinite var(--mash-direction, alternate);
    --c-0: var(--bs-surface-975);    --x-0: 85%;  --y-0: 80%;
    --c-1: color-mix(in srgb, var(--bs-primary-900) 55%, transparent);--x-1: 60%;  --y-1: 24%;
    --c-2: color-mix(in srgb, var(--bs-primary-900) 29%, transparent);--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: var(--bs-surface-975);   --s-start-0: 0%;    --s-end-0: 50%;     --x-0: 97.78%;   --y-0: 3.93%;
        --c-1: var(--bs-surface-975);   --s-start-1: 0%;    --s-end-1: 50%;     --x-1: 53.44%;   --y-1: 101.03%;
        --c-2: var(--bs-surface-975);   --s-start-2: 0%;    --s-end-2: 50%;     --x-2: 5.83%;    --y-2: 96.80%;
        --c-3: var(--bs-surface-975);   --s-start-3: 0%;    --s-end-3: 50%;     --x-3: 0.74%;    --y-3: 1.44%;
        --c-4: var(--bs-primary-600);  --s-start-4: 5.10%; --s-end-4: 38.74%;  --x-4: 23.68%;   --y-4: 60.14%;
        --c-5: var(--bs-surface-975);   --s-start-5: 0%;    --s-end-5: 50%;     --x-5: 70.37%;   --y-5: 98.26%;
        --c-6: var(--bs-primary-700);   --s-start-6: 0%;    --s-end-6: 56.05%;  --x-6: 52.70%;   --y-6: 90.37%;
        --c-7: var(--bs-secondary-700);   --s-start-7: 0%;    --s-end-7: 50%;     --x-7: 101.29%;  --y-7: 45.57%;
        --c-8: var(--bs-secondary-600);  --s-start-8: 17.38%;--s-end-8: 50%;     --x-8: 101.29%;  --y-8: 45.57%;
    }
    100% {
        --c-0: var(--bs-surface-975);   --s-start-0: 7%;    --s-end-0: 62%;     --x-0: 69.43%;   --y-0: 13.76%;
        --c-1: var(--bs-surface-975);   --s-start-1: 7%;    --s-end-1: 62%;     --x-1: 100.20%;  --y-1: 70.93%;
        --c-2: var(--bs-surface-975);   --s-start-2: 7%;    --s-end-2: 62%;     --x-2: 38.07%;   --y-2: 89.32%;
        --c-3: var(--bs-surface-975);   --s-start-3: 7%;    --s-end-3: 62%;     --x-3: 26.44%;   --y-3: 17.71%;
        --c-4: var(--bs-primary-600);  --s-start-4: 5.37%; --s-end-4: 39.13%;  --x-4: 2.56%;    --y-4: 72.93%;
        --c-5: var(--bs-surface-975);   --s-start-5: 7%;    --s-end-5: 62%;     --x-5: 59.04%;   --y-5: 82.47%;
        --c-6: var(--bs-primary-700);   --s-start-6: 7%;    --s-end-6: 63.07%;  --x-6: 43.14%;   --y-6: 61.34%;
        --c-7: var(--bs-secondary-700);   --s-start-7: 7%;    --s-end-7: 46.92%;  --x-7: 64.76%;   --y-7: 50.98%;
        --c-8: var(--bs-secondary-600);  --s-start-8: 7%;    --s-end-8: 46.92%;  --x-8: 69.57%;   --y-8: 52.32%;
    }
}

.mash-animation-8 {
    --mash-bg: var(--bs-surface-975);
    --mash-animation: mash-key-8 var(--mash-duration, 30s) linear infinite var(--mash-direction, alternate-reverse);
    --c-0: var(--bs-surface-975);   --x-0: 97.78%;   --y-0: 3.93%;
    --c-1: var(--bs-surface-975);   --x-1: 53.44%;   --y-1: 101.03%;
    --c-2: var(--bs-surface-975);   --x-2: 5.83%;    --y-2: 96.80%;
    --c-3: var(--bs-surface-975);   --x-3: 0.74%;    --y-3: 1.44%;
    --c-4: var(--bs-primary-600);  --x-4: 23.68%;   --y-4: 60.14%;
    --c-5: var(--bs-surface-975);   --x-5: 70.37%;   --y-5: 98.26%;
    --c-6: var(--bs-primary-700);   --x-6: 52.70%;   --y-6: 90.37%;
    --c-7: var(--bs-secondary-700);   --x-7: 101.29%;  --y-7: 45.57%;
    --c-8: var(--bs-secondary-600);  --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: var(--bs-surface-975);   --s-start-0: 0%;    --s-end-0: 50%;     --x-0: 97.78%;   --y-0: 3.93%;
        --c-1: var(--bs-surface-975);   --s-start-1: 0%;    --s-end-1: 50%;     --x-1: 53.44%;   --y-1: 101.03%;
        --c-2: var(--bs-surface-975);   --s-start-2: 0%;    --s-end-2: 50%;     --x-2: 5.83%;    --y-2: 96.80%;
        --c-3: var(--bs-surface-975);   --s-start-3: 0%;    --s-end-3: 50%;     --x-3: 0.74%;    --y-3: 1.44%;
        --c-4: var(--bs-primary-600);  --s-start-4: 5.10%; --s-end-4: 38.74%;  --x-4: 23.68%;   --y-4: 60.14%;
        --c-5: var(--bs-surface-975);   --s-start-5: 0%;    --s-end-5: 50%;     --x-5: 70.37%;   --y-5: 98.26%;
        --c-6: var(--bs-primary-700);   --s-start-6: 0%;    --s-end-6: 56.05%;  --x-6: 52.70%;   --y-6: 90.37%;
        --c-7: var(--bs-secondary-600);  --s-start-7: 17.38%;--s-end-7: 50%;     --x-7: 101.29%;  --y-7: 45.57%;
        --c-8: var(--bs-secondary-700);   --s-start-8: 0%;    --s-end-8: 50%;     --x-8: 101.29%;  --y-8: 45.57%;
    }
    100% {
        --c-0: var(--bs-surface-975);   --s-start-0: 7%;    --s-end-0: 62%;     --x-0: 69.43%;   --y-0: 13.76%;
        --c-1: var(--bs-surface-975);   --s-start-1: 7%;    --s-end-1: 62%;     --x-1: 100.20%;  --y-1: 70.93%;
        --c-2: var(--bs-surface-975);   --s-start-2: 7%;    --s-end-2: 62%;     --x-2: 38.07%;   --y-2: 89.32%;
        --c-3: var(--bs-surface-975);   --s-start-3: 7%;    --s-end-3: 62%;     --x-3: 26.44%;   --y-3: 17.71%;
        --c-4: var(--bs-primary-600);  --s-start-4: 5.37%; --s-end-4: 39.13%;  --x-4: 2.56%;    --y-4: 72.93%;
        --c-5: var(--bs-surface-975);   --s-start-5: 7%;    --s-end-5: 62%;     --x-5: 59.04%;   --y-5: 82.47%;
        --c-6: var(--bs-primary-700);   --s-start-6: 7%;    --s-end-6: 63.07%;  --x-6: 43.14%;   --y-6: 61.34%;
        --c-7: var(--bs-secondary-600);  --s-start-7: 7%;    --s-end-7: 46.92%;  --x-7: 69.57%;   --y-7: 52.32%;
        --c-8: var(--bs-secondary-700);   --s-start-8: 7%;    --s-end-8: 46.92%;  --x-8: 64.76%;   --y-8: 50.98%;
    }
}

.mash-animation-9 {
    --mash-bg: var(--bs-surface-975);
    --mash-animation: mash-key-9 var(--mash-duration, 40s) linear infinite var(--mash-direction, alternate);
    --c-0: var(--bs-surface-975);   --x-0: 97.78%;   --y-0: 3.93%;
    --c-1: var(--bs-surface-975);   --x-1: 53.44%;   --y-1: 101.03%;
    --c-2: var(--bs-surface-975);   --x-2: 5.83%;    --y-2: 96.80%;
    --c-3: var(--bs-surface-975);   --x-3: 0.74%;    --y-3: 1.44%;
    --c-4: var(--bs-primary-600);  --x-4: 23.68%;   --y-4: 60.14%;
    --c-5: var(--bs-surface-975);   --x-5: 70.37%;   --y-5: 98.26%;
    --c-6: var(--bs-primary-700);   --x-6: 52.70%;   --y-6: 90.37%;
    --c-7: var(--bs-secondary-600);  --x-7: 101.29%;  --y-7: 45.57%;
    --c-8: var(--bs-secondary-700);   --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: var(--bs-primary-600);  --s-start-4: 1%;  --s-end-4: 47%;     --x-4: 52.02%;  --y-4: 34.17%;
        --c-6: var(--bs-primary-700);   --s-start-6: 0%;  --s-end-6: 50%;     --x-6: 64%;     --y-6: 9%;
        --c-7: var(--bs-secondary-700);   --s-start-7: 0%;  --s-end-7: 31%;     --x-7: 91.32%;  --y-7: 36.08%;
        --c-8: var(--bs-primary-600);  --s-start-8: 1%;  --s-end-8: 44%;     --x-8: 29.49%;  --y-8: 57.89%;
    }
    50% {
        --c-4: var(--bs-primary-600);  --s-start-4: 0%;  --s-end-4: 48%;     --x-4: 40.95%;  --y-4: 37.08%;
        --c-6: var(--bs-primary-700);   --s-start-6: 0%;  --s-end-6: 50%;     --x-6: 85.87%;  --y-6: 39.11%;
        --c-7: var(--bs-secondary-700);   --s-start-7: 0%;  --s-end-7: 31%;     --x-7: 87.44%;  --y-7: 60.60%;
        --c-8: var(--bs-primary-600);  --s-start-8: 0%;  --s-end-8: 66.01%;  --x-8: 41.28%;  --y-8: 53.36%;
    }
    100% {
        --c-4: var(--bs-primary-600);  --s-start-4: 0%;  --s-end-4: 58.17%;  --x-4: 27.23%;  --y-4: 33.95%;
        --c-7: var(--bs-secondary-700);   --s-start-7: 0%;  --s-end-7: 26%;     --x-7: 68.26%;  --y-7: 75.07%;
        --c-8: var(--bs-primary-600);  --s-start-8: 0%;  --s-end-8: 43%;     --x-8: 54.91%;  --y-8: 60.28%;
    }
}

.mash-animation-11 {
    --mash-bg: var(--bs-surface-975);
    --mash-animation: mash-key-11 var(--mash-duration, 15s) linear infinite var(--mash-direction, alternate);
    --c-0: var(--bs-surface-975);       --x-0: 98.87%;  --y-0: 1.45%;
    --c-1: var(--bs-surface-975);       --x-1: 97.99%;  --y-1: 89.69%;
    --c-2: var(--bs-surface-975);       --x-2: 77.96%;  --y-2: 99.04%;
    --c-3: color-mix(in srgb, var(--bs-surface-975) 61%, transparent);    --x-3: 1.84%;   --y-3: 98.64%;
    --c-4: var(--bs-primary-600);      --x-4: 52.02%;  --y-4: 34.17%;
    --c-5: var(--bs-surface-975);       --x-5: 2.25%;   --y-5: 2.36%;
    --c-6: var(--bs-primary-700);       --x-6: 64%;     --y-6: 9%;
    --c-7: var(--bs-secondary-700);       --x-7: 91.32%;  --y-7: 36.08%;
    --c-8: var(--bs-primary-600);      --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: var(--bs-primary-600);  --s-start-1: 1%;  --s-end-1: 47%;     --x-1: 52.02%;  --y-1: 34.17%;
        --c-3: var(--bs-primary-700);   --s-start-3: 0%;  --s-end-3: 50%;     --x-3: 64%;     --y-3: 9%;
        --c-4: var(--bs-secondary-700);   --s-start-4: 0%;  --s-end-4: 31%;     --x-4: 91.32%;  --y-4: 36.08%;
        --c-5: var(--bs-primary-600);  --s-start-5: 1%;  --s-end-5: 44%;     --x-5: 29.49%;  --y-5: 57.89%;
    }
    50% {
        --c-1: var(--bs-primary-600);  --s-start-1: 0%;  --s-end-1: 48%;     --x-1: 40.95%;  --y-1: 37.08%;
        --c-3: var(--bs-primary-700);   --s-start-3: 0%;  --s-end-3: 50%;     --x-3: 85.87%;  --y-3: 39.11%;
        --c-4: var(--bs-secondary-700);   --s-start-4: 0%;  --s-end-4: 31%;     --x-4: 87.44%;  --y-4: 60.60%;
        --c-5: var(--bs-primary-600);  --s-start-5: 0%;  --s-end-5: 66.01%;  --x-5: 41.28%;  --y-5: 53.36%;
    }
    100% {
        --c-1: var(--bs-primary-600);  --s-start-1: 0%;  --s-end-1: 58.17%;  --x-1: 27.23%;  --y-1: 33.95%;
        --c-4: var(--bs-secondary-700);   --s-start-4: 0%;  --s-end-4: 26%;     --x-4: 68.26%;  --y-4: 75.07%;
        --c-5: var(--bs-primary-600);  --s-start-5: 0%;  --s-end-5: 43%;     --x-5: 54.91%;  --y-5: 60.28%;
    }
}

.mash-animation-12 {
    --mash-bg: var(--bs-surface-975);
    --mash-animation: mash-key-12 var(--mash-duration, 15s) linear infinite var(--mash-direction, alternate);
    --c-0: var(--bs-surface-975);       --x-0: 98.87%;  --y-0: 1.45%;
    --c-1: var(--bs-primary-600);      --x-1: 52.02%;  --y-1: 34.17%;
    --c-2: var(--bs-surface-975);       --x-2: 2.25%;   --y-2: 2.36%;
    --c-3: var(--bs-primary-700);       --x-3: 64%;     --y-3: 9%;
    --c-4: var(--bs-secondary-700);       --x-4: 91.32%;  --y-4: 36.08%;
    --c-5: var(--bs-primary-600);      --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));
}


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

@keyframes mash-key-13 {
    0% {
        --c-1: var(--bs-primary-600);  --s-start-1: 1%;  --s-end-1: 47%;  --x-1: 58.79%;  --y-1: 32.49%;
        --c-3: var(--bs-primary-700);   --s-start-3: 0%;  --s-end-3: 50%;  --x-3: 64%;     --y-3: 9%;
        --c-4: var(--bs-secondary-700);   --s-start-4: 0%;  --s-end-4: 28%;  --x-4: 91.32%;  --y-4: 36.08%;
        --c-5: var(--bs-primary-600);  --s-start-5: 1%;  --s-end-5: 31%;  --x-5: 13.03%;  --y-5: 52.56%;
    }
    50% {
        --c-1: var(--bs-primary-600);  --s-start-1: 0%;  --s-end-1: 41%;  --x-1: 40.73%;  --y-1: 37.92%;
        --c-3: var(--bs-primary-700);   --s-start-3: 0%;  --s-end-3: 50%;  --x-3: 85.87%;  --y-3: 39.11%;
        --c-4: var(--bs-secondary-700);   --s-start-4: 0%;  --s-end-4: 28%;  --x-4: 85.51%;  --y-4: 49.80%;
        --c-5: var(--bs-primary-600);  --s-start-5: 0%;  --s-end-5: 40%;  --x-5: 41.28%;  --y-5: 50.98%;
    }
    100% {
        --c-1: var(--bs-primary-600);  --s-start-1: 0%;  --s-end-1: 37%;  --x-1: 12.61%;  --y-1: 30.16%;
        --c-4: var(--bs-secondary-700);   --s-start-4: 0%;  --s-end-4: 26%;  --x-4: 64.17%;  --y-4: 64.41%;
        --c-5: var(--bs-primary-600);  --s-start-5: 0%;  --s-end-5: 43%;  --x-5: 54.91%;  --y-5: 54.11%;
    }
}

.mash-animation-13 {
    --mash-bg: var(--bs-surface-975);
    --mash-animation: mash-key-13 15s linear infinite alternate;
    --c-0: var(--bs-surface-975);   --x-0: 99.62%;  --y-0: 0.75%;
    --c-1: var(--bs-primary-600);  --x-1: 58.79%;  --y-1: 32.49%;
    --c-2: var(--bs-surface-975);    --x-2: 2.25%;   --y-2: 2.36%;
    --c-3: var(--bs-primary-700);   --x-3: 64%;     --y-3: 9%;
    --c-4: var(--bs-secondary-700);   --x-4: 91.32%;  --y-4: 36.08%;
    --c-5: var(--bs-primary-600);  --x-5: 13.03%;  --y-5: 52.56%;
    --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: var(--bs-primary-700);
    background-image:
        radial-gradient(circle at 87% 90%, var(--bs-surface-975) 0%, transparent 68.49%),
        radial-gradient(circle at 39% 88%, var(--bs-surface-975) 5.85%, transparent 78.62%),
        radial-gradient(circle at 92% 65%, var(--bs-surface-975) 5.85%, transparent 78.62%);
}



.feature-layout-0 .feature-media-wrap {
    border: 1px solid hsl(from #FFFFFF h s l / .15);
    border-radius: .5rem;
}


@container (min-width: 768px) {
.feature-layout-0 .feature-media-wrap {
    margin-right: 0 !important;
 }
}

@container (min-width: 1024px) {
.feature-layout-0 .feature-media-wrap {
    margin-right: -15rem !important;
 }
}

@container (min-width: 1280px) {
.feature-layout-0 .feature-media-wrap {
    margin-right: -15rem !important;
 }
}

@container (min-width: 1480px) { 
.feature-layout-0 .feature-media-wrap {
    margin-right: -15rem !important;
 }
}




@media (min-width: 1280px) {
.digiscapes-hero-image > div {
    margin-right: -15rem !important;
 }
}

@media (min-width: 1480px) { 
.digiscapes-hero-image > div { 
    margin-right: -15rem !important;
 }
}


/* Brandscapes TEaser Page Form */

.powermail_form_11 .powermail_fieldset {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.powermail_form_11 .powermail_fieldwrap_type_input,
.powermail_form_11 .powermail_fieldwrap_type_submit {
  width: auto;
}

.powermail_form_11 .powermail_field {
  width: auto !important;
}

.powermail_form_11 .powermail_input {
  width: 300px !important;
}

.powermail_form_11 .btn {
  white-space: nowrap;
  height: 3.375rem;
  margin-left: .5rem !important;
  margin-right: .5rem !important;
}

.powermail_form_11 .form-control:focus, .powermail_form_11 .form-control:focus-visible {
  border-color: var(--bs-body-color);
  box-shadow: 0 0 0 0.25rem color-mix(in srgb, var(--bs-body-color), transparent 75%);
}