.elementor-kit-6{--e-global-color-primary:#39A9FF;--e-global-color-secondary:#54595F;--e-global-color-text:#001D21;--e-global-color-accent:#E2007A;--e-global-color-7471546:#CDCBFF;--e-global-color-38f24de:#001D21;--e-global-color-1dd63fd:#F9F9F7;--e-global-color-b5ba1e7:#FFFFFF;--e-global-color-bbac944:#FFFFFF;--e-global-color-4f3f8e0:#BFBEBE;--e-global-color-83d5655:#FFFFFF38;--e-global-typography-primary-font-family:"Inter";--e-global-typography-primary-font-weight:200;--e-global-typography-secondary-font-family:"Inter";--e-global-typography-text-font-family:"Inter";--e-global-typography-accent-font-family:"Inter";--e-global-typography-b736f38-font-size:2.2rem;--e-global-typography-b736f38-line-height:1.3;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-kit-6 h1{font-weight:300;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1440px;}.e-con{--container-max-width:1440px;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */:root {
  /* Default padding values for small screens (e.g., mobile first) */
  --padding-sm: 1.5rem;   /* Smaller padding, good for tight spaces */
  --padding-md: 2.5rem;     /* Medium padding */
  --padding-lg: 4.0rem;   /* Larger padding */
  --padding-xl: 6.0rem;
}


/* Large screens and up (e.g., desktops) */
@media (max-width: 1024px) {
  :root {
    --padding-sm: 1.5rem;
    --padding-md: 2.5rem;
    --padding-lg: 4rem;
    --padding-xl: 6.0rem;
  }
}

/* Medium screens and up (e.g., tablets) */
@media (max-width: 768px) {
  :root {
    --padding-sm: 1.0rem;
    --padding-md: 2.0rem;
    --padding-lg: 3.0rem;
    --padding-xl: 4.5rem;
  }
}

.padding-standard-lr {
    padding-left: var(--padding-sm);
    padding-right: var(--padding-sm);
}

.padding-standard-tb {
    padding-top: var(--padding-xl);
    padding-bottom: var(--padding-xl);
}

.gap-standard > .e-con-inner, .gap-standard {
    gap:var(--padding-lg);
}


.only-on-mobile {
    @media (min-width: 1024px) {
        display: none;
    }
}

/* FONTS */

.text-max-width div, .text-max-width p{
    max-width: 80ch;
}

/* Base styles for responsiveness */
html {
  font-size: 16px; /* Define a base font size for rem units */
}

/* Responsive Headings */
h1 {
  font-size: clamp(2.1rem, 4vw + 1rem, 6rem); /* Example: Min 3rem, scales with viewport, max 22rem */
  /* You can adjust the 10vw + 1rem value to control how quickly it scales */
  letter-spacing: -0.05em;
  margin-left: -0.06em !important;
}

h2 {
  font-size: clamp(2rem, 3vw + 1rem, 5rem); /* Example: Smaller than h1, adjust as needed */
  letter-spacing: -0.05em;
  margin-left: -0.06em !important;
}

h3 {
  font-size: clamp(1.9rem, 2.5vw + 1rem, 4rem); /* Example */
  letter-spacing: -0.05em;
  margin-left: -0.06em !important;
}

h4 {
  font-size: clamp(1.8rem, 2.0vw + 1rem, 3rem); /* Example */
  letter-spacing: -0.05em;
  margin-left: -0.06em !important;
}

h5 {
  font-size: clamp(1.5rem, 1.5vw + 1rem, 2.5rem); /* Example */
  margin-left: -0.06em !important;
}

h6 {
  font-size: clamp(1.2rem, 1vw + 1rem, 2rem); /* Example */
  margin-left: -0.06em !important;
}

/* Responsive Paragraphs */
p {
  font-size: clamp(1rem, 1.0vw + 0.5rem, 1.0rem); /* Example: Min 1rem, scales, max 1.5rem */
  line-height: 1.5; /* Good practice for readability */
}


.prefix-title *{
  font-size: clamp(1.0rem, 1.0vw + 0.5rem, 1.0rem); /* Example: Min 1rem, scales, max 1.5rem */
  line-height: 1.5; /* Good practice for readability */
}




.prefix-title p {
  position: relative;
  padding-left: 1.2em; /* space for the dot */
  
}

.prefix-title p::before {
  content: "";
  position: absolute;
  left: 0;
  
  width: 0.45em;
  height: 0.45em;
  border-radius: 50%;
  background: currentColor;

  /* Align with first baseline */
  top: 0.6em;
  margin-left: 0.1em;
}



