.elementor-17 .elementor-element.elementor-element-175c84f6{--display:flex;--min-height:0vh;--justify-content:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-17 .elementor-element.elementor-element-2e102aa{--display:grid;--min-height:0px;--e-con-grid-template-columns:repeat(2, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--gap:40px 40px;--row-gap:40px;--column-gap:40px;--grid-auto-flow:row;}.elementor-17 .elementor-element.elementor-element-011519f{--display:flex;--justify-content:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-17 .elementor-element.elementor-element-446d651{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-17 .elementor-element.elementor-element-8b29ca6 .elementor-heading-title{font-family:"Plus Jakarta Sans", Sans-serif;font-size:50px;font-weight:600;color:var( --e-global-color-60d6778 );}.elementor-17 .elementor-element.elementor-element-87e0af6 .elementor-heading-title{font-family:"Plus Jakarta Sans", Sans-serif;font-size:50px;font-weight:600;color:var( --e-global-color-60d6778 );}.elementor-17 .elementor-element.elementor-element-dbb2904 .elementor-heading-title{font-family:"Plus Jakarta Sans", Sans-serif;font-size:50px;font-weight:600;color:var( --e-global-color-60d6778 );}:root{--page-title-display:none;}@media(min-width:768px){.elementor-17 .elementor-element.elementor-element-175c84f6{--width:100%;}.elementor-17 .elementor-element.elementor-element-2e102aa{--content-width:100%;}.elementor-17 .elementor-element.elementor-element-446d651{--width:100%;}}@media(max-width:1024px){.elementor-17 .elementor-element.elementor-element-175c84f6{--min-height:100vh;}.elementor-17 .elementor-element.elementor-element-2e102aa{--grid-auto-flow:row;}}@media(max-width:767px){.elementor-17 .elementor-element.elementor-element-2e102aa{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}}/* Start custom CSS for container, class: .elementor-element-175c84f6 *//* =========================================================
   VERMIVO STARTSEITEN-HERO
   ========================================================= */

.vermivo-home-hero {
    --vm-hero-dark: #121831;
    --vm-hero-middle: #182142;
    --vm-hero-light: #21445B;
    --vm-hero-accent: #43D3B0;

    position: relative;
    isolation: isolate;

    width: min(96%, 1600px);

    margin: 30px auto 0;
    padding: clamp(30px, 4vw, 58px);

    overflow: hidden;

    /*
     * Ebene 1: Kreise rechts unten
     * Ebene 2: dezenter Lichtschein rechts oben
     * Ebene 3: dunkler Vermivo-Verlauf
     */
    background:

        radial-gradient(
            circle at center,

            rgba(67, 211, 176, 0.065) 0%,
            rgba(67, 211, 176, 0.065) 22%,

            rgba(67, 211, 176, 0.18) 22.2%,
            rgba(67, 211, 176, 0.18) 22.7%,
            transparent 22.9%,

            transparent 36%,
            rgba(67, 211, 176, 0.17) 36.2%,
            rgba(67, 211, 176, 0.17) 36.7%,
            transparent 36.9%,

            transparent 51%,
            rgba(67, 211, 176, 0.16) 51.2%,
            rgba(67, 211, 176, 0.16) 51.7%,
            transparent 51.9%
        )
        right -105px bottom -120px /
        430px 430px
        no-repeat,

        radial-gradient(
            circle at 86% 18%,
            rgba(67, 211, 176, 0.17) 0%,
            rgba(67, 211, 176, 0.055) 28%,
            transparent 50%
        ),

        linear-gradient(
            140deg,
            var(--vm-hero-dark) 0%,
            var(--vm-hero-middle) 58%,
            var(--vm-hero-light) 100%
        );

    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 28px;

    box-shadow:
        0 28px 70px rgba(28, 36, 75, 0.17);
}

/* Elementor-Inhalte bleiben vollständig frei bearbeitbar */
.vermivo-home-hero > * {
    position: relative;
    z-index: 1;
}

/* Überschriften und Texte nicht automatisch verändern */
.vermivo-home-hero h1,
.vermivo-home-hero h2,
.vermivo-home-hero h3,
.vermivo-home-hero p {
    position: relative;
    z-index: 1;
}

/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1024px) {

    .vermivo-home-hero {
        width: calc(100% - 24px);
        min-height: 560px;

        margin-top: 16px;
        padding: 42px;

        border-radius: 24px;

        background:

            radial-gradient(
                circle at center,

                rgba(67, 211, 176, 0.065) 0%,
                rgba(67, 211, 176, 0.065) 22%,

                rgba(67, 211, 176, 0.18) 22.2%,
                rgba(67, 211, 176, 0.18) 22.7%,
                transparent 22.9%,

                transparent 36%,
                rgba(67, 211, 176, 0.17) 36.2%,
                rgba(67, 211, 176, 0.17) 36.7%,
                transparent 36.9%,

                transparent 51%,
                rgba(67, 211, 176, 0.16) 51.2%,
                rgba(67, 211, 176, 0.16) 51.7%,
                transparent 51.9%
            )
            right -105px bottom -100px /
            370px 370px
            no-repeat,

            radial-gradient(
                circle at 86% 18%,
                rgba(67, 211, 176, 0.14) 0%,
                transparent 45%
            ),

            linear-gradient(
                140deg,
                var(--vm-hero-dark) 0%,
                var(--vm-hero-middle) 58%,
                var(--vm-hero-light) 100%
            );
    }
}

/* =========================================================
   SMARTPHONE
   ========================================================= */

@media (max-width: 767px) {

    .vermivo-home-hero {
        width: calc(100% - 8px);
        min-height: 520px;

        margin-top: 8px;
        padding: 28px 20px;

        border-radius: 20px;

        background:

            radial-gradient(
                circle at center,

                rgba(67, 211, 176, 0.055) 0%,
                rgba(67, 211, 176, 0.055) 22%,

                rgba(67, 211, 176, 0.15) 22.2%,
                rgba(67, 211, 176, 0.15) 22.8%,
                transparent 23%,

                transparent 36%,
                rgba(67, 211, 176, 0.14) 36.2%,
                rgba(67, 211, 176, 0.14) 36.8%,
                transparent 37%,

                transparent 51%,
                rgba(67, 211, 176, 0.13) 51.2%,
                rgba(67, 211, 176, 0.13) 51.8%,
                transparent 52%
            )
            right -90px bottom -70px /
            270px 270px
            no-repeat,

            radial-gradient(
                circle at 88% 10%,
                rgba(67, 211, 176, 0.11) 0%,
                transparent 42%
            ),

            linear-gradient(
                145deg,
                var(--vm-hero-dark) 0%,
                var(--vm-hero-middle) 62%,
                var(--vm-hero-light) 100%
            );
    }
}/* End custom CSS */
/* Start custom CSS *//* =========================================================
   VERMIVO HERO-BUTTONS
   ========================================================= */

.vm-hero-buttons {
    width: 100%;

    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 13px;

    margin-top: 30px;
}

/* Gemeinsame Einstellungen */
.vm-hero-button-primary,
.vm-hero-button-secondary {
    width: auto;
}

.vm-hero-button-primary .elementor-button,
.vm-hero-button-secondary .elementor-button {
    position: relative;

    min-height: 54px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;

    padding: 0 22px;

    overflow: hidden;

    border-radius: 13px;

    font-size: 14px;
    font-weight: 750;
    line-height: 1;
    white-space: nowrap;

    transition:
        color 0.25s ease,
        background-color 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        transform 0.25s ease;
}

.vm-hero-button-primary .elementor-button-text,
.vm-hero-button-secondary .elementor-button-text {
    position: relative;
    z-index: 2;

    display: inline-flex;
    align-items: center;
    gap: 10px;
}

/* Automatischer Pfeil */
.vm-hero-button-primary .elementor-button-text::after,
.vm-hero-button-secondary .elementor-button-text::after {
    content: "→";

    display: inline-block;

    font-size: 17px;
    font-weight: 500;
    line-height: 1;

    transition: transform 0.25s ease;
}

/* =========================================================
   PRIMÄRER BUTTON
   ========================================================= */

.vm-hero-button-primary .elementor-button {
    color: #1C244B !important;
    background: #43D3B0 !important;

    border: 1px solid #43D3B0;

    box-shadow:
        0 13px 28px rgba(67, 211, 176, 0.23);
}

/* Leichter Glanzeffekt */
.vm-hero-button-primary .elementor-button::before {
    content: "";

    position: absolute;
    top: 0;
    bottom: 0;
    left: -80%;

    width: 55%;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255, 255, 255, 0.30),
            transparent
        );

    transform: skewX(-20deg);

    transition: left 0.55s ease;
}

.vm-hero-button-primary .elementor-button:hover {
    color: #1C244B !important;
    background: #55DEBB !important;
    border-color: #55DEBB;

    transform: translateY(-2px);

    box-shadow:
        0 18px 36px rgba(67, 211, 176, 0.31);
}

.vm-hero-button-primary .elementor-button:hover::before {
    left: 130%;
}

.vm-hero-button-primary
.elementor-button:hover
.elementor-button-text::after {
    transform: translateX(5px);
}

/* =========================================================
   SEKUNDÄRER GLAS-BUTTON
   ========================================================= */

.vm-hero-button-secondary .elementor-button {
    color: #FFFFFF !important;

    background:
        rgba(255, 255, 255, 0.075) !important;

    border:
        1px solid rgba(255, 255, 255, 0.17);

    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06);

    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.vm-hero-button-secondary .elementor-button:hover {
    color: #43D3B0 !important;

    background:
        rgba(255, 255, 255, 0.115) !important;

    border-color:
        rgba(67, 211, 176, 0.48);

    transform: translateY(-2px);

    box-shadow:
        0 14px 30px rgba(4, 9, 28, 0.20),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.vm-hero-button-secondary
.elementor-button:hover
.elementor-button-text::after {
    transform: translateX(5px);
}

/* Fokus für Tastaturbedienung */
.vm-hero-button-primary .elementor-button:focus-visible,
.vm-hero-button-secondary .elementor-button:focus-visible {
    outline: 2px solid #43D3B0;
    outline-offset: 4px;
}

/* =========================================================
   SMARTPHONE
   ========================================================= */

@media (max-width: 767px) {

    .vm-hero-buttons {
        align-items: stretch;
        flex-direction: column;

        gap: 10px;

        margin-top: 25px;
    }

    .vm-hero-button-primary,
    .vm-hero-button-secondary {
        width: 100%;
    }

    .vm-hero-button-primary .elementor-button,
    .vm-hero-button-secondary .elementor-button {
        width: 100%;
        min-height: 52px;

        padding: 0 18px;
    }
}

/* Animationen bei entsprechender Geräteeinstellung reduzieren */
@media (prefers-reduced-motion: reduce) {

    .vm-hero-button-primary .elementor-button,
    .vm-hero-button-secondary .elementor-button,
    .vm-hero-button-primary .elementor-button::before,
    .vm-hero-button-primary .elementor-button-text::after,
    .vm-hero-button-secondary .elementor-button-text::after {
        transition: none !important;
    }
}/* End custom CSS */