body { box-sizing: border-box; }
* { font-family: 'Noto Sans KR', sans-serif; }

html {
  scroll-behavior: smooth;
}

/* Primary brand gradient used on logo, buttons, step circles */
.gradient-bg {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%);
}

/* Glass card style: translucent white on the dark background */
.glass-card {
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.3);
}

/* Coin-style icon background (gold gradient) */
.coin-gradient {
  background: linear-gradient(145deg, #ffd700 0%, #ffaa00 50%, #ff8c00 100%);
}

/* Floating hero badge */
.float-animation {
  animation: float 3s ease-in-out infinite;
}
@keyframes float {
  0%, 100% { transform: translateY(0px); }
  50%      { transform: translateY(-10px); }
}

/* Pulsing glow around the hero badge */
.pulse-glow {
  animation: pulseGlow 2s ease-in-out infinite;
}
@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 20px rgba(102, 126, 234, 0.4); }
  50%      { box-shadow: 0 0 40px rgba(102, 126, 234, 0.8); }
}

/* Lift step / benefit cards on hover */
.step-card {
  transition: all 0.3s ease;
}
.step-card:hover {
  transform: translateY(-5px);
}

/* Section reveal */
.fade-in {
  animation: fadeIn 0.8s ease-out forwards;
}
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Purple gradient icon plate */
.benefit-icon {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

/* Hero subtitle cross-fade (matches original) */
.animate-fade-cycle-1 { animation: fade-1 20s infinite; }
.animate-fade-cycle-2 { animation: fade-2 20s infinite; }

@keyframes fade-1 {
  0%, 45%   { opacity: 1; visibility: visible; }
  50%, 95%  { opacity: 0; visibility: hidden; }
  100%      { opacity: 1; visibility: visible; }
}
@keyframes fade-2 {
  0%, 45%   { opacity: 0; visibility: hidden; }
  50%, 95%  { opacity: 1; visibility: visible; }
  100%      { opacity: 0; visibility: hidden; }
}

/* Anchor scroll spacing under the sticky header */
section[id] {
  scroll-margin-top: 70px;
}
