/* Generated transparent title artwork, scoped to the intro only. */
.intro .intro-title-art {
  position: absolute;
  z-index: 2;
  left: 50%;
  bottom: calc(80 * var(--dohwa-font-unit) + env(safe-area-inset-bottom, 0px));
  width: min(100%, 68svh);
  height: auto;
  aspect-ratio: 9 / 16;
  object-fit: contain;
  transform: translateX(-50%);
  opacity: .9;
  pointer-events: none;
  user-select: none;
}
.intro-title-glyph {
  transform-box: view-box;
  animation: dohwa-glyph-hit 360ms cubic-bezier(.16,1,.3,1) var(--glyph-delay) both;
}
.intro-title-surround { animation: dohwa-title-reveal 650ms ease-out both; }
@keyframes dohwa-glyph-hit {
  0% { opacity: 0; transform: translateY(35px) scale(1.18) rotate(-3deg); }
  45% { opacity: 1; transform: translateY(-5px) scale(.96) rotate(1deg); }
  72% { transform: translateY(2px) scale(1.025) rotate(0deg); }
  100% { opacity: 1; transform: translateY(0) scale(1) rotate(0deg); }
}
@keyframes dohwa-title-reveal { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .intro-title-glyph, .intro-title-surround { animation: none; }
}

/* Keep the artwork and CTA close to the safe bottom edge at every phone size. */
.intro .intro-bottom{bottom:0;padding:0 0 max(4px,env(safe-area-inset-bottom,0px));gap:calc(8 * var(--dohwa-font-unit))}
.intro .intro-cta{width:calc(100% - 16 * var(--dohwa-font-unit));max-width:100%;height:auto;flex:none}
.intro .intro-cta img{display:block;width:100%;height:auto}
.intro .tagline{max-width:calc(100% - 24px);padding:calc(9 * var(--dohwa-font-unit)) calc(16 * var(--dohwa-font-unit))}
@media(max-height:520px){
  .intro .cover-video{object-position:center top}
  .intro .intro-cta{width:min(78%,67svh)}
  .intro .intro-title-art{bottom:calc(90 * var(--dohwa-font-unit));width:min(100%,62svh)}
  .intro .intro-bottom{gap:2px}
}