.home-page--lettering .home-art{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  transform:none;
  translate:none;
  background-image:url('/assets/backgrounds/home-desktop.png');
  background-repeat:no-repeat;
  background-position:center top;
  background-size:cover;
}
.main:has(.home-page--lettering),
.home-page--lettering{
  max-width:100%;
  overflow-x:clip;
}
.home-page--lettering .home-poster{
  min-height:clamp(29rem,72svh,42rem);
  display:grid;
  place-items:center;
  isolation:isolate;
}
.home-lettering .poster-wordmark{
  position:relative;
  inset:auto;
  z-index:3;
  width:min(94%,34rem);
  max-width:none;
  transform:none;
  opacity:1;
  filter:drop-shadow(0 0 9px #fff) drop-shadow(0 0 24px #fff) drop-shadow(0 8px 16px #76baf06e);
}
.home-lettering .lettering-note--ko{
  top:12%;
  left:3%;
  width:min(31%,10rem);
}
.home-lettering .lettering-note--en{
  top:17%;
  right:0;
  width:min(29%,9.3rem);
}
.lettering-signature{
  bottom:12%;
}
.lettering-orbit{
  display:none;
}
.home-lettering .sparkles{z-index:auto;inset:-9% -7% -13%}
.home-lettering .decoration{
  z-index:2;
  color:#439ee8;
  filter:drop-shadow(0 0 2px #fff) drop-shadow(0 0 7px #fff) drop-shadow(0 2px 4px #3b91d98c);
}
.home-lettering .decoration--heart{color:#68aef0;stroke:#fff;stroke-width:.7px}
.home-lettering .decoration--heart.decoration--4,
.home-lettering .decoration--heart.decoration--12{color:#ee8da4}
.home-lettering .decoration--star{color:#77bcf2;stroke:#fff;stroke-width:.55px}
.home-lettering .decoration--sparkle{color:#79c6ff;stroke:#fff;stroke-width:.5px}
.home-lettering .decoration--paw{color:#559de0;stroke:#fff;stroke-width:.65px}
.home-lettering .decoration--2,
.home-lettering .decoration--4,
.home-lettering .decoration--6,
.home-lettering .decoration--10,
.home-lettering .decoration--12{z-index:5}
.home-lettering .decoration--1{left:7%;top:17%}
.home-lettering .decoration--2{right:1%;top:53%;width:2.7rem;height:2.7rem}
.home-lettering .decoration--3{right:9%;top:8%}
.home-lettering .decoration--4{left:5%;top:61%;width:2.15rem;height:2.15rem}
.home-lettering .decoration--5{right:2%;top:78%}
.home-lettering .decoration--6{left:47%;bottom:2%;width:1.35rem;height:1.35rem}
.home-lettering .decoration--7{left:17%;top:43%}
.home-lettering .decoration--8{right:17%;top:42%}
.home-lettering .decoration--9{left:8%;bottom:3%}
.home-lettering .decoration--10{right:4%;top:28%;width:1.9rem;height:1.9rem}
.home-lettering .decoration--11{left:29%;bottom:5%}
.home-lettering .decoration--12{right:26%;bottom:13%;width:1.75rem;height:1.75rem}
.home-lettering .decoration--13{right:39%;left:auto;top:3%}
.home-lettering .decoration--14{right:43%;bottom:1%}
.home-page--lettering .introduction{margin-top:-3rem}

@media(min-width:640px){
  .home-page--lettering .home-poster{min-height:40rem}
  .home-lettering .poster-wordmark{width:min(82%,42rem)}
  .home-lettering .lettering-note--ko{left:4%;width:min(25%,12rem)}
  .home-lettering .lettering-note--en{right:3%;width:min(24%,11rem)}
  .lettering-signature{bottom:13%}
}
@media(min-width:1000px){
  .home-page--lettering{grid-template-columns:minmax(0,1fr);max-width:76rem;margin-inline:auto}
  .home-page--lettering .home-poster{min-height:clamp(34rem,68vh,48rem);width:min(100%,70rem);margin-inline:auto}
  .home-lettering .poster-wordmark{width:min(70%,48rem)}
  .home-lettering .lettering-note--ko{top:15%;left:8%;width:min(19%,13rem)}
  .home-lettering .lettering-note--en{top:17%;right:8%;width:min(18%,12rem)}
  .home-lettering .sparkles{inset:2% 2% 4%}
  .lettering-signature{bottom:10%}
  .home-page--lettering .introduction{width:min(36rem,86%);margin:-5rem auto 0}
}
@media(max-width:420px){
  .home-page--lettering .home-poster{min-height:27rem}
  .home-lettering .poster-wordmark{width:96%}
  .home-lettering .lettering-note--ko{top:10%;left:1%;width:34%}
  .home-lettering .lettering-note--en{top:14%;right:-1%;width:31%}
  .lettering-signature{bottom:11%}
  .home-page--lettering .introduction{margin-top:-2rem}
}

@media(prefers-reduced-motion:no-preference){
  .home-lettering .decoration--sparkle{
    animation:heon-star-shimmer 5.5s ease-in-out infinite,home-sparkle-drift 8.8s ease-in-out infinite;
  }
  .home-lettering .decoration--heart.decoration--2{animation:home-heart-drift-a 7.7s ease-in-out -2.1s infinite}
  .home-lettering .decoration--heart.decoration--4{animation:home-heart-drift-b 9.3s ease-in-out -5.4s infinite}
  .home-lettering .decoration--heart.decoration--9{animation:home-heart-drift-c 8.5s ease-in-out -1.3s infinite}
  .home-lettering .decoration--heart.decoration--12{animation:home-heart-drift-a 10.4s ease-in-out -7.2s infinite reverse}
  .home-lettering .decoration--heart.decoration--14{animation:home-heart-drift-b 7.1s ease-in-out -3.8s infinite reverse}
}
@keyframes home-sparkle-drift{
  0%,100%{translate:-4px 1px}
  35%{translate:5px -10px}
  68%{translate:1px 5px}
}
@keyframes home-heart-drift-a{
  0%,100%{translate:-3px 3px;rotate:-8deg}
  34%{translate:7px -14px;rotate:7deg}
  68%{translate:2px -4px;rotate:-3deg}
}
@keyframes home-heart-drift-b{
  0%,100%{translate:5px -2px;rotate:8deg}
  31%{translate:-6px -10px;rotate:-9deg}
  72%{translate:-1px 6px;rotate:4deg}
}
@keyframes home-heart-drift-c{
  0%,100%{translate:-2px -5px;rotate:-4deg}
  42%{translate:8px 5px;rotate:10deg}
  76%{translate:-5px 1px;rotate:-7deg}
}
