/* preloader2 (18.10.): Feingoldbarren mit Feingehalt-Zähler 0 → 999,9 in der Prägekartusche.
   Ablauf und Projektion in preloader2.js. Klassen-Präfix pl2, nie ".loader" (main.js reagiert darauf). */
html.pl2-lock, html.pl2-lock body { overflow: hidden !important; }
html.pl2-lock { background: #060504; }

.pl2 {
  position: fixed; inset: 0; z-index: 10000;
  background: #060504; overflow: hidden;
  clip-path: inset(0 0 0 0);
  contain: strict;
  pointer-events: auto;
}
.pl2[hidden] { display: none; }
.pl2__stage {
  position: absolute; inset: 0; isolation: isolate; background: #060504; /* reines Schwarz, bis das scharfe Foto dekodiert ist */
  transform-origin: 50% 46%;
  will-change: transform;
}
.pl2__img {
  position: absolute; left: 0; top: 0; max-width: none;
  opacity: 0; transition: opacity .18s ease-out;
  user-select: none; -webkit-user-drag: none;
}
.pl2.is-img .pl2__img { opacity: 1; }

/* Glanzstreifen: weiches Lichtband, auf die Barrenform maskiert. overlay lässt Schwarz schwarz. */
.pl2__sheen {
  position: absolute; inset: 0; mix-blend-mode: overlay; pointer-events: none;
  opacity: 0;
}
.pl2__sheen i {
  position: absolute; top: -20%; bottom: -20%; left: 0; width: 34%;
  background: linear-gradient(90deg, rgba(255,246,226,0) 0%, rgba(255,246,226,.55) 38%, rgba(255,252,240,1) 50%, rgba(255,246,226,.55) 62%, rgba(255,246,226,0) 100%);
  transform: translate3d(-120%, 0, 0) skewX(-18deg);
  will-change: transform;
}
.pl2__sheen--add { mix-blend-mode: soft-light; }

/* Relief-Ebenen: per matrix3d exakt auf das leere Feld projiziert. Nur Licht und Schatten, die Farbe bleibt das Foto.
   Erst sichtbar, wenn gezählt wird (is-run: Foto dekodiert und eingeblendet). */
.pl2__plane {
  position: absolute; left: 0; top: 0;
  transform-origin: 0 0;
  backface-visibility: hidden;
  pointer-events: none;
  visibility: hidden;
}
.pl2__plane--sh { mix-blend-mode: multiply; }
.pl2__plane--hi { mix-blend-mode: screen; }
.pl2.is-run .pl2__plane { visibility: visible; }
.pl2__slot { position: absolute; display: block; transform-origin: 50% 58%; }
.pl2.is-flash .pl2__plane--hi { filter: brightness(1.35); transition: filter .1s ease-out; }

/* Logo (weiß) an der Position des Header-Logos: bleibt beim Abgang stehen, der Vorhang gibt darunter das echte .nav__logo frei.
   Startwerte entsprechen brand.css/style.css; preloader2.js gleicht sie exakt an .nav__logo an, sobald das Seiten-CSS da ist. */
.pl2__logo {
  position: absolute; z-index: 2; top: 14px; left: 56px;
  height: 46px; width: calc(46px * 3.1003);
  background: #F6F5F2;
  -webkit-mask: url("assets/brand/gs-logo.svg") center / contain no-repeat;
          mask: url("assets/brand/gs-logo.svg") center / contain no-repeat;
  opacity: 0; transition: opacity .6s ease-out;
  pointer-events: none;
}
@media (max-width: 1439px) { .pl2__logo { height: 44px; width: calc(44px * 3.1003); top: 14px; } }
@media (max-width: 1199px) { .pl2__logo { left: 32px; } }
@media (min-width: 1080px) and (max-width: 1279px) { .pl2__logo { height: 40px; width: calc(40px * 3.1003); top: 16px; } }
@media (max-width: 899px) { .pl2__logo { height: 36px; width: calc(36px * 3.1003); top: 18px; left: 50%; margin-left: calc(36px * -1.55015); } }
@media (max-width: 767px) { .pl2__logo { top: 18px; } }
@media (max-width: 360px) { .pl2__logo { height: 32px; width: calc(32px * 3.1003); margin-left: calc(32px * -1.55015); top: 20px; } }
.pl2.is-logo .pl2__logo { opacity: .96; } /* Logo darf schon auf Schwarz stehen */

/* Abgang: Vorhang öffnet sich nach oben, das Bild fährt mit */
.pl2.is-out { clip-path: inset(0 0 100% 0); transition: clip-path .58s cubic-bezier(.76,0,.24,1); pointer-events: none; }
.pl2.is-out .pl2__stage { transform: translate3d(0,-7%,0) scale(1.0); transition: transform .58s cubic-bezier(.76,0,.24,1); }
.pl2.is-quick.is-out { clip-path: inset(0 0 0 0); opacity: 0; transition: opacity .35s ease-out; }
.pl2.is-quick.is-out .pl2__stage { transform: none; transition: none; }
.pl2:not(.is-img) .pl2__sheen { visibility: hidden; }
