/* Glass logo reveal — styles. Pair with glass-logo-reveal.js.
 * The element needs a height, e.g. .brand-intro { height: min(70vh, 560px); }
 * Its background is painted by the canvas: set data-background to match the page.
 */
.glass-logo {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  cursor: pointer;          /* clicking replays the reveal */
  user-select: none;
}

/* Plain logo shown when WebGL2 isn't available. */
.glass-logo__fallback {
  position: absolute;
  inset: 0;
  margin: auto;
  display: block;
  max-width: 40%;
  max-height: 40%;
  mask-size: contain;
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-position: center;
}