/* Custom styles for index.html - 메인 페이지 전용 스타일 */

/* 배경 이미지 밝기 조정 - 더 밝게 */
.hero-background {
  filter: brightness(0.65) !important; /* 기존 0.4에서 0.65로 증가 */
}

/* 오버레이 투명도 조정 - 덜 어둡게 */
.hero-overlay {
  background: linear-gradient(to bottom, rgba(10, 10, 10, 0.1), rgba(10, 10, 10, 0.4)) !important;
}

/* 버튼 그룹 위치 조정 - 왼쪽 하단으로 이동 */
.hero-content {
  position: absolute;
  bottom: 8%; /* 화면 하단에서 8% 위치 */
  left: 5%; /* 왼쪽에서 5% 위치 */
  transform: none;
  width: auto;
  max-width: none;
  padding: 0;
}

/* 버튼 크기 조정 - 더욱 작고 세련되게 */
.hero-content .btn {
  padding: 0.65rem 1.5rem; /* 더 작게 축소 */
  font-size: 0.9rem; /* 폰트 크기 축소 */
  min-width: 140px; /* 최소 너비 축소 */
  letter-spacing: 1px;
}

/* 버튼 그룹 간격 조정 */
.hero-content .btn-group {
  gap: 0.8rem;
  justify-content: flex-start; /* 왼쪽 정렬 */
  flex-wrap: wrap;
}

/* 모바일 반응형 */
@media (max-width: 768px) {
  .hero-content {
    bottom: 6%;
    left: 4%;
  }
  
  .hero-content .btn {
    padding: 0.6rem 1.3rem;
    font-size: 0.85rem;
    min-width: 120px;
  }
  
  .hero-content .btn-group {
    gap: 0.7rem;
  }
}

@media (max-width: 480px) {
  .hero-content {
    bottom: 5%;
    left: 3%;
  }
  
  .hero-content .btn {
    padding: 0.55rem 1.2rem;
    font-size: 0.8rem;
    min-width: 110px;
  }
  
  .hero-content .btn-group {
    flex-direction: row; /* 모바일에서도 가로 배치 유지 */
    gap: 0.6rem;
  }
}
