.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-7445 .elementor-element.elementor-element-74a3a32 .elementor-heading-title{font-family:"More Sugar", Sans-serif;color:#385363;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-7445 .elementor-element.elementor-element-8921f0b{font-family:"Lora", Sans-serif;}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-03a00ed *//* ==========================================
   FREIRAUM LANDINGPAGE – BUBBLE 1
   WAS WILL ICH?
========================================== */

.bubble-will {

    /* ===== HIER KANNST DU DIE BUBBLE STEUERN ===== */

    --bubble-breite: 190px;
    --bubble-hoehe: 190px;

    --bubble-rechts: 40%;
    --bubble-oben: 80px;


    /* ===== POSITION ===== */

    position: absolute !important;

    top: var(--bubble-oben);
    right: var(--bubble-rechts);

    width: var(--bubble-breite);
    height: var(--bubble-hoehe);

    z-index: 10;


    /* ===== FORM ===== */

    border-radius: 50%;


    /* ===== GLAS / WASSER ===== */

    background:
    radial-gradient(
        circle at 30% 23%,
        rgba(255, 255, 255, 0.92) 0%,
        rgba(255, 255, 255, 0.72) 28%,
        rgba(255, 255, 255, 0.48) 52%,
        rgba(255, 255, 255, 0.22) 72%,
        rgba(255, 255, 255, 0.06) 88%,
        rgba(255, 255, 255, 0) 100%
    );

   border: 1px solid rgba(255, 255, 255, 0.72);
   
   box-shadow:
    inset 10px 10px 24px rgba(255, 255, 255, 0.52),
    inset -10px -12px 22px rgba(2, 55, 112, 0.05),
    0 10px 30px rgba(2, 55, 112, 0.08);
    
    
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);


    /* ===== LEICHTE TIEFE ===== */

    box-shadow:
        inset 8px 8px 20px rgba(255, 255, 255, 0.38),
        inset -10px -12px 22px rgba(2, 55, 112, 0.08),
        0 10px 30px rgba(2, 55, 112, 0.10);


    /* ===== INHALT ZENTRIEREN ===== */

    display: flex;
    align-items: center;
    justify-content: center;

    text-align: center;

    cursor: pointer;

    overflow: hidden;

    transition:
        width 0.6s ease,
        height 0.6s ease,
        border-radius 0.6s ease,
        transform 0.4s ease,
        box-shadow 0.4s ease;
}


/* ==========================================
   TITEL – ORANGE MIT WEICHEM LICHT
========================================== */

.bubble-will-titel {

    font-family: "Libre Baskerville", serif !important;

    color: #CC4E00 !important;

    font-size: 20px;
    font-weight: 400;

    line-height: 1.3;

    padding: 20px;

    transition:
        color 0.4s ease,
        text-shadow 0.4s ease,
        transform 0.4s ease;

    text-shadow:
        0 0 8px rgba(255, 255, 255, 0.95),
        0 0 18px rgba(255, 255, 255, 0.75),
        0 0 32px rgba(255, 255, 255, 0.45);

    position: relative;
    z-index: 2;
}


/* ==========================================
   INHALT – ZUNÄCHST UNSICHTBAR
========================================== */

.bubble-will-inhalt {

    position: absolute;

    top: 85px;
    left: 40px;
    right: 40px;

    opacity: 0;
    visibility: hidden;

    transform: translateY(15px);

    transition:
        opacity 0.5s ease 0.15s,
        transform 0.5s ease 0.15s,
        visibility 0s linear 0.7s;

    font-family: "Open Sans", sans-serif !important;

    color: #023770;

    text-align: left;

    font-size: 15px;
    line-height: 1.7;

    padding-bottom: 30px;
}


/* ===== ABSÄTZE ===== */

.bubble-will-inhalt p {

    margin: 0 0 22px 0;
}


/* ===== AUF ALLEN EBENEN ===== */

.bubble-will-highlight {

    font-family: "Libre Baskerville", serif !important;

    color: #CC4E00 !important;

    font-size: 19px;

    text-align: left;

    margin: 28px 0 !important;
}


/* ==========================================
   GEÖFFNETE BUBBLE
========================================== */

