/**
 * buttons.base.css — .btn 계열 공통 (랜딩·어드민 등)
 *
 * 로드 순서: root.css → ui-classes.css → common-layout.base.css → common-layout.pc.css → 본 파일 → 페이지 전용 CSS
 */

/* ----- 기본 버튼 (랜딩 index.base 에서 분리) ----- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 28px;
  min-height: 48px;
  font-family: var(--font);
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  border-radius: 24px;
  border: none;
  cursor: pointer;
  transition: transform 0.15s, box-shadow 0.2s;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  backdrop-filter: blur(var(--glass-backdrop-blur));
  -webkit-backdrop-filter: blur(var(--glass-backdrop-blur));
}
.btn:hover {
  transform: translateY(-1px);
  box-shadow: var(--glass-shadow-outer);
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .btn {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}
.btn-primary {
  background: linear-gradient(180deg, #fff39a 0%, var(--kakao-yellow) 48%, #f3c400 100%);
  background: var(--cta-primary-fill);
  color: var(--kakao-black);
  box-shadow: var(--cta-glass-inset), var(--cta-glass-glow);
}
.btn-primary:hover {
  box-shadow: var(--cta-glass-inset), var(--cta-glass-glow-hover);
}
/* 히어로(어두운 배경)용 — 밝은 카드 위에서는 아래 lead 폼 성공 규칙이 덮음 */
.btn-outline {
  background: rgba(255, 255, 255, 0.14);
  color: var(--white);
  border: 2px solid rgba(255, 255, 255, 0.86);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 6px 28px rgba(31, 42, 68, 0.2);
}
.btn-outline:hover {
  background: rgba(255, 255, 255, 0.22);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.28) inset, 0 8px 32px rgba(31, 42, 68, 0.18);
}
.btn-kakao {
  background: linear-gradient(180deg, #fff39a 0%, var(--kakao-yellow) 48%, #f3c400 100%);
  background: var(--cta-primary-fill);
  color: var(--kakao-black);
  box-shadow: var(--cta-glass-inset), var(--cta-glass-glow);
}
.btn-kakao:hover {
  box-shadow: var(--cta-glass-inset), var(--cta-glass-glow-hover);
}

/* Lead 폼 성공「다시 신청하기」— 랜딩·어드민 가입 모달 공통 */
.lead-form .form-success .btn-lead-reset {
  margin-top: 20px;
  min-width: 200px;
}
.lead-form .form-success .btn-outline.btn-lead-reset {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: 12px 24px;
  min-height: 48px;
  font-family: var(--font);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.25;
  text-decoration: none;
  border-radius: 12px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  transition: background-color 0.15s, border-color 0.15s, color 0.15s, box-shadow 0.2s, transform 0.15s;
  color: var(--navy);
  border: 2px solid var(--glass-border);
  background: var(--glass-surface);
  backdrop-filter: blur(var(--glass-backdrop-blur));
  -webkit-backdrop-filter: blur(var(--glass-backdrop-blur));
  box-shadow: var(--glass-shadow-inset), var(--glass-shadow-outer);
}
.lead-form .form-success .btn-outline.btn-lead-reset:hover {
  background: var(--glass-surface-hover);
  border-color: var(--navy);
  color: var(--navy);
  box-shadow: var(--glass-shadow-inset), 0 4px 16px rgba(31, 42, 68, 0.1);
  transform: translateY(-1px);
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .lead-form .form-success .btn-outline.btn-lead-reset {
    background: var(--white);
  }
  .lead-form .form-success .btn-outline.btn-lead-reset:hover {
    background: rgba(31, 42, 68, 0.06);
  }
}
.lead-form .form-success .btn-outline.btn-lead-reset:focus-visible {
  outline: 2px solid var(--yellow);
  outline-offset: 3px;
}