/*
 * This is a manifest file that'll be compiled into application.css.
 */

/* 폰트 설정: 영어는 Google Sans, 한국어는 Noto Sans KR */
html {
  font-size: 18px;
  font-family: "Google Sans", "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-optical-sizing: auto;
}

body {
  font-family: "Google Sans", "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-optical-sizing: auto;
}

/* 모바일에서는 약간 작게 */
@media (max-width: 768px) {
  html {
    font-size: 17px;
  }
}

/* 하단 네비게이션 텍스트는 고정 크기 유지 */
.text-\[10px\] {
  font-size: 10px !important;
}

/* ===== 랜딩 페이지 애니메이션 ===== */

/* 페이드 인 업 애니메이션 */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 페이드 인 애니메이션 */
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* 부드러운 떠다니는 효과 */
@keyframes float {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-8px);
  }
}

/* 부드러운 펄스 효과 */
@keyframes softPulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.8;
  }
}

/* 애니메이션 클래스들 */
.animate-fade-in-up {
  animation: fadeInUp 0.6s ease-out forwards;
  opacity: 0;
}

.animate-fade-in {
  animation: fadeIn 0.6s ease-out forwards;
  opacity: 0;
}

.animate-float {
  animation: float 4s ease-in-out infinite;
}

.animate-soft-pulse {
  animation: softPulse 3s ease-in-out infinite;
}

/* 애니메이션 지연 시간 */
.delay-100 { animation-delay: 0.1s; }
.delay-200 { animation-delay: 0.2s; }
.delay-300 { animation-delay: 0.3s; }
.delay-400 { animation-delay: 0.4s; }
.delay-500 { animation-delay: 0.5s; }
.delay-600 { animation-delay: 0.6s; }
.delay-700 { animation-delay: 0.7s; }

/* 카드 호버 효과 */
.card-hover {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card-hover:hover {
  transform: translateY(-4px);
}

/* 버튼 호버 효과 */
.btn-hover {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.btn-hover:hover {
  transform: translateY(-2px);
}

/* 헤더 네비게이션 링크 */
.nav-link {
  -webkit-tap-highlight-color: transparent;
  outline: none;
  color: #254178;
}

.nav-link:hover {
  color: #93D152;
  background-color: rgba(37, 65, 120, 0.05);
}

.nav-link:visited {
  color: #254178;
}

.nav-link:visited:hover {
  color: #93D152;
}

/* ===== 카운터 애니메이션 ===== */

/* 카운터 숫자 스타일 */
.counter-number {
  display: inline-block;
  min-width: 60px;
  text-align: center;
  transition: transform 0.1s ease;
}

/* 카운터 완료 시 펄스 효과 */
.counter-complete {
  animation: counterPulse 0.5s ease-out;
}

@keyframes counterPulse {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.15);
  }
  100% {
    transform: scale(1);
  }
}

/* 하트 펄스 애니메이션 */
@keyframes heartPulse {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.2);
  }
}

.animate-pulse-heart {
  display: inline-block;
  animation: heartPulse 1.5s ease-in-out infinite;
}

/* 카운터 배너 그라디언트 시머 효과 */
@keyframes shimmer {
  0% {
    background-position: -200% center;
  }
  100% {
    background-position: 200% center;
  }
}