/* ==========================================================================
   LAALI Gebäudeservice – site.css
   NUR Frontend. Enthält die Startzustände der Scroll-Animationen und
   Feinheiten, die im Editor NICHT gelten sollen (damit im Editor alle Inhalte
   sofort sichtbar sind). base.css wird als Abhängigkeit vorher geladen.
   ========================================================================== */

/* Reveal-Startzustände (Endzustand .in steht in base.css) */
.rv{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rv-1{transition-delay:.08s}
.rv-2{transition-delay:.16s}
.rv-3{transition-delay:.24s}
.rv-4{transition-delay:.32s}
.mask>span{display:block;transform:translateY(102%);transition:transform 1.05s var(--ease)}

@media (prefers-reduced-motion:reduce){
  .rv{opacity:1;transform:none}
  .mask>span{transform:none}
}

/* V4: Im Hero keine Start-Transparenz. Animationen anderer Sektionen bleiben erhalten. */
.hero .rv,
.hero .mask,
.hero .mask > span{
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
}


/* ========================================================================== 
   V5 – Frontend-Fix: Hero-Inhalt immer oberhalb des Overlays und Trustbar-Overlap
   ========================================================================== */
body .wp-site-blocks .wp-block-cover.hero .wp-block-cover__inner-container{
  position:relative !important;
  z-index:30 !important;
  opacity:1 !important;
  visibility:visible !important;
  filter:none !important;
  mix-blend-mode:normal !important;
}
body .wp-site-blocks .wp-block-cover.hero .wp-block-cover__inner-container,
body .wp-site-blocks .wp-block-cover.hero .wp-block-cover__inner-container *{
  opacity:1 !important;
  visibility:visible !important;
  filter:none !important;
  mix-blend-mode:normal !important;
}
body .wp-site-blocks .wp-block-cover.hero .hero-kicker,
body .wp-site-blocks .wp-block-cover.hero h1,
body .wp-site-blocks .wp-block-cover.hero .wp-block-heading,
body .wp-site-blocks .wp-block-cover.hero .hero-sub,
body .wp-site-blocks .wp-block-cover.hero .hero-trust,
body .wp-site-blocks .wp-block-cover.hero .hero-trust li{
  color:#fff !important;
  text-shadow:0 1px 2px rgba(0,0,0,.16) !important;
}
body .wp-site-blocks .wp-block-cover.hero .hero-sub,
body .wp-site-blocks .wp-block-cover.hero .hero-trust li{color:rgba(255,255,255,.94) !important}
body .wp-site-blocks .wp-block-cover.hero .wp-block-button.btn-primary .wp-block-button__link{
  color:#23180A !important;
  background:var(--gold) !important;
}
body .wp-site-blocks .wp-block-cover.hero .wp-block-button.btn-ghost .wp-block-button__link{
  color:#fff !important;
  background:rgba(255,255,255,.05) !important;
  border-color:rgba(255,255,255,.5) !important;
}
/* WordPress-Cover-Layer sicher hinter den Inhalten halten. */
body .wp-site-blocks .wp-block-cover.hero::after,
body .wp-site-blocks .wp-block-cover.hero > .wp-block-cover__background{
  z-index:2 !important;
  pointer-events:none !important;
}
body .wp-site-blocks .wp-block-cover.hero > video,
body .wp-site-blocks .wp-block-cover.hero > .wp-block-cover__video-background{z-index:0 !important}

/* Die Vorteilsbox liegt sichtbar über der unteren Hero-Kante. */
body .wp-site-blocks .tbar-sec{
  margin-top:-82px !important;
  position:relative !important;
  z-index:40 !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
}
body .wp-site-blocks .tbar-sec .tbar{
  position:relative !important;
  z-index:41 !important;
}
body .wp-site-blocks .tbar-sec + .sec{padding-top:clamp(88px,7vw,124px) !important}
@media (max-width:860px){
  body .wp-site-blocks .tbar-sec{margin-top:-58px !important}
  body .wp-site-blocks .tbar-sec + .sec{padding-top:86px !important}
}
@media (max-width:620px){
  body .wp-site-blocks .tbar-sec{margin-top:-34px !important}
  body .wp-site-blocks .tbar-sec + .sec{padding-top:70px !important}
}

/* ========================================================================== 
   V7 – Desktop-Tonsteuerung und durchgehende Vorher/Nachher-Linie
   ========================================================================== */
/* Der große Gutenberg-Inhaltslayer darf den Tonknopf nicht abfangen. */
body .wp-site-blocks .wp-block-cover.hero .wp-block-cover__inner-container{
  pointer-events:none !important;
}
body .wp-site-blocks .wp-block-cover.hero .wp-block-cover__inner-container a,
body .wp-site-blocks .wp-block-cover.hero .wp-block-cover__inner-container button,
body .wp-site-blocks .wp-block-cover.hero .wp-block-cover__inner-container input,
body .wp-site-blocks .wp-block-cover.hero .wp-block-cover__inner-container select,
body .wp-site-blocks .wp-block-cover.hero .wp-block-cover__inner-container textarea{
  pointer-events:auto !important;
}
body .wp-site-blocks .wp-block-cover.hero .vctl{
  position:absolute !important;
  z-index:999 !important;
  pointer-events:auto !important;
  isolation:isolate !important;
}
body .wp-site-blocks .wp-block-cover.hero .vctl button{
  z-index:1000 !important;
  pointer-events:auto !important;
  cursor:pointer !important;
  user-select:none !important;
}

/* Die Trennlinie des Vergleichs läuft vom oberen bis zum unteren Bildrand. */
body .wp-site-blocks .ba .ba-line,
.ba .ba-line{
  top:0 !important;
  bottom:0 !important;
  width:3px !important;
  height:auto !important;
  min-height:0 !important;
  transform:translateX(-1.5px) !important;
  background:#fff !important;
  border-left:1px solid rgba(6,43,94,.42) !important;
  border-right:1px solid rgba(6,43,94,.42) !important;
  box-shadow:0 0 0 1px rgba(255,255,255,.8),0 0 10px rgba(6,43,94,.42) !important;
  z-index:30 !important;
  pointer-events:none !important;
  display:block !important;
}
body .wp-site-blocks .ba .ba-knob,
.ba .ba-knob{
  z-index:31 !important;
}
body .wp-site-blocks .ba .ba-tag,
.ba .ba-tag{
  z-index:32 !important;
}

/* V12: Beschriftungen dürfen den oberen Teil der Trennlinie nicht verdecken. */
body .wp-site-blocks .ba .ba-line,
.ba .ba-line{
  top:-1px !important;
  bottom:-1px !important;
  height:calc(100% + 2px) !important;
  z-index:60 !important;
}
body .wp-site-blocks .ba .ba-tag,
.ba .ba-tag{z-index:50 !important;}
body .wp-site-blocks .ba .ba-knob,
.ba .ba-knob{z-index:61 !important;}

/* Fallback ohne JavaScript: Der erste Formularschritt bleibt unter dem Header sichtbar. */
#angebot-start {
  scroll-margin-top: 150px;
}

@media (max-width: 782px) {
  #angebot-start {
    scroll-margin-top: 112px;
  }
}
