/* 모바일 하단 고정 버튼 - PC에서는 숨김 */
.mobile-bottom-btns {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100vw;
  background: transparent;
  box-shadow: none;
  display: none; /* 기본적으로 숨김 */
  justify-content: space-around;
  padding: 0.2em 0 0.3em 0;
  z-index: 300; 
  /* iOS Safe Area 지원 */
  padding-bottom: calc(0.3em + env(safe-area-inset-bottom)); 
  /* 모바일 브라우저 주소창 변화 대응 */
  transform: translateZ(0);
  will-change: transform;
  opacity: 1;
  visibility: visible;
}

/* 모바일에서만 표시 (768px 이하) */
@media screen and (max-width: 768px) {
  .mobile-bottom-btns {
    display: flex !important; /* 모바일에서만 표시 */
  }
}

/* 모바일 하단 버튼 전용 스타일 */
.mobile-bottom-btns .main-btn,
.mobile-bottom-btns a.main-btn,
.mobile-bottom-btns a[href*="tel"],
.mobile-bottom-btns a[href*="sms"],
.mobile-bottom-btns a[href*="kakao"] {
  flex: 1 !important;
  margin: 0 0.15em !important;
  font-size: 0.8em !important;
  padding: 0.35em 0.6em !important;
  text-align: center !important;
  background: linear-gradient(135deg, #374151 0%, #6b7280 100%) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 24px !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  letter-spacing: 0.3em !important;
  word-spacing: 0.2em !important;
  white-space: pre !important;
  box-shadow: 0 4px 12px rgba(55, 65, 81, 0.3) !important;
}

/* 모바일 하단 버튼 호버 효과 */
.mobile-bottom-btns .main-btn:hover,
.mobile-bottom-btns a.main-btn:hover {
  background: linear-gradient(135deg, #4b5563 0%, #9ca3af 100%) !important;
  transform: translateY(-3px) scale(1.05) !important;
  box-shadow: 0 6px 20px rgba(55, 65, 81, 0.4) !important;
}