/* CO Zeiger - eigener Mauszeiger fuer Vollbildansichten.

   Gemeinsames Bauteil fuer Hero und Galerie. Vorher lag es nur in der Galerie;
   zwei Kopien waeren mit der Zeit auseinandergelaufen.

   Warum kein CSS-cursor: Der springt hart um und kann nicht ueberblenden. */

.co-zeiger-aus { cursor: none; }
.co-zeiger-aus * { cursor: none; }

/* Ausnahme: Ueber Knoepfen und Verweisen gilt der gewoehnliche Finger - dort
   blaettert ein Klick nicht, also darf dort auch kein Blaetterpfeil stehen. */
.co-zeiger-aus button,
.co-zeiger-aus button *,
.co-zeiger-aus a,
.co-zeiger-aus a * { cursor: pointer; }

.co-zeiger {
  position: fixed; left: 0; top: 0; z-index: 320;
  width: 48px; height: 48px;
  margin: -24px 0 0 -24px;
  display: grid; place-items: center;
  pointer-events: none;
  opacity: 0;
  transform: translate3d(-100px, -100px, 0);
  /* Nur die Sichtbarkeit blendet, die Bewegung nicht - sonst laeuft der Zeiger
     der Maus hinterher. */
  transition: opacity .3s ease;
  will-change: transform;
}
[data-an="1"] > .co-zeiger { opacity: 1; }
/* Ueber einem Knopf zeigt der eigene Zeiger nichts - das Skript setzt dafuer
   "aus". Die Regel steht nach der oberen, damit sie gewinnt. */
[data-an="1"] > .co-zeiger[data-modus="aus"] { opacity: 0; }

.co-zeiger span {
  position: absolute;
  font-family: var(--co-sans, 'Manrope', sans-serif);
  font-size: 30px; line-height: 1; font-weight: 300;
  color: var(--co-sand, #F4ECE5);
  text-shadow: 0 1px 12px rgba(0, 0, 0, .75);
  opacity: 0;
  transition: opacity .25s ease;
}
.co-zeiger[data-modus="links"] span[data-z="links"],
.co-zeiger[data-modus="rechts"] span[data-z="rechts"],
.co-zeiger[data-modus="zu"] span[data-z="zu"] { opacity: 1; }