.bubble-will.is-open {
 z-index: 9999 !important;

    width: 520px;
    height: 620px;

    border-radius: 55px 70px 60px 75px;

    align-items: flex-start;
    justify-content: flex-start;

    overflow-y: auto;

    transform: translateY(-5px);

    box-shadow:
        inset 10px 10px 25px rgba(255, 255, 255, 0.42),
        inset -10px -12px 25px rgba(2, 55, 112, 0.06),
        0 18px 45px rgba(2, 55, 112, 0.14);
}


/* ===== TITEL BEIM ÖFFNEN ===== */

.bubble-will.is-open .bubble-will-titel {

    position: absolute;

    top: 25px;
    left: 40px;

    padding: 0;

    color: #CC4E00 !important;

    font-size: 22px;
}


/* ===== TEXT EINBLENDEN ===== */

.bubble-will.is-open .bubble-will-inhalt {

    opacity: 1;
    visibility: visible;

    transform: translateY(0);

    position: relative;

    top: auto;
    left: auto;
    right: auto;

    margin-top: 75px;
    margin-left: 40px;
    margin-right: 40px;
}


/* ==========================================
   HOVER
========================================== */

.bubble-will:hover:not(.is-open) {

    transform: translateY(-5px);

    box-shadow:
        inset 8px 8px 22px rgba(255, 255, 255, 0.44),
        inset -10px -12px 22px rgba(2, 55, 112, 0.06),
        0 16px 38px rgba(2, 55, 112, 0.14);
}


.bubble-will:hover:not(.is-open) .bubble-will-titel {

    color: #023770  !important;

    text-shadow:
        0 0 8px rgba(255, 255, 255, 1),
        0 0 20px rgba(255, 255, 255, 0.9),
        0 0 38px rgba(255, 255, 255, 0.65);
}


/* ==========================================
   FOKUS
========================================== */

.bubble-will:focus-visible {

    outline: 2px solid #CC4E00;
    outline-offset: 5px;
}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 767px) {

    .bubble-will {

        --bubble-breite: 155px;
        --bubble-hoehe: 155px;

        --bubble-rechts: 10%;
        --bubble-oben: 610px;
    }


    .bubble-will-titel {

        font-size: 17px;
    }


    /* ===== MOBILE GEÖFFNET ===== */

    .bubble-will.is-open {

        width: 82vw;
        height: 72vh;

        min-height: 520px;

        border-radius: 42px 55px 48px 60px;

        right: 9%;

        transform: none;
    }


    .bubble-will.is-open .bubble-will-titel {

        top: 24px;
        left: 28px;

        font-size: 19px;
    }


    .bubble-will.is-open .bubble-will-inhalt {

        margin-top: 68px;
        margin-left: 28px;
        margin-right: 28px;

        font-size: 14px;
        line-height: 1.65;
    }


    .bubble-will-inhalt p {

        margin-bottom: 20px;
    }


    .bubble-will-highlight {

        font-size: 17px;

        margin: 24px 0 !important;
    }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-c2927c4 *//* ==========================================
   FREIRAUM LANDINGPAGE – BUBBLE 1
   WAS Brauche ICH?
========================================== */

.bubble-need {

    /* ===== HIER KANNST DU DIE BUBBLE STEUERN ===== */

    --bubble-breite: 210px;
    --bubble-hoehe: 210px;

    --bubble-rechts: 24%;
    --bubble-oben: 200px;


    /* ===== POSITION ===== */

    position: absolute !important;

    top: var(--bubble-oben);
    right: var(--bubble-rechts);

    width: var(--bubble-breite);
    height: var(--bubble-hoehe);

    z-index: 10;


    /* ===== FORM ===== */

    border-radius: 50%;


    /* ===== GLAS / WASSER ===== */

    background:
    radial-gradient(
        circle at 30% 23%,
        rgba(255, 255, 255, 0.92) 0%,
        rgba(255, 255, 255, 0.72) 28%,
        rgba(255, 255, 255, 0.48) 52%,
        rgba(255, 255, 255, 0.22) 72%,
        rgba(255, 255, 255, 0.06) 88%,
        rgba(255, 255, 255, 0) 100%
    );

   border: 1px solid rgba(255, 255, 255, 0.72);
   
   box-shadow:
    inset 10px 10px 24px rgba(255, 255, 255, 0.52),
    inset -10px -12px 22px rgba(2, 55, 112, 0.05),
    0 10px 30px rgba(2, 55, 112, 0.08);
    
    
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);


    /* ===== LEICHTE TIEFE ===== */

    box-shadow:
        inset 8px 8px 20px rgba(255, 255, 255, 0.38),
        inset -10px -12px 22px rgba(2, 55, 112, 0.08),
        0 10px 30px rgba(2, 55, 112, 0.10);


    /* ===== INHALT ZENTRIEREN ===== */

    display: flex;
    align-items: center;
    justify-content: center;

    text-align: center;

    cursor: pointer;

    overflow: hidden;

    transition:
        width 0.6s ease,
        height 0.6s ease,
        border-radius 0.6s ease,
        transform 0.4s ease,
        box-shadow 0.4s ease;
}