.impressum h1 {
  font-size: 2.5rem; /* Adjusted h1 size */
  margin-top: 2rem; /* Example margin-top for h1 */
  margin-bottom: 1.5rem; /* Retaining previous margin-bottom for h1 */
}

.impressum h2 {
  font-size: 1.8rem; /* Adjusted h2 size */
  margin-top: 1.8rem; /* Example margin-top for h2 */
  margin-bottom: 1.2rem; /* Retaining previous margin-bottom for h2 */
}

.impressum h3 {
  font-size: 1.5rem; /* Adjusted h3 size */
  margin-top: 1.5rem; /* Example margin-top for h3 */
  margin-bottom: 1rem; /* Retaining previous margin-bottom for h3 */
}

.impressum h4,
.impressum h5,
.impressum h6 {
  font-size: 1.2rem; /* Adjusted h4, h5, h6 size */
  margin-top: 1.2rem; /* Example margin-top for h4-h6 */
  margin-bottom: 0.8rem; /* Retaining previous margin-bottom for h4-h6 */
}

::selection {
  background: #E2007A;
  color: white;
}

/* Firefox fallback */
::-moz-selection {
  background: #E2007A;
  color: white;
}

.elementor-button-link {
    background:white;
    border-radius: 10px 10px 10px 10px;
    padding: 16px 25px 16px 25px;
    font-weight: 500;
}

.elementor-button-link:hover {
   background-color: var( --e-global-color-7471546 ) !important;
   color: var( --e-global-color-bbac944 ) !important;
}


.animated-gradient h1,
.animated-gradient h2,
.animated-gradient h3,
.animated-gradient h4,
.animated-gradient h5,
.animated-gradient h6,
.animated-gradient p {
  background: linear-gradient(90deg,
    #39A9FF,
    #E2007A,
    #39A9FF,
    #E2007A,
    #39A9FF
  );
  background-size: 400% 100%;
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent !important;

  animation: gradientMove 20s linear infinite;
  padding: 0 0 0.15em 0;
  
}

/* Animation */
@keyframes gradientMove {
  0% { background-position: 0% 50%; }
  100% { background-position: 400% 50%; }
}




/* Wrapper with gradient logo */
.gradient-logo {
  position: relative;
  display: inline-block; /* or block, if it should span full width */
}

/* Hide the original SVG (only used for sizing) */
.gradient-logo img {
  opacity: 0;
}

/* Animated gradient masked by the SVG */
.gradient-logo::before {
  content: "";
  position: absolute;
  inset: 0;

  /* Animated gradient */
  background: linear-gradient(90deg,
    #39A9FF,
    #E2007A,
    #39A9FF,
    #E2007A,
    #39A9FF
  );
  background-size: 400% 100%;
  animation: gradientMove 20s linear infinite;

  /* Use the SVG as mask */
  -webkit-mask-image: url("https://www.bunch-berlin.com/wp-content/uploads/2026/03/bunch_logo_swoosh_grad.svg");
  mask-image: url("https://www.bunch-berlin.com/wp-content/uploads/2026/03/bunch_logo_swoosh_grad.svg");

  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;

  -webkit-mask-size: contain;
  mask-size: contain;

  -webkit-mask-position: center;
  mask-position: center;
}






/* Buttons */


@media (max-width: 768px) {
    .elementor-button {
        padding: 22px 30px !important;
    }
}



/* Default button (normal state) */
.gradient-button .elementor-button {
  background: #ffffff; /* keep your normal style */
  color: #000;
  transition: transform 0.3s ease, background 0.3s ease;
  position: relative;
  overflow: hidden;
}

/* Gradient only visible on hover */
.gradient-button .elementor-button:hover {
  color: #fff;
  transform: scale(1.05);
}

/* The animated gradient overlay */
.gradient-button .elementor-button::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;

  background: linear-gradient(90deg,
    #39A9FF,
    #E2007A,
    #39A9FF,
    #E2007A,
    #39A9FF
  );
  background-size: 400% 100%;

  opacity: 0;
  transition: opacity 0.3s ease;
  animation: gradientMove 20s linear infinite;
}

/* Show gradient on hover */
.gradient-button .elementor-button:hover::before {
  opacity: 1;
}
.gradient-button.mobile-gradient-button .elementor-button {
  color: #fff !important;
}


.gradient-button.mobile-gradient-button .elementor-button::before {
  opacity: 1;
}

/* Keep text above gradient */
.gradient-button .elementor-button .elementor-button-text {
  position: relative;
  z-index: 1;
}


/* Images */

.image-rounded-edges {
    border-radius: 23px;
    overflow: hidden;
}


/* Fixes */

.dialog-close-button {
    outline:none;
}/* End custom CSS */