/*
 Theme Name:   Hello Elementor Child
 Description:  Child Theme by DIGITALEWEGE
 Author:       Christoph Geier
 Author URI:   https://digitalewege.de/
 Template:     hello-elementor
 Version:      1.0
 Text Domain:  hello-elementor-child
*/

/* Wrapper */
.dw-slider-index,
.dw-info-slider-index {
  display: flex;
  gap: 18px;
  align-items: center;
}

/* Basis-Item für ALLE Slider */
.dw-slider-dot {
  width: 36px;
  height: 36px;
  position: relative;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Kleiner Punkt */
.dw-slider-dot::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #53565A;
  transition: transform .25s ease, background .25s ease, border .25s ease;
}

/* Zahl */
.dw-slider-dot::after {
  content: attr(data-number);
  position: absolute;
  font-size: 1rem;
  opacity: 0;
  transition: opacity .25s ease;
}

/* Hover + Active */
.dw-slider-dot:hover::before {
  transform: scale(4.5);
  background: transparent;
  border: 0.2px solid #53565A;
  box-sizing: border-box;
}

.dw-slider-dot.is-active::before {
  background: transparent;
  border: none;
  box-sizing: border-box;
}

.dw-slider-dot:hover::after,
.dw-slider-dot.is-active::after {
  opacity: 1;
}

.elementor-icon {
	display: flex;
}

/* Hauptbutton */
.dw-split-btn .elementor-button {
    display: inline-flex;
    align-items: center;
    height: auto;
    width: fit-content;
    border-radius: 999px;
    position: relative;
    text-align: center !important;
    padding: 20px 44px;
}

@media screen and (min-width:800px) {
/* Wrapper */
.dw-split-btn {
    display: inline-flex;
    text-align: center !important;
    position: relative;
}

/* Kreis-Hintergrund (bleibt immer sichtbar) */
.dw-split-btn .elementor-button::after {
    content: '';
    background-color: inherit;
    height: 100%;
    position: absolute;
    left: calc(100% + 8px);
    aspect-ratio: 1;
    border-radius: 100%;
	    background-position: center center !important;
    background-image: url('/wp-content/uploads/2026/02/→.svg');
    background-repeat: no-repeat;
}
}


/* Animationen */
@keyframes icon-wipe {
    0%   { clip-path: inset(0 100% 0 0 round 50%); }
    40%  { clip-path: inset(0 30% 0 0 round 50% 20% 20% 50%); }
    70%  { clip-path: inset(0 5% 0 0 round 50% 40% 40% 50%); }
    100% { clip-path: inset(0 0% 0 0 round 50%); }
}

@keyframes icon-pull {
    0%   { transform: translateX(0); }
    40%  { transform: translateX(8px); }
    100% { transform: translateX(0); }
}

/* Hover: Kreis zieht sich leicht nach rechts */
.dw-split-btn:hover .elementor-button::after {
    animation: icon-pull 0.5s ease forwards;
}

/* Hover: Pfeil wird per Clip-Path von links hereingewischt */
.dw-split-btn:hover .elementor-button::after svg {
    animation: icon-wipe 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}




.blogEvergreen.h1 {
	display: none!important;
}

.productSlider .elementor-swiper-button-prev {
	transform: rotate(180deg)!important;
}

.productSlider .elementor-element .swiper .elementor-swiper-button svg, .elementor-element .swiper ~ .elementor-swiper-button svg, .elementor-lightbox .swiper .elementor-swiper-button svg, .elementor-lightbox .swiper ~ .elementor-swiper-button svg {
	height: 0.7em;
	width: 0.7em;
}

.karusselContainer {
	aspect-ratio: 1;
}

dd, dl, dt, li, ol, ul {
    list-style-position: inside!important;
	margin-block: revert!important;
}

.mainNavContainer dd,
.mainNavContainer dl,
.mainNavContainer dt,
.mainNavContainer li,
.mainNavContainer ol,
.mainNavContainer ul {
  margin-block: unset!important;
}

h1, h2, h3, h4, h5, h6 {
  text-wrap: balance;
}

p {
  text-wrap: pretty;
}


.wpforms-submit {
  padding: 15px 30px!important;
  font-weight: 300!important;
  min-height: 55px!important;
}

.wpforms-submit:hover {
 background: #e9e0ed!important;
  transform: translateY(2px);
}

.wp-list-table .widefat th {
    font-weight: 400;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 2;
    top: 35px;
    background: #ffffff;
}

.jet-custom-nav__item-link:hover {
	text-decoration: underline;
}

.menu-pro-mega-saeuren-container, .menu-priv-mega-weitere-produktkat-container {
	columns: 2!important;
	width: max-content!important;
	gap: 55px!important;
}

.jet-mega-menu.jet-mega-menu--layout-horizontal .jet-mega-menu-mega-container__inner {
	background-color: #f6f6f6;
  padding: 35px 0!important;
}

.jet-mega-menu-item--hover {
  background-color: var(--jmm-top-hover-item-bg-color, inherit);
  text-decoration: underline;
  text-decoration-thickness: 2px;
}