/* ==========================================
   TITEL – ORANGE MIT WEICHEM LICHT
========================================== */

.bubble-need-titel {

    font-family: "Libre Baskerville", serif !important;

    color: #CC4E00 !important;

    font-size: 20px;
    font-weight: 400;

    line-height: 1.3;

    padding: 20px;

    transition:
        color 0.4s ease,
        text-shadow 0.4s ease,
        transform 0.4s ease;

    text-shadow:
        0 0 8px rgba(255, 255, 255, 0.95),
        0 0 18px rgba(255, 255, 255, 0.75),
        0 0 32px rgba(255, 255, 255, 0.45);

    position: relative;
    z-index: 2;
}


/* ==========================================
   INHALT – ZUNÄCHST UNSICHTBAR
========================================== */

.bubble-need-inhalt {

    position: absolute;

    top: 85px;
    left: 40px;
    right: 40px;

    opacity: 0;
    visibility: hidden;

    transform: translateY(15px);

    transition:
        opacity 0.5s ease 0.15s,
        transform 0.5s ease 0.15s,
        visibility 0s linear 0.7s;

    font-family: "Open Sans", sans-serif !important;

    color: #023770;

    text-align: left;

    font-size: 15px;
    line-height: 1.7;

    padding-bottom: 30px;
}


/* ===== ABSÄTZE ===== */

.bubble-need-inhalt p {

    margin: 0 0 22px 0;
}


/* ===== AUF ALLEN EBENEN ===== */

.bubble-need-highlight {

    font-family: "Libre Baskerville", serif !important;

    color: #CC4E00 !important;

    font-size: 19px;

    text-align: left;

    margin: 28px 0 !important;
}


/* ==========================================
   GEÖFFNETE BUBBLE
========================================== */

.bubble-need.is-open {
z-index: 9999 !important;

    width: 520px;
    height: 620px;

    border-radius: 55px 70px 60px 75px;

    align-items: flex-start;
    justify-content: flex-start;

    overflow-y: auto;

    transform: translateY(-5px);

    box-shadow:
        inset 10px 10px 25px rgba(255, 255, 255, 0.42),
        inset -10px -12px 25px rgba(2, 55, 112, 0.06),
        0 18px 45px rgba(2, 55, 112, 0.14);
}


/* ===== TITEL BEIM ÖFFNEN ===== */

.bubble-need.is-open .bubble-need-titel {

    position: absolute;

    top: 25px;
    left: 40px;

    padding: 0;

    color: #CC4E00 !important;

    font-size: 22px;
}


/* ===== TEXT EINBLENDEN ===== */

.bubble-need.is-open .bubble-need-inhalt {

    opacity: 1;
    visibility: visible;

    transform: translateY(0);

    position: relative;

    top: auto;
    left: auto;
    right: auto;

    margin-top: 75px;
    margin-left: 40px;
    margin-right: 40px;
}


/* ==========================================
   HOVER
========================================== */

.bubble-need:hover:not(.is-open) {

    transform: translateY(-5px);

    box-shadow:
        inset 8px 8px 22px rgba(255, 255, 255, 0.44),
        inset -10px -12px 22px rgba(2, 55, 112, 0.06),
        0 16px 38px rgba(2, 55, 112, 0.14);
}


.bubble-need:hover:not(.is-open) .bubble-need-titel {

    color: #023770  !important;

    text-shadow:
        0 0 8px rgba(255, 255, 255, 1),
        0 0 20px rgba(255, 255, 255, 0.9),
        0 0 38px rgba(255, 255, 255, 0.65);
}


