/* ============================================================
   예약문의 강화 (검수요청 공통3 / C2)
   - 홈 히어로 중앙 예약 CTA (.hero-book-cta)
   - 우측 플로팅 / 모바일 하단바 예약(Book) 강조 (.quick li.is-book-cta)
   - 헤더 BOOK + 플로팅 Book 펄스
   booking-cta.js 가 DOM 삽입/클래스 부여, 디자인은 여기서.
   브랜드: 차콜 #393939 / 액센트 토프 #aa8e7d
   ============================================================ */

/* ─────────────────────────────────────────────────────────
   (a) 홈 히어로 중앙 예약 CTA
   .ment .in 의 마지막 자식으로 삽입. 히어로 텍스트(흰색) 아래.
   ───────────────────────────────────────────────────────── */
.hero-book-cta {
  margin-top: 32px;
  opacity: 0;
  transform: translateY(12px);
  animation: hero-book-in 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.9s forwards;
}

.hero-book-cta__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 56px;
  padding: 0 34px;
  background: #aa8e7d;
  color: #ffffff !important;
  font-family: 'Pretendard Variable', sans-serif;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-decoration: none;
  border-radius: 999px;
  border: 1px solid #aa8e7d;
  box-shadow: 0 10px 28px -10px rgba(58, 47, 38, 0.55);
  transition: background-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
  /* 펄스 — 시선 유도. reduced-motion 에서 비활성. */
  animation: book-pulse 2.6s ease-in-out 1.6s infinite;
}

.hero-book-cta__btn:hover,
.hero-book-cta__btn:focus-visible {
  background: #967765;
  border-color: #967765;
  transform: translateY(-2px);
  box-shadow: 0 14px 34px -10px rgba(58, 47, 38, 0.6);
  animation-play-state: paused;
}

.hero-book-cta__arrow {
  font-size: 16px;
  line-height: 1;
  display: inline-block;
  transition: transform 0.3s ease;
}

.hero-book-cta__btn:hover .hero-book-cta__arrow {
  transform: translateX(4px);
}

@keyframes hero-book-in {
  to { opacity: 1; transform: translateY(0); }
}

/* 펄스 키프레임 — 토프 글로우 링이 한 번씩 번짐 ("BOOK 반짝임"). */
@keyframes book-pulse {
  0%   { box-shadow: 0 10px 28px -10px rgba(58, 47, 38, 0.55), 0 0 0 0 rgba(170, 142, 125, 0.55); }
  60%  { box-shadow: 0 10px 28px -10px rgba(58, 47, 38, 0.55), 0 0 0 14px rgba(170, 142, 125, 0); }
  100% { box-shadow: 0 10px 28px -10px rgba(58, 47, 38, 0.55), 0 0 0 0 rgba(170, 142, 125, 0); }
}

/* 모바일 히어로 — 버튼 약간 축소 + full-bleed 정렬 보정 */
@media (max-width: 1200px) {
  .hero-book-cta {
    margin-top: 24px;
  }
  .hero-book-cta__btn {
    height: 52px;
    padding: 0 28px;
    font-size: 15px;
  }
}

/* ─────────────────────────────────────────────────────────
   (b) 헤더 BOOK CTA 펄스
   header-actions.js 가 만든 .header-reserve-cta 에 은은한 펄스 부여.
   (디자인 본체는 header-polish.css)
   ───────────────────────────────────────────────────────── */
.header-reserve-cta {
  animation: header-book-pulse 2.8s ease-in-out 2s infinite;
}
.header-reserve-cta:hover {
  animation-play-state: paused;
}

@keyframes header-book-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(170, 142, 125, 0.5); }
  55%  { box-shadow: 0 0 0 10px rgba(170, 142, 125, 0); }
  100% { box-shadow: 0 0 0 0 rgba(170, 142, 125, 0); }
}

/* ─────────────────────────────────────────────────────────
   (c) 우측 플로팅 예약(Book) 강조 — LINE/WhatsApp 보다 우선·돋보이게
   default.css `.quick li` (흰 배경 65px) 를 토프 필로 override.
   ───────────────────────────────────────────────────────── */
.quick.rightQuick li.is-book-cta {
  border-color: #aa8e7d !important;
}
.quick.rightQuick li.is-book-cta > a {
  background: #aa8e7d !important;
  position: relative;
}
.quick.rightQuick li.is-book-cta > a p,
.quick.rightQuick li.is-book-cta > a p span {
  color: #ffffff !important;
  font-weight: 600 !important;
}
/* 아이콘(있으면) 흰색 대비 — 어두운 png 면 약하게 반전 */
.quick.rightQuick li.is-book-cta > a img {
  filter: brightness(0) invert(1);
}

/* 데스크톱 플로팅: Book 항목에만 펄스 글로우 링 */
@media (min-width: 1201px) {
  .quick.pc.rightQuick li.is-book-cta {
    animation: float-book-pulse 2.8s ease-in-out 2.4s infinite;
  }
}

@keyframes float-book-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(170, 142, 125, 0.5); }
  55%  { box-shadow: 0 0 0 9px rgba(170, 142, 125, 0); }
  100% { box-shadow: 0 0 0 0 rgba(170, 142, 125, 0); }
}

/* ─────────────────────────────────────────────────────────
   모바일 하단 고정 CTA바 — .quick.mobile.rightQuick 가 이미 하단바로
   변환됨(layout.css + mobile-polish.css). 그 안의 Book 항목을 토프 필로
   강조해 LINE/WhatsApp/TOP 보다 먼저 눈에 들어오게.
   ───────────────────────────────────────────────────────── */
@media (max-width: 1200px) {
  .quick.mobile.rightQuick li.is-book-cta > a {
    background: #aa8e7d !important;
  }
  .quick.mobile.rightQuick li.is-book-cta > a p,
  .quick.mobile.rightQuick li.is-book-cta > a p span {
    color: #ffffff !important;
    font-weight: 600 !important;
  }
  .quick.mobile.rightQuick li.is-book-cta > a img {
    filter: brightness(0) invert(1);
  }
}

/* ─────────────────────────────────────────────────────────
   접근성: 모션 최소화 선호 시 모든 펄스/등장 애니메이션 비활성.
   ───────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .hero-book-cta { opacity: 1; transform: none; animation: none; }
  .hero-book-cta__btn,
  .header-reserve-cta,
  .quick.pc.rightQuick li.is-book-cta {
    animation: none !important;
  }
}
