/* 첫 화면 제목: 먼저 문장이 나오고, 마지막에 "상상스토리"가 채워지며 계속 흐르는 그라데이션 */
.concept-home .headline{font-weight:700;letter-spacing:-.035em}
.concept-home .headline strong{font-weight:800}
.concept-home .hero .headline .hero-word.brandtext{
  position:relative;font-weight:800;letter-spacing:-.03em;
  background-image:
    linear-gradient(105deg,rgba(255,255,255,0) 42%,rgba(255,255,255,.4) 50%,rgba(255,255,255,0) 58%),
    linear-gradient(100deg,#1596ff 0%,#3f6bff 25%,#6f56f5 50%,#b36bff 75%,#1596ff 100%);
  background-size:60% 100%,200% 100%;
  background-repeat:no-repeat,repeat-x;
  background-position:-150% 0,0 0;
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 8px 18px rgba(95,100,255,.3));
  opacity:1;transform:none;
  animation:ssKeyIn 1.4s var(--word-delay,2.1s) cubic-bezier(.2,.8,.2,1) both, ssKeyFlow 6s linear infinite;
}
.concept-home .hero .headline .hero-word.brandtext::after{
  content:"";position:absolute;left:2%;right:2%;bottom:-.02em;height:.07em;border-radius:99px;
  background:linear-gradient(90deg,#1596ff,#6f56f5,#b36bff);
  transform:scaleX(0);transform-origin:left center;
  animation:ssKeyLine 1s calc(var(--word-delay,2.1s) + .9s) cubic-bezier(.2,.8,.2,1) forwards;
}
@keyframes ssKeyIn{
  from{opacity:0;transform:translateY(34%) scale(.88);filter:blur(16px) drop-shadow(0 0 0 rgba(95,100,255,0))}
  to{opacity:1;transform:none;filter:blur(0) drop-shadow(0 8px 18px rgba(95,100,255,.3))}
}
@keyframes ssKeyFlow{from{background-position:-150% 0,0 0}to{background-position:260% 0,200% 0}}
@keyframes ssKeyLine{to{transform:scaleX(1)}}
@media(prefers-reduced-motion:reduce){
  .concept-home .hero .headline .hero-word.brandtext{animation:none}
  .concept-home .hero .headline .hero-word.brandtext::after{animation:none;transform:none}
}

/* 상상스토리 밑줄 → 자연스러운 물결 */
.concept-home .hero .headline .hero-word.brandtext::after{
  left:0;right:0;bottom:-.2em;height:.2em;border-radius:0;
  background:linear-gradient(90deg,#1596ff,#6f56f5 55%,#b36bff);opacity:.85;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 10' preserveAspectRatio='none'%3E%3Cpath d='M0 5 Q10 1.5 20 5 T40 5' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") 0 50%/.75em 100% repeat-x;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 10' preserveAspectRatio='none'%3E%3Cpath d='M0 5 Q10 1.5 20 5 T40 5' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") 0 50%/.75em 100% repeat-x;
  transform:none;clip-path:inset(0 100% 0 0);
  animation:ssWaveIn 1.2s calc(var(--word-delay,2.1s) + .5s) cubic-bezier(.2,.8,.2,1) forwards,ssWaveFlow 3.2s calc(var(--word-delay,2.1s) + 1.7s) linear infinite;
}
@keyframes ssWaveIn{to{clip-path:inset(0 0 0 0)}}
@keyframes ssWaveFlow{to{-webkit-mask-position:.75em 50%;mask-position:.75em 50%}}
@media(prefers-reduced-motion:reduce){.concept-home .hero .headline .hero-word.brandtext::after{animation:none;clip-path:none}}
.concept-home .hero .headline .hero-word.brandtext::after{bottom:-.02em;height:.17em;-webkit-mask-size:.62em 100%;mask-size:.62em 100%}
@keyframes ssWaveFlow{to{-webkit-mask-position:.62em 50%;mask-position:.62em 50%}}

/* 상상스토리 밑줄 → 자연스러운 그라데이션 선 (양 끝이 부드럽게 사라짐) */
.concept-home .hero .headline .hero-word.brandtext::after{
  left:-2%;right:-2%;bottom:.1em;height:.07em;border-radius:99px;opacity:1;
  background:linear-gradient(90deg,#1596ff,#6f56f5 50%,#b36bff);
  -webkit-mask:linear-gradient(90deg,transparent 0,#000 18%,#000 82%,transparent 100%);
          mask:linear-gradient(90deg,transparent 0,#000 18%,#000 82%,transparent 100%);
  box-shadow:0 .06em .18em rgba(111,86,245,.35);
  clip-path:none;transform:scaleX(0);transform-origin:left center;
  animation:ssLineIn 1.3s calc(var(--word-delay,2.1s) + .45s) cubic-bezier(.16,.8,.24,1) forwards;
}
@keyframes ssLineIn{to{transform:scaleX(1)}}
@media(prefers-reduced-motion:reduce){.concept-home .hero .headline .hero-word.brandtext::after{animation:none;transform:none}}
