/*
 * raight size animation layer
 * Einbindung in WordPress:
 * <script src="/pfad/raight-animations.js"></script>
 * <link rel="stylesheet" href="/pfad/raight-animations.css">
 * Das Script bitte im Head und ohne defer laden, damit es Reveal-Inhalte
 * vor dem ersten Rendern vorbereiten kann.
 */

:root {
    --rs-green: #37ab49;
    --rs-dark: #343735;
    --rs-brown: #aa8463;
    --rs-cream: #f7f4ed;
    --rs-ease-out: cubic-bezier(0.19, 1, 0.22, 1);
    --rs-ease-spring: cubic-bezier(0.2, 1.35, 0.36, 1);
}

#top #wrap_all #main .avia-button,
#top #wrap_all #main .wpcf7 .submit-wrapper,
#top #wrap_all #main .box-arrow-section .flex_column,
#top #wrap_all #main .brown-boxes .flex_column,
#top #wrap_all #main .claim + .avia-section .flex_column,
#top #wrap_all #main .duo-boxes .flex_column {
    transform-style: preserve-3d;
    will-change: transform;
}

#top #wrap_all #main .avia-button {
    transition:
            transform 420ms var(--rs-ease-spring),
            box-shadow 420ms var(--rs-ease-out),
            background-color 240ms ease,
            color 240ms ease;
}

#top #wrap_all #main .avia-button:hover,
#top #wrap_all #main .avia-button:focus-visible {
    transform: translateY(-3px);
    box-shadow: 0 18px 35px rgba(52, 55, 53, 0.16);
}

#top #wrap_all #main .avia-button:hover::after,
#top #wrap_all #main .avia-button:focus-visible::after,
#top #wrap_all #main .wpcf7 .submit-wrapper:hover::after,
#top #wrap_all #main .wpcf7 .submit-wrapper:focus-within::after {
    animation: rs-arrow-nudge 720ms var(--rs-ease-spring) both;
}

#top #wrap_all #main .wpcf7 .submit-wrapper::before,
#top #wrap_all #main .wpcf7 .submit-wrapper::after {
    pointer-events: none;
}

#top #wrap_all #main .wpcf7 .wpcf7-submit {
    transition:
            transform 420ms var(--rs-ease-spring),
            box-shadow 420ms var(--rs-ease-out);
}

#top #wrap_all #main .wpcf7 .submit-wrapper:hover .wpcf7-submit,
#top #wrap_all #main .wpcf7 .submit-wrapper:focus-within .wpcf7-submit {
    transform: translateY(-3px);
    box-shadow: 0 18px 35px rgba(52, 55, 53, 0.16);
}

html.rs-animations-prep:not(.rs-animations-ready) #top #main .avia-section h1,
html.rs-animations-prep:not(.rs-animations-ready) #top #main .avia-section h2,
html.rs-animations-prep:not(.rs-animations-ready) #top #main .avia-section h3,
html.rs-animations-prep:not(.rs-animations-ready) #top #main .avia-section h4,
html.rs-animations-prep:not(.rs-animations-ready) #top #main .avia-section h5,
html.rs-animations-prep:not(.rs-animations-ready) #top #main .avia-section h6,
html.rs-animations-prep:not(.rs-animations-ready) #top #main .avia-section .avia_textblock p,
html.rs-animations-prep:not(.rs-animations-ready) #top #main .avia-section .avia_textblock li,
html.rs-animations-prep:not(.rs-animations-ready) #top #main .avia-section .avia_textblock blockquote,
html.rs-animations-prep:not(.rs-animations-ready) #top #main .avia-section .avia_textblock table,
html.rs-animations-prep:not(.rs-animations-ready) #top #main .avia-section .avia-button-wrap,
html.rs-animations-prep:not(.rs-animations-ready) #top #main .avia-section .avia-image-container,
html.rs-animations-prep:not(.rs-animations-ready) #top #main .avia-section .avia-slideshow,
html.rs-animations-prep:not(.rs-animations-ready) #top #main .avia-section .iconbox,
html.rs-animations-prep:not(.rs-animations-ready) #top #main .avia-section .avia-animated-number {
    opacity: 0;
    transform: translate3d(0, 34px, 0);
    filter: blur(6px);
}

html.rs-animations-ready .rs-reveal {
    opacity: 0;
    transform: translate3d(0, 34px, 0);
    transition:
            opacity 820ms var(--rs-ease-out),
            transform 820ms var(--rs-ease-out),
            filter 820ms var(--rs-ease-out);
    transition-delay: var(--rs-delay, 0ms);
    filter: blur(6px);
}

html.rs-animations-ready .rs-reveal.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    filter: blur(0);
}

html.rs-animations-ready .rs-reveal-left {
    transform: translate3d(-38px, 0, 0);
}

html.rs-animations-ready .rs-reveal-right {
    transform: translate3d(38px, 0, 0);
}

html.rs-animations-ready #top #wrap_all #main #kontakt .rs-contact-reveal,
html.rs-animations-ready #top #wrap_all #main .wpcf7 .rs-form-reveal {
    transform: translate3d(0, 30px, 0);
}

html.rs-animations-ready #top #wrap_all #main #av_section_8.numbered-boxes .rs-process-reveal {
    transform: translate3d(0, 30px, 0);
}

html.rs-animations-ready #top #wrap_all #main .avia_textblock .rs-text-reveal {
    transform: translate3d(0, 22px, 0);
}

html.rs-animations-ready .rs-reveal-scale {
    transform: translate3d(0, 24px, 0) scale(0.96);
}