/* ==========================================
   FOKUS
========================================== */

.bubble-need:focus-visible {

    outline: 2px solid #CC4E00;
    outline-offset: 5px;
}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 767px) {

    .bubble-need {

        --bubble-breite: 170px;
        --bubble-hoehe: 170px;

        --bubble-rechts: 45%;
        --bubble-oben: 790px;
    }


    .bubble-need-titel {

        font-size: 17px;
    }


    /* ===== MOBILE GEÖFFNET ===== */

    .bubble-need.is-open {

        width: 82vw;
        height: 72vh;

        min-height: 520px;

        border-radius: 42px 55px 48px 60px;

        right: 9%;

        transform: none;
    }


    .bubble-need.is-open .bubble-need-titel {

        top: 24px;
        left: 28px;

        font-size: 19px;
    }


    .bubble-need.is-open .bubble-need-inhalt {

        margin-top: 68px;
        margin-left: 28px;
        margin-right: 28px;

        font-size: 14px;
        line-height: 1.65;
    }


    .bubble-need-inhalt p {

        margin-bottom: 20px;
    }


    .bubble-need-highlight {

        font-size: 17px;

        margin: 24px 0 !important;
    }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-d5ec327 *//* ==========================================
   FREIRAUM LANDINGPAGE – BUBBLE 1
   WAS Brauche ICH?
========================================== */

.bubble-place {

    /* ===== HIER KANNST DU DIE BUBBLE STEUERN ===== */

    --bubble-breite: 170px;
    --bubble-hoehe: 170px;

    --bubble-rechts: 39%;
    --bubble-oben: 350px;


    /* ===== POSITION ===== */

    position: absolute !important;

    top: var(--bubble-oben);
    right: var(--bubble-rechts);

    width: var(--bubble-breite);
    height: var(--bubble-hoehe);

    z-index: 10;


    /* ===== FORM ===== */

    border-radius: 50%;


    /* ===== GLAS / WASSER ===== */

    background:
    radial-gradient(
        circle at 30% 23%,
        rgba(255, 255, 255, 0.92) 0%,
        rgba(255, 255, 255, 0.72) 28%,
        rgba(255, 255, 255, 0.48) 52%,
        rgba(255, 255, 255, 0.22) 72%,
        rgba(255, 255, 255, 0.06) 88%,
        rgba(255, 255, 255, 0) 100%
    );

   border: 1px solid rgba(255, 255, 255, 0.72);
   
   box-shadow:
    inset 10px 10px 24px rgba(255, 255, 255, 0.52),
    inset -10px -12px 22px rgba(2, 55, 112, 0.05),
    0 10px 30px rgba(2, 55, 112, 0.08);
    
    
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);


    /* ===== LEICHTE TIEFE ===== */

    box-shadow:
        inset 8px 8px 20px rgba(255, 255, 255, 0.38),
        inset -10px -12px 22px rgba(2, 55, 112, 0.08),
        0 10px 30px rgba(2, 55, 112, 0.10);


    /* ===== INHALT ZENTRIEREN ===== */

    display: flex;
    align-items: center;
    justify-content: center;

    text-align: center;

    cursor: pointer;

    overflow: hidden;

    transition:
        width 0.6s ease,
        height 0.6s ease,
        border-radius 0.6s ease,
        transform 0.4s ease,
        box-shadow 0.4s ease;
}


/* ==========================================
   TITEL – ORANGE MIT WEICHEM LICHT
========================================== */

.bubble-place-titel {

    font-family: "Libre Baskerville", serif !important;

    color: #CC4E00 !important;

    font-size: 20px;
    font-weight: 400;

    line-height: 1.3;

    padding: 20px;

    transition:
        color 0.4s ease,
        text-shadow 0.4s ease,
        transform 0.4s ease;

    text-shadow:
        0 0 8px rgba(255, 255, 255, 0.95),
        0 0 18px rgba(255, 255, 255, 0.75),
        0 0 32px rgba(255, 255, 255, 0.45);

    position: relative;
    z-index: 2;
}


/* ==========================================
   INHALT – ZUNÄCHST UNSICHTBAR
========================================== */

