.elementor-4487 .elementor-element.elementor-element-32f96d0{--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-4487 .elementor-element.elementor-element-2471a6a{--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-4487 .elementor-element.elementor-element-94280d9{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:50px;--padding-bottom:50px;--padding-left:30px;--padding-right:30px;}.elementor-4487 .elementor-element.elementor-element-94280d9:not(.elementor-motion-effects-element-type-background), .elementor-4487 .elementor-element.elementor-element-94280d9 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F2F4F7;}.elementor-4487 .elementor-element.elementor-element-4cd7c8e{--display:flex;--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;}.elementor-4487 .elementor-element.elementor-element-0bf5faa{--display:flex;--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;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-4487 .elementor-element.elementor-element-4cd7c8e{--width:50%;}.elementor-4487 .elementor-element.elementor-element-0bf5faa{--width:50%;}}@media(max-width:767px){.elementor-4487 .elementor-element.elementor-element-94280d9{--margin-top:-100px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}}/* Start custom CSS for html, class: .elementor-element-2da2beb *//* ===============================================
   HERO – BAUFIRMA NIEDERÖSTERREICH
   =============================================== */

.leistungen-hero-main {
  background: url("https://wolken-bau.at/wp-content/uploads/2025/12/20251227_144126-scaled.jpg") center/cover no-repeat;
  padding: 180px 20px 160px;
  text-align: center;
  position: relative;
  overflow: hidden;
}

/* Overlay + Gradient */
.leistungen-hero-main::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    rgba(13,42,76,0.75),
    rgba(13,42,76,0.85)
  );
}

/* Content */
.lhm-content {
  position: relative;
  z-index: 10;
  color: #fff;
  max-width: 900px;
  margin: 0 auto;
}

/* Subtitle */
.lhm-subtitle {
  display: inline-block;
  font-size: 0.9rem;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  background: rgba(255,255,255,0.1);
  padding: 6px 14px;
  border-radius: 50px;
  margin-bottom: 18px;
}

/* H1 */
.lhm-content h1 {
  font-size: 3rem;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 18px;
  color: white;
}

/* Text */
.lhm-content p {
  font-size: 1.2rem;
  max-width: 720px;
  margin: 0 auto 30px;
  opacity: 0.95;
}

/* Buttons Wrapper */
.lhm-buttons {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
}

/* Primary Button */
.lhm-btn-primary {
  background: #cf0707;
  color: #fff !important;
  padding: 14px 26px;
  border-radius: 6px;
  text-decoration: none !important;
  font-weight: 600;
  transition: 0.3s;
}

.lhm-btn-primary:hover {
  background: #a50505;
}

/* Secondary Button */
.lhm-btn-secondary {
  border: 2px solid #fff;
  color: #fff !important;
  padding: 12px 24px;
  border-radius: 6px;
  text-decoration: none !important;
  font-weight: 600;
  transition: 0.3s;
}

.lhm-btn-secondary:hover {
  background: #fff;
  color: #0d2a4c !important;
}

/* ===============================================
   RESPONSIVE
   =============================================== */

