/* v2.1.9: selectable branded loading motions and page-reveal transitions. */
.site-intro__logo {
  width: min(30vw, 273px);
}

.site-intro__motif {
  position: absolute;
  width: min(42vw, 382px);
  aspect-ratio: 1;
  pointer-events: none;
}

.site-intro__motif span {
  position: absolute;
  display: none;
}

.site-intro--breathe.is-loaded .site-intro__logo {
  animation: chisou-intro-breathe 1120ms cubic-bezier(.36, .02, .22, 1) .08s forwards;
}

.site-intro--ripple.is-loaded .site-intro__logo {
  animation: chisou-intro-ripple-logo 980ms cubic-bezier(.2, .78, .22, 1) .1s forwards;
}

.site-intro--ripple .site-intro__motif span {
  inset: 26%;
  display: block;
  border: 1px solid rgba(211, 185, 111, .82);
  border-radius: 50%;
  opacity: 0;
}

.site-intro--ripple.is-loaded .site-intro__motif span { animation: chisou-intro-ripple 920ms ease-out forwards; }
.site-intro--ripple.is-loaded .site-intro__motif span:nth-child(2) { animation-delay: 160ms; }
.site-intro--ripple.is-loaded .site-intro__motif span:nth-child(3) { animation-delay: 320ms; }
.site-intro--ripple.is-loaded .site-intro__motif span:nth-child(4) { animation-delay: 480ms; }

.site-intro--orbit.is-loaded .site-intro__logo {
  animation: chisou-intro-orbit-logo 1050ms cubic-bezier(.2, .8, .22, 1) .08s forwards;
}

.site-intro--orbit .site-intro__motif { opacity: 0; }
.site-intro--orbit .site-intro__motif span {
  top: 50%;
  left: 50%;
  display: block;
  width: 10px;
  height: 10px;
  margin: -5px;
  border-radius: 50%;
  background: var(--gold-light);
  box-shadow: 0 0 18px rgba(211, 185, 111, .72);
}
.site-intro--orbit.is-loaded .site-intro__motif { animation: chisou-intro-orbit-wrap 920ms linear .06s forwards; }
.site-intro--orbit.is-loaded .site-intro__motif span:nth-child(1) { transform: rotate(0deg) translateX(min(20vw, 182px)); }
.site-intro--orbit.is-loaded .site-intro__motif span:nth-child(2) { transform: rotate(90deg) translateX(min(20vw, 182px)); }
.site-intro--orbit.is-loaded .site-intro__motif span:nth-child(3) { transform: rotate(180deg) translateX(min(20vw, 182px)); }
.site-intro--orbit.is-loaded .site-intro__motif span:nth-child(4) { transform: rotate(270deg) translateX(min(20vw, 182px)); }

.site-intro.site-intro--exit-wipe.is-leaving {
  clip-path: inset(0 0 100% 0);
  opacity: 1;
  visibility: visible;
  transition: clip-path 680ms cubic-bezier(.7, 0, .3, 1);
}

.site-intro.site-intro--exit-slide.is-leaving {
  transform: translate3d(-100%, 0, 0);
  opacity: 1;
  visibility: visible;
  transition: transform 680ms cubic-bezier(.7, 0, .3, 1);
}

.site-intro.site-intro--exit-curtain.is-leaving {
  transform: scaleY(0);
  transform-origin: top center;
  opacity: 1;
  visibility: visible;
  transition: transform 680ms cubic-bezier(.7, 0, .3, 1);
}

.site-intro.is-finished { display: none; }

@keyframes chisou-intro-breathe {
  0% { opacity: 0; transform: scale(.52); }
  45% { opacity: 1; transform: scale(1.08); }
  72% { opacity: 1; transform: scale(.94); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes chisou-intro-ripple-logo {
  0% { opacity: 0; transform: scale(.58); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes chisou-intro-ripple {
  0% { opacity: .85; transform: scale(.3); }
  100% { opacity: 0; transform: scale(2.2); }
}

@keyframes chisou-intro-orbit-logo {
  0% { opacity: 0; transform: scale(.62); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes chisou-intro-orbit-wrap {
  0% { opacity: 0; transform: rotate(0deg); }
  18% { opacity: 1; }
  100% { opacity: 0; transform: rotate(390deg); }
}

@media (max-width: 767px) {
  .site-intro__logo { width: min(46vw, 210px); }
  .site-intro__motif { width: min(66vw, 300px); }
  .site-intro--orbit.is-loaded .site-intro__motif span:nth-child(1) { transform: rotate(0deg) translateX(min(31vw, 140px)); }
  .site-intro--orbit.is-loaded .site-intro__motif span:nth-child(2) { transform: rotate(90deg) translateX(min(31vw, 140px)); }
  .site-intro--orbit.is-loaded .site-intro__motif span:nth-child(3) { transform: rotate(180deg) translateX(min(31vw, 140px)); }
  .site-intro--orbit.is-loaded .site-intro__motif span:nth-child(4) { transform: rotate(270deg) translateX(min(31vw, 140px)); }
}

@media (prefers-reduced-motion: reduce) {
  .site-intro__motif { display: none; }
  .site-intro--breathe.is-loaded .site-intro__logo,
  .site-intro--ripple.is-loaded .site-intro__logo,
  .site-intro--orbit.is-loaded .site-intro__logo { animation: none !important; opacity: 1; transform: scale(1); }
}
