html, body {
    overflow-x: hidden;
}

header {
position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 100px;
  background: white;
  border-bottom: 1px solid #ddd;
  z-index: 1000;
}


@media (max-width: 1300px) {
	header img {
		max-width: 150px!important;
	}
	header {
		height: 70px;
	}
}

main {
	margin-top: 6rem!important;
}



.is-style-full-link a::after {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	content: "";
}

.rectangle, .rectangle-white, .hcircle-right, .hcircle-white{
    position: relative;
	 z-index: 1;
}

.rectangle::before {
    content: "";
    position: absolute;
    left: -1em;
    top: -1.8em;
    width: 100px;
    height: 300px;
    background-color: #F18815;
    display: block;
	z-index: -1;
}

.rectangle-white::before {
    content: "";
    position: absolute;
    left: -1em;
    top: -2.5em;
    width: 100px;
    height: 300px;
    background-color: #FFF;
    display: block;
	z-index: -1;
}

.hcircle-right::before {
    content: "";
    position: absolute;
    left: -1em;
    bottom: 0;
    width: 100px;
    height: 200px;
    background-color: #F18815;
    display: block;
	z-index: -1;
	border-radius: 0px 100px 100px 0px;
}

.hcircle-white::before {
content: "";
    position: absolute;
    left: -1em;
    top: 0;
    width: 500px;
    height: 1000px;
    background-color: #FBFBFB;
    display: block;
    z-index: -1;
    border-radius: 0px 1000px 1000px 0px;
}

/* Minimalistisches Modal für Extendable */
.modal[hidden] { display: none; }
.modal {
  position: fixed; inset: 0;
  display: grid; place-items: center;
  background: rgba(0,0,0,.5);
  z-index: 9999;
  padding: var(--wp--preset--spacing--40, 2rem);
}
.modal__dialog {
  background: var(--wp--preset--color--background, #fff);
  color: var(--wp--preset--color--foreground, #111);
  width: min(800px, 100%);
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0,0,0,.2);
  padding: clamp(1rem, 2.5vw, 2rem);
  position: relative;
}
.modal__title { margin-top: 0; }
.modal__body { min-height: 200px; }
.modal__close {
  position: absolute; top: .5rem; right: .75rem;
  font-size: 1.75rem; line-height: 1; border: 0; background: transparent; cursor: pointer;
}



/* ANIMATIONEN */

@keyframes fadeInSlideUp {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.fadein {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.fadein.is-visible {
    animation: fadeInSlideUp 0.8s ease-out forwards;
}


.typing-effect {
    display: inline-block;
    white-space: nowrap;
    border-right: 2px solid #333;
    width: 0ch;
    overflow: hidden;
    box-sizing: border-box;
}

/* Animation nur wenn sichtbar */
.typing-effect.is-visible {
    animation:
        typing-ch 2s steps(30, end) forwards,
        blink 0.75s step-end infinite;
}

@keyframes typing-ch {
    from { width: 0ch; }
    to { width: 100%; } /* Passe an die Länge des Textes an */
}

@keyframes blink {
    50% { border-color: transparent; }
}