/* ====================================================
   PLEO MAIN CSS (Red Edition, Clean Version)
   ==================================================== */

/* ---------------------- 기본 설정 ---------------------- */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap');

:root {
  --pleo-red: #7A0E13;
  --pleo-red-light: #9B1B21;
  --pleo-bg-light: #F9F4F4;
  --pleo-text-dark: #212529;
  --pleo-gray: #6C757D;
}

body {
  font-family: 'Noto Sans KR', sans-serif;
  color: var(--pleo-text-dark);
  background-color: #fff;
  line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 600;
  color: var(--pleo-text-dark);
}

/* ---------------------- 네비게이션 ---------------------- */
.navbar {
  background-color: #fff !important;
  border-bottom: 1px solid #eee;
  box-shadow: 0 2px 6px rgba(0,0,0,0.04);
  transition: none !important;
}

.navbar-brand img { height: 36px; object-fit: contain; }

.navbar-brand .brand-text {
  color: var(--pleo-red) !important;
  transition: color 0.3s ease;
  font-weight: 700;
}
.navbar-brand:hover .brand-text { color: var(--pleo-red-light) !important; }

.nav-link {
  color: var(--pleo-gray) !important;
  font-weight: 500;
  transition: color 0.2s ease;
}
.nav-link:hover { color: var(--pleo-red) !important; }

/* ---------------------- 버튼 ---------------------- */
.btn-primary {
  background-color: var(--pleo-red) !important;
  border-color: var(--pleo-red) !important;
  font-weight: 500;
}
.btn-primary:hover {
  background-color: var(--pleo-red-light) !important;
  border-color: var(--pleo-red-light) !important;
}

/* 카카오 문의 버튼 */
.btn-kakao {
  background-color: #FEE500 !important;
  color: #3C1E1E !important;
  font-weight: 700;
  border: none !important;
  border-radius: 8px;
  width: 100%;
  transition: all 0.25s ease;
}
.btn-kakao:hover {
  background-color: #fdd835 !important;
  color: #000 !important;
  transform: translateY(-2px);
}
.btn-kakao img {
  height: 22px; width: 22px; object-fit: contain;
  vertical-align: middle;
}

/* 비활성 버튼 (전화, 이메일) */
.btn.btn-secondary[disabled],
.btn.btn-outline-secondary[disabled] {
  background-color: #ffffff !important;
  color: #000000 !important;
  border: 1px solid #ccc !important;
  opacity: 1 !important;
  cursor: default !important;
}

/* ---------------------- 카드 ---------------------- */
.card {
  border: 1px solid #eee;
  border-radius: 1rem;
  background: #fff;
  transition: all 0.25s ease;
}
.card:hover {
  transform: translateY(-6px);
  box-shadow: 0 0.75rem 1.25rem rgba(0,0,0,0.1);
}
.card-title {
  color: var(--pleo-red) !important;
  font-weight: 700;
}

/* ---------------------- 링크 ---------------------- */
a {
  color: var(--pleo-red);
  text-decoration: none;
}
a:hover {
  color: var(--pleo-red-light);
  text-decoration: underline;
}

/* ---------------------- 폼 ---------------------- */
.form-control {
  border-color: #ddd;
  color: #222;
}
.form-control:focus {
  border-color: var(--pleo-red);
  box-shadow: 0 0 0 0.2rem rgba(122,14,19,0.15);
}

/* ---------------------- 섹션 ---------------------- */
section { padding-top: 5rem; padding-bottom: 5rem; }
.bg-light { background-color: var(--pleo-bg-light) !important; }

/* ---------------------- 푸터 ---------------------- */
footer {
  background-color: var(--pleo-red);
  color: #fff;
  padding-top: 3rem;
  padding-bottom: 2rem;
}
footer a { color: #fff; text-decoration: underline; }
footer a:hover { color: var(--pleo-bg-light); }

/* ---------------------- 반응형 ---------------------- */
@media (max-width: 992px) {
  .navbar-nav { text-align: center; padding-top: 1rem; }
}
@media (max-width: 768px) {
  h1.display-5 { font-size: 1.75rem; }
  section { padding-top: 3rem; padding-bottom: 3rem; }
}

/* ---------------------- 기타 ---------------------- */
.navbar.sticky-top { top: 0; transition: none !important; }
button[type="submit"]:disabled { opacity: 0.75; }
.badge.text-bg-primary { background-color: var(--pleo-red) !important; }

h1.text-white { text-shadow: 0 2px 6px rgba(0,0,0,0.4); }
