:root {
  --pkd-blue: #0055a0;
}

/*
 * V2 deliberately separates three things:
 * 1) white cover, 2) inline assembly SVG, 3) static flight image.
 * The inline SVG never flies and the flight image never contains animations.
 */
.pkd-intro {
  position: fixed;
  inset: 0;
  z-index: 999999;
  display: grid;
  place-items: center;
  background: #fff;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

html.pkd-intro-pending .pkd-intro,
body.pkd-intro-running .pkd-intro {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.pkd-intro--leaving {
  opacity: 0 !important;
  transition: opacity 150ms linear;
  pointer-events: none !important;
}

/* Anti-flash: show the complete SVG only after JS prepared all piece states. */
.pkd-intro__logo {
  width: min(56vw, 620px);
  max-width: calc(100vw - 48px);
  opacity: 0;
  transform-origin: center center;
}

body.pkd-intro-running .pkd-intro__logo {
  opacity: 1;
}

.pkd-intro__logo > svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

.pkd-intro__logo svg #Brett01,
.pkd-intro__logo svg #Brett02,
.pkd-intro__logo svg #Brett03,
.pkd-intro__logo svg #Brett04,
.pkd-intro__logo svg #Brett05,
.pkd-intro__logo svg #Block01-Deckel,
.pkd-intro__logo svg #Block01,
.pkd-intro__logo svg #Block02-Deckel,
.pkd-intro__logo svg #Block02,
.pkd-intro__logo svg #Block03-Deckel,
.pkd-intro__logo svg #Block03,
.pkd-intro__logo svg #Boden,
.pkd-intro__logo svg #Text01,
.pkd-intro__logo svg #Text02-Hintergrund,
.pkd-intro__logo svg #Text02,
.pkd-intro__logo svg #Text02R {
  transform-box: fill-box;
  transform-origin: center;
}

/* Independent, static visual used only for the flight. */
.pkd-intro-flight {
  position: fixed !important;
  z-index: 1000001 !important;
  display: block !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  pointer-events: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  will-change: left, top, width, height;
  overflow: visible !important;
}

.pkd-intro-flight > svg {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

/* Real Site Logo is hidden until the static flight image has landed. */
html.pkd-intro-pending .wp-block-site-logo img,
body.pkd-intro-running .wp-block-site-logo img,
html.pkd-intro-pending img.custom-logo,
body.pkd-intro-running img.custom-logo {
  opacity: 0 !important;
}

body.pkd-intro-running.pkd-intro-handoff .wp-block-site-logo img,
body.pkd-intro-running.pkd-intro-handoff img.custom-logo {
  opacity: 1 !important;
}

@media (max-width: 820px) {
  .pkd-intro__logo {
    width: min(82vw, 520px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .pkd-intro { display: none !important; }
  .wp-block-site-logo img,
  img.custom-logo { opacity: 1 !important; }
}
