/* =========================================================
   Passepartout-Rahmen (Startseite)
   ========================================================= */
body.home {
  position: relative; /* Referenz für Pseudo-Element */
  overflow: hidden;
}


body.home::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  height: 100dvh;

  border: var(--passepartout-size) solid var(--secondary-color);
  box-sizing: border-box;
  pointer-events: none;
  z-index: 8;
  box-shadow: inset 0 0 15px rgba(0, 0, 0, 0.2);
}

/* Menü auf Rahmen legen */
body.home .main-header-bar,
body.home .site-primary-footer-wrap {
  z-index: 10;
  background-color: transparent;
  border: none;
  position: relative;
}

.home .site-header{
  position: sticky;
  top: 0;
}

.home #page .site-content{
  flex-grow: 0 !important;
}

.home .site-primary-footer-wrap{
  position: fixed !important;
  bottom: 0;
}

/* Standard-Astra-Footer auf allen Seiten außer der Startseite ausblenden */
body:not(.home) .site-primary-footer-wrap {
    display: none;
}

/* Widget nur auf Nicht-Startseiten anzeigen */
.home .site-below-footer-wrap {
    display: none !important;
}

/* =========================================================
   Slideshow im Passepartout-Rahmen
   ========================================================= */
body.home .frame-slider {
  position: fixed;
  top: var(--passepartout-size);
  left: var(--passepartout-size);
  right: var(--passepartout-size);
  bottom: var(--passepartout-size);
  width: calc(100vw - 2 * var(--passepartout-size));
  height: calc(100vh - 2 * var(--passepartout-size));
  overflow: hidden;
  z-index: 7;
}

body.home .frame-slider .slides {
  position: relative;
  width: 100%;
  height: 100%;
}

body.home .frame-slider .slide {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

body.home .frame-slider .slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}


@media (max-width: 1058.5px) {
  body.home .frame-slider {
    top: calc(var(--passepartout-size) * 2);
    height: calc(100vh - 3 * var(--passepartout-size));
  }

  body.home::before {
    border-top: calc(var(--passepartout-size) * 2) solid var(--secondary-color);
  }
}



@media (max-width: 921.5px) {
   body.home .frame-slider {
    position: fixed;
    top: calc(var(--passepartout-size-mobile) + env(safe-area-inset-top));
    left: calc(var(--passepartout-size-mobile)/4);
    right: calc(var(--passepartout-size-mobile)/4);
    bottom: calc(var(--passepartout-size-mobile)/4 + env(safe-area-inset-bottom));
    width: calc(100vw - calc(var(--passepartout-size-mobile)/2));
    height: calc(100dvh - var(--passepartout-size-mobile)*1.25 - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    overflow: hidden;
    z-index: 7;
  }

  body.home::before {
    border-top: var(--passepartout-size-mobile) solid var(--secondary-color);
    border-left: calc(var(--passepartout-size-mobile)/4) solid var(--secondary-color);
    border-bottom: calc(var(--passepartout-size-mobile)/4) solid var(--secondary-color);
    border-right: calc(var(--passepartout-size-mobile)/4) solid var(--secondary-color);
    height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom));
  }

	
	.home .site-header{
  position: relative;

}

}