.elementor-2839 .elementor-element.elementor-element-33124bc{--display:flex;--min-height:100vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--overlay-opacity:0.5;--margin-top:-130px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0vw;--padding-bottom:0vw;--padding-left:15vw;--padding-right:15vw;}.elementor-2839 .elementor-element.elementor-element-33124bc::before, .elementor-2839 .elementor-element.elementor-element-33124bc > .elementor-background-video-container::before, .elementor-2839 .elementor-element.elementor-element-33124bc > .e-con-inner > .elementor-background-video-container::before, .elementor-2839 .elementor-element.elementor-element-33124bc > .elementor-background-slideshow::before, .elementor-2839 .elementor-element.elementor-element-33124bc > .e-con-inner > .elementor-background-slideshow::before, .elementor-2839 .elementor-element.elementor-element-33124bc > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#000000;--background-overlay:'';}.elementor-2839 .elementor-element.elementor-element-e410abd{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--margin-top:130px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:1rem;--padding-bottom:1rem;--padding-left:1rem;--padding-right:1rem;}.elementor-2839 .elementor-element.elementor-element-3245077{--display:grid;--e-con-grid-template-columns:0.35fr 0.75fr;--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-2839 .elementor-element.elementor-element-b94153c{--display:flex;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.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-2839 .elementor-element.elementor-element-8a4888d{text-align:center;font-family:"Poppins", Sans-serif;font-size:16px;font-weight:500;color:var( --e-global-color-secondary );}.elementor-2839 .elementor-element.elementor-element-e866e7b{--display:flex;}@media(max-width:1024px){.elementor-2839 .elementor-element.elementor-element-3245077{--e-con-grid-template-columns:1;--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}}@media(max-width:767px){.elementor-2839 .elementor-element.elementor-element-e410abd{--content-width:100%;}.elementor-2839 .elementor-element.elementor-element-3245077{--e-con-grid-template-columns:1fr;--grid-auto-flow:row;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2839 .elementor-element.elementor-element-e866e7b{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}}/* Start custom CSS for container, class: .elementor-element-e410abd *//* * =============================================== * "Neu-Acrylglas" Effekt * =============================================== * Ein komplexer, mehrschichtiger Glas-Effekt mit * simulierter Kantenbeleuchtung und Tiefenwirkung. * Stabil in Chrome, Safari & Firefox. * =============================================== */ .elementor-2839 .elementor-element.elementor-element-e410abd { /* * SCHRITT 1: DER HINTERGRUND – EINHEITLICH & ELEGANT * Eine einzelne, halbtransparente Farbe sorgt für * perfekte Lesbarkeit und einen cleanen Look. */ background-color: rgba(45, 45, 45, 0.35); /* * SCHRITT 2: DER BACKDROP-FILTER * Bleibt unser stabiles Fundament für den Blur-Effekt. */ -webkit-backdrop-filter: blur(14px) saturate(160%); backdrop-filter: blur(14px) saturate(160%); /* * SCHRITT 4: DER MEHRSCHICHTIGE SCHATTEN * Wir kombinieren mehrere Schatten, um eine realistische 3D-Wirkung * zu erzielen, als wäre das Objekt ein dickes Stück Acrylglas. */ box-shadow: /* 1. Innerer Lichtschein oben (simuliert eine Lichtquelle von oben) */ inset 0 1.5px 2px rgba(255, 255, 255, 0.2), /* 2. Innerer dunkler Schatten unten (für die Tiefe) */ inset 0 -1.5px 2px rgba(0, 0, 0, 0.3), /* 3. Weicher, äußerer Schatten für das Abheben vom Hintergrund */ 0 5px 20px rgba(0, 0, 0, 0.25); } /* * SCHRITT 5: DER "AURORA-SCHEIN" (Optional, aber sehr wirkungsvoll) * Ein Pseudo-Element, das einen subtilen, farbigen Schein HINTER das * Hauptelement legt. Es reagiert auf die Mausbewegung. */ .elementor-2839 .elementor-element.elementor-element-e410abd::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 80%; /* Größe des Scheins */ height: 80%; /* Ein sanfter, mehrfarbiger Schein */ background: radial-gradient( circle, rgba(90, 180, 255, 0.1), /* Ein Hauch von Blau */ rgba(255, 130, 200, 0.1), /* Ein Hauch von Pink */ transparent 70% ); filter: blur(40px); /* Stark weichzeichnen */ z-index: -1; /* Hinter den Hauptinhalt legen */ opacity: 0.6; /* Start-Transparenz */ transition: opacity 0.4s ease; } /* Optional: Den Schein bei Mouse-Hover intensivieren */ .elementor-2839 .elementor-element.elementor-element-e410abd:hover::before { opacity: 1; }/* End custom CSS */