/* =========================================================
   Cricri Beauty - booking.css (ROLLBACK + NAV FIX)
   - service.css 스타일과 동일한 NAV/LANG 동작
   - 모바일 메뉴 잘림(오시는 길/갤러리) 해결
   - 가독성(여백/줄간격/중앙정렬) 개선
========================================================= */

:root{
  --bg1:#FBF7F5;
  --bg2:#F5E9ED;
  --card: rgba(255,255,255,.78);
  --border: rgba(0,0,0,.06);
  --text:#111;
  --muted:#666;
  --rose2:#ff6fa3;
  --shadow: 0 10px 30px rgba(0,0,0,.08);
  --radius:18px;
}

*{ margin:0; padding:0; box-sizing:border-box; }

html{ scroll-behavior:smooth; }

body{
  font-family:'Noto Sans KR',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  background: linear-gradient(180deg,var(--bg1),var(--bg2));
  color:#333;
  line-height:1.8;
  overflow-x:hidden;
}

/* ================= NAV (service.css style) ================= */
.nav{
  position: sticky;
  top:0;
  z-index:1100;
  background: rgba(255,255,255,.80);
  border-bottom:1px solid var(--border);
  backdrop-filter: blur(12px);
  padding: 44px 16px 12px;  /* 🔥 위 공간 확보 */
}

.nav-inner{
  max-width:980px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative; /* lang absolute 기준 */
}

.menu{
  list-style:none;
  display:flex;
  gap:14px;
  justify-content:center;
  flex-wrap: nowrap;          /* 🔥 줄바꿈 금지 */
  overflow-x: auto;           /* 🔥 공간 부족하면 스크롤 */
  scrollbar-width: none;
}

.menu::-webkit-scrollbar{
  display:none;
}

.menu a{
  text-decoration:none;
  font-weight:800;
  font-size:14px;
  color:#222;
  padding:10px 12px;
  border-radius:999px;
  transition:.2s;
  white-space:nowrap; /* ✅ 단어 깨짐 방지 */
}

.menu a:hover{ background: rgba(255,111,163,.08); }

.menu a[aria-current="page"]{
  color:var(--rose2);
  background: rgba(255,111,163,.12);
}

/* lang (PC: nav 안 오른쪽) */
.lang-switcher{
  position: fixed;
  top: 10px;
  right: 12px;
  z-index: 2000;

  font-size: 12px;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.90);
  border: 1px solid rgba(0,0,0,.06);
  backdrop-filter: blur(10px);
  white-space: nowrap;
}
.lang-switcher a{
  text-decoration:none;
  color:#444;
  margin:0 4px;
  font-weight:700;
}

.lang-switcher a:hover{ text-decoration:underline; }

/* ================= PAGE WRAP ================= */
.page{
  max-width:980px;
  margin:24px auto 60px;
  padding:0 20px;
}

/* HERO */
.hero-card{
  background: var(--card);
  border:1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding:28px 22px;
  text-align:center; /* ✅ 가운데 정렬 */
}

.hero-title{
  font-size:28px;
  color:#111;
  margin-bottom:10px;
  letter-spacing:.2px;
}

.hero-desc{
  color: var(--muted);
  font-size:15px;
  max-width:680px;
  margin:0 auto;
  line-height:1.85;
}

/* Agree card */
.check-confirm{
  margin:18px 0;
}

.check-card{
  background: var(--card);
  border:1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding:16px 16px;
  display:flex;
  align-items:center;
  gap:12px;
  justify-content:center;
}

.check-card input[type="checkbox"]{
  width:20px;
  height:20px;
  accent-color: var(--rose2);
}

.check-card label{
  font-weight:900;
  color:#222;
  font-size:15px;
}

/* Section cards */
.section{
  background: var(--card);
  border:1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding:28px 22px;
  margin:18px 0;
  text-align:center; /* ✅ 섹션 제목/설명 중앙 */
}

.section h2{
  color:#111;
  font-size:20px;
  margin-bottom:14px;
}

.section .hint{
  color:var(--muted);
  font-size:13px;
  margin-top:-6px;
  margin-bottom:14px;
  line-height:1.7;
}

/* 안내사항 리스트는 읽기 편하게 좌측 정렬 */
.section ul{
  list-style:none;
  padding:0;
  margin:14px auto 0;
  max-width:680px;
  text-align:left;
}

.section ul li{
  font-size:15px;
  color:#333;
  margin:10px 0;
  line-height:1.85;
  position:relative;
  padding-left:18px;
}

.section ul li::before{
  content:"•";
  position:absolute;
  left:0;
  top:0;
  color: rgba(255,111,163,.95);
  font-weight:900;
}

/* Buttons */
.btn-wrap{
  display:flex;
  flex-direction:column;
  gap:14px;
  margin:18px 0 6px;
}

.btn{
  display:block;
  text-align:center;
  padding:16px 16px;
  border-radius:999px;
  font-weight:900;
  text-decoration:none;
  font-size:16px;

  opacity:.45;
  pointer-events:none;
  transition: transform .18s ease, opacity .18s ease, box-shadow .18s ease;
}

.btn.active{
  opacity:1;
  pointer-events:auto;
}

.btn:active{ transform:scale(.98); }

.btn.naver{
  background:#7DE3AF;
  color:#0b2a1a;
  box-shadow: 0 10px 24px rgba(125,227,175,.35);
}

.btn.kakao{
  background:#FFE87A;
  color:#3a2c00;
  box-shadow: 0 10px 24px rgba(255,232,122,.35);
}

.info-box{
  text-align: center;
}

.info-box p{
  text-align: center;
}
.footer{
  text-align: center;
}

.footer-title,
.footer-info,
.footer-copy{
  text-align: center;
}

/* Calendar */
iframe{
  width:100%;
  height:420px;
  border:none;
  border-radius:14px;
  background:#fff;
  box-shadow: 0 8px 22px rgba(0,0,0,.06);
}

/* Info box (고정 X, 카드로 통일)

@media (max-width:768px){
  .menu a{
    font-size:13px;
    padding:8px 8px;
  }
}