.bubble-place-inhalt {

    position: absolute;

    top: 85px;
    left: 40px;
    right: 40px;

    opacity: 0;
    visibility: hidden;

    transform: translateY(15px);

    transition:
        opacity 0.5s ease 0.15s,
        transform 0.5s ease 0.15s,
        visibility 0s linear 0.7s;

    font-family: "Open Sans", sans-serif !important;

    color: #023770;

    text-align: left;

    font-size: 15px;
    line-height: 1.7;

    padding-bottom: 30px;
}


/* ===== ABSÄTZE ===== */

.bubble-place-inhalt p {

    margin: 0 0 22px 0;
}


/* ===== AUF ALLEN EBENEN ===== */

.bubble-place-highlight {

    font-family: "Libre Baskerville", serif !important;

    color: #CC4E00 !important;

    font-size: 19px;

    text-align: left;

    margin: 28px 0 !important;
}


/* ==========================================
   GEÖFFNETE BUBBLE
========================================== */

.bubble-place.is-open {
z-index: 9999 !important;

    width: 520px;
    height: 620px;

    border-radius: 55px 70px 60px 75px;

    align-items: flex-start;
    justify-content: flex-start;

    overflow-y: auto;

    transform: translateY(-5px);

    box-shadow:
        inset 10px 10px 25px rgba(255, 255, 255, 0.42),
        inset -10px -12px 25px rgba(2, 55, 112, 0.06),
        0 18px 45px rgba(2, 55, 112, 0.14);
}


/* ===== TITEL BEIM ÖFFNEN ===== */

.bubble-place.is-open .bubble-place-titel {

    position: absolute;

    top: 25px;
    left: 40px;

    padding: 0;

    color: #CC4E00 !important;

    font-size: 22px;
}


/* ===== TEXT EINBLENDEN ===== */

.bubble-place.is-open .bubble-place-inhalt {

    opacity: 1;
    visibility: visible;

    transform: translateY(0);

    position: relative;

    top: auto;
    left: auto;
    right: auto;

    margin-top: 75px;
    margin-left: 40px;
    margin-right: 40px;
}


/* ==========================================
   HOVER
========================================== */

.bubble-place:hover:not(.is-open) {

    transform: translateY(-5px);

    box-shadow:
        inset 8px 8px 22px rgba(255, 255, 255, 0.44),
        inset -10px -12px 22px rgba(2, 55, 112, 0.06),
        0 16px 38px rgba(2, 55, 112, 0.14);
}


.bubble-place:hover:not(.is-open) .bubble-place-titel {

    color: #023770  !important;

    text-shadow:
        0 0 8px rgba(255, 255, 255, 1),
        0 0 20px rgba(255, 255, 255, 0.9),
        0 0 38px rgba(255, 255, 255, 0.65);
}


/* ==========================================
   FOKUS
========================================== */

.bubble-place:focus-visible {

    outline: 2px solid #CC4E00;
    outline-offset: 5px;
}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 767px) {

    .bubble-place {

        --bubble-breite: 150px;
        --bubble-hoehe: 150px;

        --bubble-rechts: 19%;
        --bubble-oben: 1010px;
    }


    .bubble-place-titel {

        font-size: 17px;
    }


    /* ===== MOBILE GEÖFFNET ===== */

    .bubble-place.is-open {

        width: 82vw;
        height: 72vh;

        min-height: 520px;

        border-radius: 42px 55px 48px 60px;

        right: 9%;

        transform: none;
    }


    .bubble-place.is-open .bubble-place-titel {

        top: 24px;
        left: 28px;

        font-size: 19px;
    }


    .bubble-place.is-open .bubble-place-inhalt {

        margin-top: 68px;
        margin-left: 28px;
        margin-right: 28px;

        font-size: 14px;
        line-height: 1.65;
    }


    .bubble-place-inhalt p {

        margin-bottom: 20px;
    }


    .bubble-place-highlight {

        font-size: 17px;

        margin: 24px 0 !important;
    }
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'More Sugar';
	font-display: auto;
	src: url('https://freiraum-fuer-leben.de/wp-content/uploads/2026/07/MoreSugar-Regular.ttf') format('truetype');
}
/* End Custom Fonts CSS */