html.rs-animations-ready .rs-reveal-left.is-visible,
html.rs-animations-ready .rs-reveal-right.is-visible,
html.rs-animations-ready #top #wrap_all #main #kontakt .rs-contact-reveal.is-visible,
html.rs-animations-ready #top #wrap_all #main .wpcf7 .rs-form-reveal.is-visible,
html.rs-animations-ready #top #wrap_all #main #av_section_8.numbered-boxes .rs-process-reveal.is-visible,
html.rs-animations-ready #top #wrap_all #main .avia_textblock .rs-text-reveal.is-visible,
html.rs-animations-ready .rs-reveal-scale.is-visible {
    transform: translate3d(0, 0, 0) scale(1);
}

#top #wrap_all #main .box-arrow-section .flex_column,
#top #wrap_all #main .brown-boxes .flex_column,
#top #wrap_all #main .claim + .avia-section .flex_column,
#top #wrap_all #main .duo-boxes .flex_column {
    transition:
            transform 520ms var(--rs-ease-spring),
            box-shadow 520ms var(--rs-ease-out),
            background-color 260ms ease;
}

#top #wrap_all #main .box-arrow-section .flex_column:hover,
#top #wrap_all #main .brown-boxes .flex_column:hover,
#top #wrap_all #main .claim + .avia-section .flex_column:hover,
#top #wrap_all #main .duo-boxes .flex_column:hover {
    transform: translateY(-8px);
    box-shadow: 0 22px 44px rgba(52, 55, 53, 0.16);
}

#top #wrap_all #main .box-arrow-section .flex_column:hover::before {
    animation: rs-card-arrow-pop 680ms var(--rs-ease-spring) both;
}

#top #wrap_all #main .brown-boxes .iconbox_icon,
#top #wrap_all #main .claim + .avia-section .iconbox_icon {
    transition: transform 520ms var(--rs-ease-spring);
}

#top #wrap_all #main .brown-boxes .flex_column:hover .iconbox_icon,
#top #wrap_all #main .claim + .avia-section .flex_column:hover .iconbox_icon {
    transform: translateY(-5px) scale(1.045);
}

#top #wrap_all #main .hex-image-area .avia-image-container-inner,
#top #wrap_all #main .hex-image-area .avia-slideshow {
    transition:
            transform 900ms var(--rs-ease-out),
            filter 900ms var(--rs-ease-out);
}

#top #wrap_all #main .hex-image-area .avia-image-container-inner:hover,
#top #wrap_all #main .hex-image-area .avia-slideshow:hover {
    transform: translateY(-6px) rotate(0.6deg);
}

#top #wrap_all #main #av_section_8.numbered-boxes,
#top #wrap_all #main .avia-section.av-mquzdx33-02d94c192b063cc70321a2afb100cdbd {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    background-image: url("https://scs.lautundklar.dev/wp-content/uploads/2026/06/Muster_Pfeile.svg") !important;
    background-repeat: repeat-x !important;
    background-position: 0 50%;
    animation: rs-arrow-background-belt 13s linear infinite;
}

#top #wrap_all #main #av_section_8.numbered-boxes::before,
#top #wrap_all #main #av_section_8.numbered-boxes::after,
#top #wrap_all #main .avia-section.av-mquzdx33-02d94c192b063cc70321a2afb100cdbd::before,
#top #wrap_all #main .avia-section.av-mquzdx33-02d94c192b063cc70321a2afb100cdbd::after {
    content: none;
}

#top #wrap_all #main .avia-section.av-mquzdx33-02d94c192b063cc70321a2afb100cdbd > .container {
    position: relative;
    z-index: 1;
}

#top #wrap_all #main .greenbox.counter .avia-animated-number {
    position: relative;
}

#top #wrap_all #main .greenbox.counter .avia-animated-number::after {
    content: "";
    display: block;
    width: 0;
    height: 3px;
    margin-top: 1rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.78);
    transition: width 1200ms var(--rs-ease-out);
}


#top #wrap_all #main .greenbox.counter .avia-animated-number.rs-counted::after {
    width: min(100%, 150px);
}
@media(max-width:600px){
    #top #wrap_all #main .greenbox.counter .avia-animated-number.rs-counted::after {
        width: min(100%, 110px);
    }
}

#top #wrap_all #main .main_menu a {
    transition: color 240ms ease, transform 320ms var(--rs-ease-spring);
}

#top #wrap_all #main .main_menu a:hover,
#top #wrap_all #main .main_menu a:focus-visible {
    transform: translateY(-2px);
}

@keyframes rs-arrow-nudge {
    0% {
        transform: translate(0, -50%);
    }

    45% {
        transform: translate(9px, -50%);
    }

    100% {
        transform: translate(0, -50%);
    }
}

@keyframes rs-card-arrow-pop {
    0% {
        transform: translate(0, -50%) scale(1);
    }

    45% {
        transform: translate(7px, -50%) scale(1.08);
    }

    100% {
        transform: translate(0, -50%) scale(1);
    }
}

@keyframes rs-arrow-background-belt {
    from {
        background-position: 0 50%;
    }

    to {
        background-position: 960px 50%;
    }
}

@media (prefers-reduced-motion: reduce) {
    #top #wrap_all #main *,
    #top #wrap_all #main *::before,
    #top #wrap_all #main *::after {
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 1ms !important;
    }

    html.rs-animations-ready .rs-reveal,
    html.rs-animations-ready .rs-reveal-left,
    html.rs-animations-ready .rs-reveal-right,
    html.rs-animations-ready .rs-reveal-scale {
        opacity: 1;
        transform: none;
        filter: none;
    }
}