/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/

/* === NEUZIEL === */


:root{
  --arrow-dur: 2s;
  --arrow-stagger: .22s;
  --pink: var(--color-pink);
  --blue: var(--color-blue);
}

.btn-whitelabel {
	background-color: var(--color-violett)!important;
}

.btn-maxxluxx {
	background-color: var(--color-pink)!important;
}

.btn-maxxluxx:hover {
	background-color: var(--color-blue)!important;
}

/* === BADGES === 

.contact{
	pointer-events: none!important;
}*/

/* === SLIDER GEBALLTE LEUCHTPOWER === 
 * check here -> bicks > settings > Body (Footer) Skripte for my script
 * */

.dot-wrapper {
  display: flex;
  gap: 8px;
}

.dot {
  width: 10px;
  height: 10px;
}

.dot__inner {
  width: 100%;
  height: 100%;
  background-color: #000;
  border-radius: 50%;
  transform: scale(0.5);
  opacity: 0.3;
  animation: pulse 3s infinite ease-in-out;
}

/* Wave animation */
@keyframes pulse {
  0%, 100% {
    transform: scale(0.5);
    opacity: 0.3;
  }
  50% {
    transform: scale(0.8);
    opacity: 1;
  }
}

/* Wave delay for every 20 points */
.dot:nth-child(1) .dot__inner { animation-delay: 0s; }
.dot:nth-child(2) .dot__inner { animation-delay: 0.15s; }
.dot:nth-child(3) .dot__inner { animation-delay: 0.3s; }
.dot:nth-child(4) .dot__inner { animation-delay: 0.45s; }
.dot:nth-child(5) .dot__inner { animation-delay: 0.6s; }
.dot:nth-child(6) .dot__inner { animation-delay: 0.75s; }
.dot:nth-child(7) .dot__inner { animation-delay: 0.9s; }
.dot:nth-child(8) .dot__inner { animation-delay: 1.05s; }
.dot:nth-child(9) .dot__inner { animation-delay: 1.2s; }
.dot:nth-child(10) .dot__inner { animation-delay: 1.35s; }
.dot:nth-child(11) .dot__inner { animation-delay: 1.5s; }
.dot:nth-child(12) .dot__inner { animation-delay: 1.65s; }
.dot:nth-child(13) .dot__inner { animation-delay: 1.8s; }
.dot:nth-child(14) .dot__inner { animation-delay: 1.95s; }
.dot:nth-child(15) .dot__inner { animation-delay: 2.1s; }
.dot:nth-child(16) .dot__inner { animation-delay: 2.25s; }
.dot:nth-child(17) .dot__inner { animation-delay: 2.4s; }
.dot:nth-child(18) .dot__inner { animation-delay: 2.55s; }
.dot:nth-child(19) .dot__inner { animation-delay: 2.7s; }
.dot:nth-child(20) .dot__inner { animation-delay: 2.85s; }

/* SVG Pfeil */

.hero-arrows{
  position: absolute !important;
  inset: auto 13vw -5vw auto !important;
  width: min(32vw, 480px) !important;
  height: auto !important;
  z-index: 3 !important;
  transform: rotate(1deg) !important;
  transform-origin: 100% 100% !important;
  pointer-events: none !important;
  color: #fff !important;
  filter: drop-shadow(0 10px 20px rgba(0,0,0,.25)) !important;
  opacity: .92 !important;
}


.hero-arrows path{
  opacity: .18;
  animation: heroArrowBlink var(--arrow-dur) ease-in-out infinite;
  transform-origin: center;
  will-change: opacity, transform;
  fill: currentColor;
}


.hero-arrows path:nth-child(1){ animation-delay: calc(var(--arrow-stagger) * 0); }
.hero-arrows path:nth-child(2){ animation-delay: calc(var(--arrow-stagger) * 1); }
.hero-arrows path:nth-child(3){ animation-delay: calc(var(--arrow-stagger) * 2); }
.hero-arrows path:nth-child(4){ animation-delay: calc(var(--arrow-stagger) * 3); }
.hero-arrows path:nth-child(5){ animation-delay: calc(var(--arrow-stagger) * 4); }
.hero-arrows path:nth-child(6){ animation-delay: calc(var(--arrow-stagger) * 5); }
.hero-arrows path:nth-child(7){ animation-delay: calc(var(--arrow-stagger) * 6); }
.hero-arrows path:nth-child(8){ animation-delay: calc(var(--arrow-stagger) * 7); }

@keyframes heroArrowBlink{
  0%, 70%, 100% { opacity: .18; transform: scale(1); }
  20%           { opacity: 1;   transform: scale(1.04); }
}