/* ══════════════════════════════════════════════
   WEDDIA-SC-001 | animations.css
   Warm Clinical Editorial — Rich Scroll System
   ══════════════════════════════════════════════ */

/* ── 기본 애니메이션 상태 ── */
[data-anim] { will-change: transform, opacity; }

/* Fade Up */
[data-anim="fade-up"]   { opacity:0; transform:translateY(48px); }
/* Fade Down */
[data-anim="fade-down"] { opacity:0; transform:translateY(-32px); }
/* Fade Left */
[data-anim="fade-left"] { opacity:0; transform:translateX(-48px); }
/* Fade Right */
[data-anim="fade-right"]{ opacity:0; transform:translateX(48px); }
/* Scale In */
[data-anim="scale-in"]  { opacity:0; transform:scale(0.92); }
/* Scale Up (큰 숫자용) */
[data-anim="scale-up"]  { opacity:0; transform:scale(0.8) translateY(20px); }

/* Clip Reveal (이미지용 — bottom to top) */
[data-anim="clip-up"] {
  clip-path: inset(100% 0 0 0);
  opacity: 1;
}
/* Clip Reveal (left to right) */
[data-anim="clip-left"] {
  clip-path: inset(0 100% 0 0);
  opacity: 1;
}

/* Line Draw */
[data-anim="line"] {
  transform: scaleX(0);
  transform-origin: left center;
  opacity: 1;
}

/* Counter */
[data-anim="count"] { opacity:0; }

/* ── 활성화 (is-visible 클래스 추가 시) ── */
[data-anim].is-visible {
  opacity:1 !important;
  transform:none !important;
  clip-path: inset(0 0 0 0) !important;
  transition:
    opacity     0.8s cubic-bezier(0.16,1,0.3,1),
    transform   0.8s cubic-bezier(0.16,1,0.3,1),
    clip-path   0.9s cubic-bezier(0.16,1,0.3,1);
}
[data-anim="line"].is-visible {
  transform: scaleX(1) !important;
  transition: transform 0.9s cubic-bezier(0.16,1,0.3,1);
}

/* ── 지연 시스템 ── */
[data-delay="1"]  { transition-delay:0.08s !important; }
[data-delay="2"]  { transition-delay:0.16s !important; }
[data-delay="3"]  { transition-delay:0.24s !important; }
[data-delay="4"]  { transition-delay:0.32s !important; }
[data-delay="5"]  { transition-delay:0.40s !important; }
[data-delay="6"]  { transition-delay:0.48s !important; }
[data-delay="7"]  { transition-delay:0.56s !important; }
[data-delay="8"]  { transition-delay:0.64s !important; }

/* ── Split Text (chars) ── */
.split-text { overflow: hidden; display: block; }
.split-text .char {
  display: inline-block;
  transform: translateY(110%) rotate(2deg);
  opacity: 0;
  transition:
    transform 0.7s cubic-bezier(0.16,1,0.3,1),
    opacity   0.5s ease;
  will-change: transform;
}
.split-text.is-visible .char {
  transform: none;
  opacity: 1;
}
/* char별 지연 (JS가 inline style로 적용) */

