/* Preloader-Overlay */ #site-preloader { position: fixed; inset: 0; z-index: 9998; background-color: var(--color-content-primary); opacity: 0; pointer-events: none; transition: opacity 0.6s ease; } #site-preloader.is-visible { opacity: 1; } #site-preloader.is-hidden { opacity: 0; } /* Solange geladen wird: Scrollen sperren, Klicks auf Overlay zulassen, und den restlichen Seiteninhalt (inkl. Hintergrundbild) unsichtbar machen. WICHTIG: #page ggf. an deinen tatsächlichen Wrapper anpassen (Inspector -> direktes Kind von ) */ body.is-preloading { overflow: hidden; } body.is-preloading #site-preloader { pointer-events: all; } body.is-preloading #page-content { visibility: hidden; } /* Logo & Nav-Links: visibility gezielt wieder aufheben (das geht bei "visibility", nicht bei "opacity"!) und über dem Overlay liegen. Eigene Opacity-Transition fürs Fade-in bleibt erhalten. */ body.is-preloading #hofstaetter-logo, body.is-preloading .nav-main-link { visibility: visible; position: relative; z-index: 9999; opacity: 0; transition: opacity 0.5s ease; } body.is-preloading #hofstaetter-logo.is-visible, body.is-preloading .nav-main-link.is-visible { opacity: 1; }