@media (max-width: 768px) {

  .leistungen-hero-main {
    padding: 140px 20px 120px;
  }

  .lhm-content h1 {
    font-size: 2.2rem;
  }

  .lhm-content p {
    font-size: 1rem;
  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-c4bcdc0 *//* ===============================================
   EINLEITUNG – IMAGE TEXT
   =============================================== */

.bn-einleitung {
  padding: 90px 20px;
  background: #f5f7fa;
}

.bn-container {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 50px;
  align-items: center;
}

/* Bild */

.bn-image img {
  width: 100%;
  height: auto;
  border-radius: 10px;
  box-shadow: 0 20px 40px rgba(0,0,0,0.15);
}

/* Text */

.bn-text h2 {
  font-size: 2.2rem;
  color: #0d2a4c;
  margin-bottom: 18px;
}

.bn-text p {
  font-size: 1.05rem;
  line-height: 1.7;
  margin-bottom: 16px;
  color: #333;
}

/* Liste */

.bn-list {
  margin-top: 20px;
  padding-left: 0;
  list-style: none;
}

.bn-list li {
  margin-bottom: 10px;
  font-weight: 500;
}

/* ===============================================
   RESPONSIVE
   =============================================== */

@media (max-width: 900px) {

  .bn-container {
    grid-template-columns: 1fr;
  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-327e9b6 *//* ===============================================
   BEREICH – LEISTUNGEN (WOLKENBAU) + BILD
   (alles mit !important, damit es in Elementor sicher greift)
   =============================================== */

.bn-leistungen{
  padding: 95px 20px !important;
  background: #ffffff !important;
}

.bn-container-2{
  max-width: 1200px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 1.1fr 0.9fr !important;
  gap: 55px !important;
  align-items: center !important;
}

/* Text */

.bn-leistungen-text h2{
  font-size: 2.2rem !important;
  color: #0d2a4c !important;
  margin: 0 0 16px !important;
  line-height: 1.25 !important;
}

.bn-leistungen-text p{
  font-size: 1.05rem !important;
  line-height: 1.7 !important;
  color: #333333 !important;
  margin: 0 0 26px !important;
  max-width: 720px !important;
}

/* Services Grid */

.bn-service-grid{
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 14px !important;
}

.bn-service{
  border: 1px solid rgba(13,42,76,0.12) !important;
  border-left: 4px solid #cf0707 !important;
  border-radius: 10px !important;
  padding: 16px 16px !important;
  background: #f8fafc !important;
  transition: transform .25s ease, box-shadow .25s ease !important;
}

.bn-service:hover{
  transform: translateY(-2px) !important;
  box-shadow: 0 14px 28px rgba(0,0,0,0.10) !important;
}

.bn-service-title{
  display: block !important;
  font-weight: 700 !important;
  color: #0d2a4c !important;
  margin-bottom: 6px !important;
  font-size: 1.05rem !important;
}

.bn-service-desc{
  display: block !important;
  color: rgba(0,0,0,0.72) !important;
  font-size: 0.98rem !important;
  line-height: 1.45 !important;
}

/* Link */

.bn-service-link{
  display: inline-block !important;
  margin-top: 10px !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  color: #cf0707 !important;
  text-decoration: none !important;
  transition: .25s ease !important;
}

.bn-service-link:hover{
  color: #0d2a4c !important;
  text-decoration: underline !important;
}

/* CTA Button */

.bn-leistungen-cta{
  margin-top: 26px !important;
}

.bn-cta-btn{
  display: inline-block !important;
  background: #cf0707 !important;
  color:#ffffff !important;
  padding: 14px 26px !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  font-weight: 700 !important;
  transition: .25s ease !important;
}

.bn-cta-btn:hover{
  background: #a50505 !important;
  color:#ffffff !important;
   text-decoration: none !important;
}

/* Bild */

.bn-leistungen-image img{
  width: 100% !important;
  height: auto !important;
  border-radius: 12px !important;
  box-shadow: 0 22px 44px rgba(0,0,0,0.16) !important;
  display: block !important;
}

/* ===============================================
   RESPONSIVE
   =============================================== */

@media (max-width: 980px){

  .bn-container-2{
    grid-template-columns: 1fr !important;
    gap: 34px !important;
  }

  .bn-service-grid{
    grid-template-columns: 1fr !important;
  }

  .bn-leistungen{
    padding: 75px 18px !important;
  }

  .bn-leistungen-text h2{
    font-size: 1.9rem !important;
  }

}
.bn-service-link,
.bn-service-link:hover,
.bn-service-link:focus,
.bn-service-link:active {
  text-decoration: none !important;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-04a19d8 *//* ===============================================
   REGIONEN / EINZUGSGEBIET
   =============================================== */

.bn-regionen{
  position: relative !important;
  padding: 110px 20px !important;
  background: url("https://wolken-bau.at/wp-content/uploads/2025/12/37-scaled.jpg") center/cover no-repeat !important;
  text-align: center !important;
  overflow: hidden !important;
}

/* Overlay */

.bn-regionen-overlay{
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(
    rgba(13,42,76,0.82),
    rgba(13,42,76,0.88)
  ) !important;
  z-index: 1 !important;
}

/* Content */

.bn-regionen-content{
  position: relative !important;
  z-index: 2 !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
  color: #ffffff !important;
}

.bn-regionen-content h2{
  font-size: 2.4rem !important;
  margin-bottom: 16px !important;
  line-height: 1.25 !important;
  color: white;
}

.bn-regionen-content p{
  font-size: 1.1rem !important;
  max-width: 720px !important;
  margin: 0 auto 40px !important;
  opacity: 0.95 !important;
}

/* Orte Grid */

.bn-regionen-grid{
  display: grid !important;
  grid-template-columns: repeat(4,1fr) !important;
  gap: 14px !important;
}

.bn-regionen-grid span{
  background: rgba(255,255,255,0.10) !important;
  border: 1px solid rgba(255,255,255,0.20) !important;
  padding: 12px 14px !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  backdrop-filter: blur(4px) !important;
  transition: .25s ease !important;
}

.bn-regionen-grid span:hover{
  background: #cf0707 !important;
  border-color: #cf0707 !important;
}

/* ===============================================
   RESPONSIVE
   =============================================== */

@media (max-width: 1000px){

  .bn-regionen-grid{
    grid-template-columns: repeat(2,1fr) !important;
  }

}

@media (max-width: 600px){

  .bn-regionen{
    padding: 90px 18px !important;
  }

  .bn-regionen-content h2{
    font-size: 1.9rem !important;
  }

  .bn-regionen-grid{
    grid-template-columns: 1fr !important;
  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-70b6d9c *//* ===============================================
   WARUM WOLKENBAU (USP) + BILD
   =============================================== */

.bn-warum{
  padding: 95px 20px !important;
  background: #f5f7fa !important;
}

.bn-warum-inner{
  max-width: 1200px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 0.95fr 1.05fr !important;
  gap: 55px !important;
  align-items: center !important;
}

/* Bild */

.bn-warum-image img{
  width: 100% !important;
  height: auto !important;
  border-radius: 12px !important;
  box-shadow: 0 22px 44px rgba(0,0,0,0.16) !important;
  display: block !important;
}

/* Content */

.bn-warum-content h2{
  font-size: 2.2rem !important;
  color: #0d2a4c !important;
  margin: 0 0 16px !important;
  line-height: 1.25 !important;
}

.bn-warum-content p{
  font-size: 1.05rem !important;
  line-height: 1.7 !important;
  color: #333333 !important;
  margin: 0 0 26px !important;
  max-width: 720px !important;
}

/* USP Grid */

.bn-usp-grid{
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 14px !important;
}

.bn-usp{
  border: 1px solid rgba(13,42,76,0.12) !important;
  border-radius: 10px !important;
  padding: 16px 16px !important;
  background: #ffffff !important;
  position: relative !important;
  overflow: hidden !important;
}

.bn-usp::before{
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 4px !important;
  background: #cf0707 !important;
}

.bn-usp-title{
  display: block !important;
  font-weight: 800 !important;
  color: #0d2a4c !important;
  margin-bottom: 6px !important;
  font-size: 1.02rem !important;
}

.bn-usp-desc{
  display: block !important;
  color: rgba(0,0,0,0.72) !important;
  font-size: 0.98rem !important;
  line-height: 1.45 !important;
}

/* CTA */

.bn-warum-cta{
  margin-top: 26px !important;
}

.bn-warum-btn{
  display: inline-block !important;
  background: #cf0707 !important;
  color: #ffffff !important;
  padding: 14px 26px !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  font-weight: 800 !important;
  transition: .25s ease !important;
}

.bn-warum-btn:hover{
  background: #a50505 !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

/* ===============================================
   RESPONSIVE
   =============================================== */

@media (max-width: 980px){

  .bn-warum-inner{
    grid-template-columns: 1fr !important;
    gap: 34px !important;
  }

  .bn-usp-grid{
    grid-template-columns: 1fr !important;
  }

  .bn-warum{
    padding: 75px 18px !important;
  }

  .bn-warum-content h2{
    font-size: 1.9rem !important;
  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-c6d28ac *//* ===============================================
   CTA BANNER – WOLKENBAU
   =============================================== */

.wb-cta-banner{
  position: relative !important;
  height: 440px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
  overflow: hidden !important;
  padding: 40px 20px !important;

  background: url("https://wolken-bau.at/wp-content/uploads/2025/11/10-scaled.jpg")
              center center / cover no-repeat !important;
}

/* Overlay */

.wb-cta-overlay{
  position: absolute !important;
  inset: 0 !important;
  background: rgba(13,42,76,0.72) !important;
  z-index: 1 !important;
}

/* Vignette */

.wb-cta-vignette{
  position: absolute !important;
  inset: 0 !important;
  background: radial-gradient(
    circle at center,
    rgba(0,0,0,0) 40%,
    rgba(0,0,0,0.45) 100%
  ) !important;
  z-index: 2 !important;
}

/* Linien */

.wb-cta-lines{
  position: absolute !important;
  inset: 0 !important;
  background-image: repeating-linear-gradient(
    to bottom,
    rgba(255,255,255,0.05) 0,
    rgba(255,255,255,0.05) 2px,
    transparent 4px
  ) !important;
  opacity: 0.25 !important;
  z-index: 3 !important;
}

/* Frame */

.wb-cta-frame{
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  height: 100% !important;
  width: 100% !important;
  border-top: 4px solid rgba(255,255,255,0.13) !important;
  border-bottom: 4px solid rgba(255,255,255,0.13) !important;
  z-index: 6 !important;
}

/* Content */

.wb-cta-content{
  position: relative !important;
  z-index: 10 !important;
  max-width: 900px !important;
}

/* Headline */

.wb-cta-headline{
  font-size: 2.4rem !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  letter-spacing: .8px !important;
  margin-bottom: 18px !important;
  line-height: 1.15 !important;
}

/* Typing Cursor */

.wb-caret{
  width: 2px !important;
  height: 1.05em !important;
  background: #ffffff !important;
  display: inline-block !important;
  transform: translateY(2px) !important;
  animation: wbBlink .7s infinite !important;
  opacity: .7 !important;
}

@keyframes wbBlink{
  0%,50%{opacity:1;}
  51%,100%{opacity:0;}
}

/* Line */

.wb-cta-line{
  display:block !important;
  width:130px !important;
  height:3px !important;
  background:#cf0707 !important;
  margin:0 auto 16px !important;
}

/* Text */

.wb-cta-banner p{
  font-size:1.25rem !important;
  font-weight:500 !important;
  color:#ffffff !important;
  opacity:.95 !important;
  margin-bottom:28px !important;
}

/* Buttons */

.wb-cta-buttons{
  display:flex !important;
  justify-content:center !important;
  gap:16px !important;
  flex-wrap:wrap !important;
}

.wb-cta-btn{
  padding:11px 22px !important;
  border-radius:6px !important;
  color:#ffffff !important;
  border:2px solid #cf0707 !important;
  text-decoration:none !important;
  font-weight:600 !important;
  transition:.3s ease !important;
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  background:rgba(207,7,7,.18) !important;
}

.wb-cta-btn:hover{
  background:#cf0707 !important;
  border-color:#cf0707 !important;
  transform:translateY(-2px) !important;
}

/* Mobile */

@media(max-width:768px){

  .wb-cta-banner{
    height:300px !important;
  }

  .wb-cta-headline{
    font-size:1.6rem !important;
  }

  .wb-cta-banner p{
    font-size:1rem !important;
  }

  .wb-cta-btn{
    padding:9px 16px !important;
    font-size:.88rem !important;
  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-c39f3f9 *//* ===============================================
   KONTAKT INFO – LINKE SPALTE
   =============================================== */

.wb-contact-box{
  background:#ffffff !important;
  padding:38px 34px !important;
  border-radius:12px !important;
  box-shadow:0 20px 45px rgba(0,0,0,0.08) !important;
  height:100% !important;
}

/* Headline */

.wb-contact-box h2{
  font-size:2rem !important;
  color:#0d2a4c !important;
  margin-bottom:14px !important;
}

/* Intro */

.wb-contact-intro{
  font-size:1.05rem !important;
  line-height:1.7 !important;
  color:#333333 !important;
  margin-bottom:26px !important;
}

/* Items */

.wb-contact-items{
  display:flex !important;
  flex-direction:column !important;
  gap:18px !important;
}

/* Item */

.wb-contact-item{
  display:flex !important;
  align-items:flex-start !important;
  gap:14px !important;
  padding-bottom:14px !important;
  border-bottom:1px solid rgba(0,0,0,0.06) !important;
}

/* Icon */

.wb-contact-icon{
  width:42px !important;
  height:42px !important;
  background:#cf0707 !important;
  color:#ffffff !important;
  border-radius:8px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:1rem !important;
  flex-shrink:0 !important;
}

/* Text */

.wb-contact-text span{
  display:block !important;
  font-weight:700 !important;
  color:#0d2a4c !important;
  margin-bottom:3px !important;
  font-size:0.95rem !important;
}

.wb-contact-text a{
  color:#cf0707 !important;
  text-decoration:none !important;
  font-weight:600 !important;
}

.wb-contact-text a:hover{
  text-decoration:none !important;
  color:#0d2a4c !important;
}

.wb-contact-text p{
  margin:0 !important;
  color:#444444 !important;
  font-size:0.95rem !important;
}

/* Note */

.wb-contact-note{
  margin-top:22px !important;
  font-size:0.92rem !important;
  color:#666666 !important;
}

/* Mobile */

@media(max-width:768px){

  .wb-contact-box{
    padding:28px 22px !important;
  }

  .wb-contact-box h2{
    font-size:1.6rem !important;
  }

}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-94280d9 */.elementor-4487 .elementor-element.elementor-element-94280d9 {
    position: relative;
    background: url("https://wolken-bau.at/wp-content/uploads/2025/11/ChatGPT-Image-24.-Nov.-2025-19_39_00.png")
                center/cover no-repeat;
    z-index: 1;
}

/* Premium Overlay – sichtbar aber hochwertig */
.elementor-4487 .elementor-element.elementor-element-94280d9::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.78); /* sichtbar, aber nicht zu hell */
    backdrop-filter: blur(1.5px); /* Blur reduziert, Struktur bleibt */
    z-index: -1;
}/* End custom CSS */