/* ── Section Line ── */
.section-line {
  display: block;
  width: 48px;
  height: 1px;
  background: var(--accent, #C4956A);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 1s cubic-bezier(0.16,1,0.3,1);
}
.section-line.is-visible { transform: scaleX(1); }

/* ── 히어로 진입 ── */
@keyframes heroFadeUp {
  from { opacity:0; transform:translateY(28px); }
  to   { opacity:1; transform:none; }
}
@keyframes heroFadeIn {
  from { opacity:0; }
  to   { opacity:1; }
}
@keyframes heroBgScale {
  from { transform:scale(1.08); }
  to   { transform:scale(1.0); }
}
@keyframes heroLineGrow {
  from { width:0; }
  to   { width:100%; }
}

/* ── 히어로 텍스트 시퀀스 ── */
.hero-kicker  { opacity:0; animation:heroFadeUp .8s cubic-bezier(0.16,1,0.3,1) .3s forwards; }
.hero-title   { opacity:0; animation:heroFadeUp .9s cubic-bezier(0.16,1,0.3,1) .5s forwards; }
.hero-slogan  { opacity:0; animation:heroFadeUp .8s cubic-bezier(0.16,1,0.3,1) .75s forwards; }
.hero-divider { opacity:0; animation:heroFadeIn .6s ease 1s forwards; }
.hero-sub     { opacity:0; animation:heroFadeUp .8s cubic-bezier(0.16,1,0.3,1) .95s forwards; }
.hero-cta     { opacity:0; animation:heroFadeUp .8s cubic-bezier(0.16,1,0.3,1) 1.2s forwards; }

/* ── 히어로 배경 ── */
.hero-bg-img {
  animation: heroBgScale 1.8s cubic-bezier(0.16,1,0.3,1) forwards;
}

/* ── 플로팅 뱃지 (히어로) ── */
@keyframes badgeIn {
  from { opacity:0; transform:translateX(-20px); }
  to   { opacity:1; transform:none; }
}
.hero-badge { opacity:0; animation:badgeIn .8s cubic-bezier(0.16,1,0.3,1) 1.8s forwards; }

/* ── 섹션 진입 pulse (신뢰 아이템) ── */
@keyframes trustIn {
  from { opacity:0; transform:translateY(20px); }
  to   { opacity:1; transform:none; }
}

/* ── 카드 호버 (특징 그리드) ── */
.feature-card-hover {
  transition: background .3s ease, box-shadow .3s ease, transform .3s cubic-bezier(0.16,1,0.3,1);
}
.feature-card-hover:hover {
  background: #fff;
  box-shadow: 0 8px 32px rgba(26,10,8,0.06);
  transform: translateY(-2px);
}

/* ── 서비스 카드 이미지 호버 ── */
.svc-img-wrap {
  overflow: hidden;
  border-radius: 0;
}
.svc-img-wrap img {
  transition: transform 0.7s cubic-bezier(0.16,1,0.3,1);
  width:100%; height:100%; object-fit:cover; display:block;
}
.svc-img-wrap:hover img { transform: scale(1.05); }

/* ── 버튼 호버 ── */
.btn-hover-lift {
  transition: transform .25s cubic-bezier(0.16,1,0.3,1),
              box-shadow .25s ease,
              background .3s ease;
}
.btn-hover-lift:hover { transform: translateY(-3px); }

/* ── FAQ 아코디언 ── */
.faq-answer {
  overflow: hidden;
  max-height: 0;
  transition: max-height .45s cubic-bezier(0.16,1,0.3,1),
              padding   .35s ease;
}
.faq-answer.open { max-height: 500px; }
.faq-icon {
  transition: transform .35s cubic-bezier(0.16,1,0.3,1);
}
.faq-item.open .faq-icon { transform: rotate(45deg); }

/* ── 줄 구분선 성장 ── */
@keyframes lineGrow {
  from { transform:scaleX(0); }
  to   { transform:scaleX(1); }
}

/* ── 스크롤 진행 바 (top) ── */
.scroll-progress {
  position: fixed;
  top: 0; left: 0;
  height: 2px;
  background: var(--accent, #C4956A);
  z-index: 999;
  transform-origin: left;
  transform: scaleX(0);
  transition: none;
}

/* ── 감소 모션 ── */
@media (prefers-reduced-motion: reduce) {
  [data-anim], .split-text .char,
  .hero-kicker, .hero-title, .hero-slogan,
  .hero-divider, .hero-sub, .hero-cta,
  .hero-badge, .hero-bg-img {
    opacity:1 !important;
    transform:none !important;
    clip-path:none !important;
    animation:none !important;
    transition:none !important;
  }
}
