.elementor-kit-210{--e-global-color-primary:#FDFDFD;--e-global-color-secondary:#F8F8F8;--e-global-color-text:#262626;--e-global-color-accent:#9D7E4A;--e-global-color-3a80edd:#9D7E4AA6;--e-global-color-2e2b8b9:#F4F1EE;--e-global-color-4464411:#CFC8C0;--e-global-typography-primary-font-family:"Cormorant Garamond";--e-global-typography-primary-font-size:70px;--e-global-typography-primary-font-weight:300;--e-global-typography-secondary-font-family:"Playfair Display";--e-global-typography-secondary-font-size:50px;--e-global-typography-secondary-font-weight:400;--e-global-typography-secondary-font-style:italic;--e-global-typography-text-font-family:"Inter";--e-global-typography-text-font-size:20px;--e-global-typography-text-font-weight:200;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;--e-global-typography-dea7936-font-family:"Playfair Display";--e-global-typography-dea7936-font-size:60px;--e-global-typography-dea7936-font-weight:600;--e-global-typography-dea7936-font-style:italic;background-color:#FDFDFD;color:#262626;}.elementor-kit-210 e-page-transition{background-color:#FFBC7D;}.elementor-kit-210 a{color:#262626;}.elementor-kit-210 h1{color:#262626;font-family:"Cormorant Garamond", Sans-serif;font-size:70px;font-weight:300;}.elementor-kit-210 h2{color:#262626;font-family:"Cormorant Garamond", Sans-serif;font-size:42px;font-weight:300;}.elementor-kit-210 h3{color:#262626;font-family:"Inter", Sans-serif;font-size:20px;font-weight:200;}.elementor-kit-210 h4{color:#262626;}.elementor-kit-210 h5{color:#9A8A78;font-family:"Inter", Sans-serif;font-size:22px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;word-spacing:5px;}.elementor-kit-210 h6{color:#262626;font-family:"Playfair Display", Sans-serif;font-size:60px;font-weight:600;font-style:italic;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* Wir sprechen ALLES innerhalb deiner Klasse an */
.wsm-atomic-footer input, 
.wsm-atomic-footer textarea,
.wsm-atomic-footer select {
    border: none !important;
    border-bottom: 1px solid rgba(0,0,0,0.1) !important;
    background: transparent !important;
    border-radius: 0 !important;
    padding: 12px 0 !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 16px !important;
    box-shadow: none !important;
    transition: all 0.3s ease !important;
}

/* Fokus: Die goldene Linie */
.wsm-atomic-footer input:focus, 
.wsm-atomic-footer textarea:focus {
    border-bottom: 1px solid #9d7e4a !important;
    outline: none !important;
}

/* Die Labels (Beschriftungen) über den Feldern */
.wsm-atomic-footer label {
    font-family: 'Inter', sans-serif !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    display: block !important;
    margin-bottom: 5px !important;
}

/* Der Button - Hier nutzen wir mehrere Selektoren zur Sicherheit */
.wsm-atomic-footer button,
.wsm-atomic-footer .af-submit-button,
.wsm-atomic-footer input[type="submit"] {
    background-color: #1a1a1a !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 18px 40px !important;
    width: 100% !important;
    text-transform: uppercase !important;
    letter-spacing: 3px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.4s ease !important;
    margin-top: 20px !important;
}

/* Button Hover */
.wsm-atomic-footer button:hover,
.wsm-atomic-footer .af-submit-button:hover {
    background-color: #9d7e4a !important;
    letter-spacing: 5px !important;
}

/* Checkbox verstecken/anpassen */
.wsm-atomic-footer input[type="checkbox"] {
    width: auto !important;
    margin-right: 10px !important;
}
/* --- MASTER OVERRIDE LIGHTBOX --- */

/* 1. Hintergrund der gesamten Ebene */
:root {
    --lightbox-background: rgba(38, 38, 38, 0.80);
}

.elementor-lightbox {
    background-color: var(--lightbox-background) !important;
}

/* 2. Symbole (Pfeile, Kreuz, Zoom) auf Schwarz zwingen */
.elementor-lightbox i, 
.elementor-lightbox svg,
.elementor-lightbox .eicon-close,
.elementor-lightbox .elementor-lightbox-close-button i {
    color: #FDFDFD !important;
    fill: ##FDFDFD !important; /* Für SVG-Icons wichtig */
    opacity: 1 !important;
    text-shadow: none !important;
    transition: all 0.3s ease !important;
}

/* 3. Hover-Zustand auf Gold zwingen */
.elementor-lightbox i:hover, 
.elementor-lightbox svg:hover,
.elementor-lightbox .elementor-slideshow__prev:hover i,
.elementor-lightbox .elementor-slideshow__next:hover i,
.elementor-lightbox .elementor-lightbox-close-button:hover i {
    color: #9d7e4a !important;
    fill: #9d7e4a !important;
    transform: scale(1.1);
}

/* 4. Text und Balken unten radikal entfernen */
.elementor-slideshow__footer,
.elementor-slideshow__header,
.elementor-slideshow__title,
.elementor-slideshow__description,
.lg-sub-html {
    display: none !important;
    opacity: 0 !important;
}

/* 5. Fix für das Schließen-Kreuz (falls es ein Bild/SVG ist) */
.elementor-lightbox-close-button {
    background: transparent !important;
}
/* CSS auf Mobil deaktivieren*/
@media (hover: none) and (pointer: coarse) {
  .elementor-element:hover {
    transform: none !important;
  }
}
@media (max-width: 1024px) {
  .elementor-element.elementor-invisible,
  .elementor-element.animated,
  .elementor-element[class*="animated"] {
    animation-delay: 0s !important;
    transition-delay: 0s !important;
  }
}
/* Tablet slide in*/

/* Seiten sind immer starr auf iPad und Mobil Verhindert horizontales Verschieben auf iPad und Mobil */
html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

@supports (overflow: clip) {
  html,
  body {
    overflow-x: clip;
  }
}

.elementor,
.elementor-section,
.elementor-container,
.e-con,
.e-con-inner,
.elementor-widget-wrap {
  max-width: 100%;
}


/* ==========================================
   WSM AI LOGO
   GALERIE + LIGHTBOX
   ========================================== */

:root {

  /* HIER FARBE ÄNDERN */
  --wsm-ai-farbe: #FFFFFF;

  /* ORIGINAL WSM AI LOGO */
  --wsm-ai-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M66 14 H27 Q12 14 12 30 V71 Q12 87 28 87 H73 Q88 87 88 71 V56' fill='none' stroke='white' stroke-width='6' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ctext x='49' y='69' text-anchor='middle' font-family='Arial,sans-serif' font-size='43' font-weight='700' fill='white'%3EAI%3C/text%3E%3Cpath d='M76 4 Q77 19 90 20 Q77 22 76 36 Q74 22 61 20 Q74 18 76 4Z' fill='white'/%3E%3Cpath d='M92 24 Q92 32 99 33 Q92 34 92 42 Q91 34 84 33 Q91 32 92 24Z' fill='white'/%3E%3C/svg%3E");

}

/* ==========================================
   1. GALERIE-VORSCHAUBILDER
   ========================================== */

/* Klassische Elementor Basisgalerie */

.wsm-ai-galerie .gallery-icon {
  position: relative;
}

.wsm-ai-galerie .gallery-icon a {
  display: block;
  position: relative;
}

.wsm-ai-galerie .gallery-icon img {
  display: block;
}

/* Badge auf verlinktem Bild */

.wsm-ai-galerie .gallery-icon a::after,

/* Badge falls kein Link vorhanden */

.wsm-ai-galerie .gallery-icon:not(:has(a))::after,

/* Elementor e-gallery */

.wsm-ai-galerie .e-gallery-item::after {

  content: "";
  position: absolute;

  right: 5px;
  bottom: 7px;
  z-index: 30;

  width: 25px;
  height: 25px;

  background-color: var(--wsm-ai-farbe);

  -webkit-mask-image: var(--wsm-ai-mask);
  mask-image: var(--wsm-ai-mask);

  -webkit-mask-size: contain;
  mask-size: contain;

  -webkit-mask-position: center;
  mask-position: center;

  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;

  opacity: 0.85;
  pointer-events: none;
}

.wsm-ai-galerie .e-gallery-item {
  position: relative;
}

/* ==========================================
   2. GROSSE ELEMENTOR LIGHTBOX
   ========================================== */

/* Bild als Positionierungsanker */

.elementor-lightbox .swiper-slide {
  anchor-scope: --wsm-bild;
}

.elementor-lightbox
.swiper-zoom-container img {
  anchor-name: --wsm-bild;
}

/* Badge an sichtbarer Bildkante */

.elementor-lightbox
.swiper-zoom-container:has(img)::after {

  content: "";
  position: absolute;
  position-anchor: --wsm-bild;

  left: anchor(right);
  top: anchor(bottom);

  right: auto;
  bottom: auto;

  transform: translate(
    calc(-100% - 5px),
    calc(-100% - 7px)
  );

  z-index: 30;

  width: 32px;
  height: 32px;

  background-color: var(--wsm-ai-farbe);

  -webkit-mask-image: var(--wsm-ai-mask);
  mask-image: var(--wsm-ai-mask);

  -webkit-mask-size: contain;
  mask-size: contain;

  -webkit-mask-position: center;
  mask-position: center;

  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;

  opacity: 0.85;
  pointer-events: none;
}

/* ==========================================
   3. HANDY
   ========================================== */

@media (max-width: 767px) {

  .wsm-ai-galerie .gallery-icon a::after,
  .wsm-ai-galerie .gallery-icon:not(:has(a))::after,
  .wsm-ai-galerie .e-gallery-item::after {

    right: 3px;
    bottom: 5px;

    width: 20px;
    height: 20px;
  }

  .elementor-lightbox
  .swiper-zoom-container:has(img)::after {

    width: 20px;
    height: 20px;

    transform: translate(
      calc(-100% - 3px),
      calc(-100% - 5px)
    );
  }

}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Playfair Display';
	font-style: normal;
	font-weight: 700;
	font-display: auto;
	src: url('https://www.wsm-wohnbausystem.de/wp-content/uploads/2026/05/PlayfairDisplay-Bold.ttf') format('truetype');
}
@font-face {
	font-family: 'Playfair Display';
	font-style: normal;
	font-weight: 700;
	font-display: auto;
	src: url('https://www.wsm-wohnbausystem.de/wp-content/uploads/2026/05/PlayfairDisplay-BoldItalic.ttf') format('truetype');
}
@font-face {
	font-family: 'Playfair Display';
	font-style: normal;
	font-weight: 500;
	font-display: auto;
	src: url('https://www.wsm-wohnbausystem.de/wp-content/uploads/2026/05/PlayfairDisplay-Regular.ttf') format('truetype');
}
@font-face {
	font-family: 'Playfair Display';
	font-style: italic;
	font-weight: 500;
	font-display: auto;
	src: url('https://www.wsm-wohnbausystem.de/wp-content/uploads/2026/05/PlayfairDisplay-Regular-Italic.ttf') format('truetype');
}
/* End Custom Fonts CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 800;
	font-display: auto;
	src: url('https://www.wsm-wohnbausystem.de/wp-content/uploads/2026/05/Inter_Black.ttf') format('truetype');
}
@font-face {
	font-family: 'Inter';
	font-style: italic;
	font-weight: 800;
	font-display: auto;
	src: url('https://www.wsm-wohnbausystem.de/wp-content/uploads/2026/05/Inter_BlackItalic.ttf') format('truetype');
}
@font-face {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 500;
	font-display: auto;
	src: url('https://www.wsm-wohnbausystem.de/wp-content/uploads/2026/05/Inter_Medium.ttf') format('truetype');
}
@font-face {
	font-family: 'Inter';
	font-style: italic;
	font-weight: 500;
	font-display: auto;
	src: url('https://www.wsm-wohnbausystem.de/wp-content/uploads/2026/05/Inter_MediumItalic.ttf') format('truetype');
}
@font-face {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 200;
	font-display: auto;
	src: url('https://www.wsm-wohnbausystem.de/wp-content/uploads/2026/05/Inter_ExtraLight.ttf') format('truetype');
}
@font-face {
	font-family: 'Inter';
	font-style: italic;
	font-weight: 200;
	font-display: auto;
	src: url('https://www.wsm-wohnbausystem.de/wp-content/uploads/2026/05/Inter_ExtraLightItalic.ttf') format('truetype');
}
/* End Custom Fonts CSS */