/* PO:VE 상담 채널 버튼 — 카카오톡 · 네이버 · 전화.
   메인 예약 섹션과 각 페이지 맨 아래 예약 안내가 같은 모양을 씁니다.
   메인(index.html)은 같은 규칙을 페이지 안에 갖고 있어 이 파일이 없어도 됩니다.
   링크는 pove-fab.js 의 LINKS 한 곳에서 관리하며, 누르는 순간 최신 주소로 맞춰집니다. */
/* ── 예약 섹션 상담 채널 버튼(카카오톡·네이버·전화) ──
   PC는 3열 카드, 820px 이하에서는 한 줄씩 쌓이는 가로형 버튼입니다. 아이콘은 pove-fab.js 와 같은 공식 도형입니다. */
.pvresv-ch{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;max-width:880px;margin:0 auto;text-align:left}
.pvresv-btn{position:relative;display:grid;grid-template-columns:1fr auto;grid-template-areas:"ico arr" "txt txt";row-gap:38px;padding:28px 26px 26px;background:rgba(240,235,214,.06);border:1px solid rgba(240,235,214,.2);border-radius:4px;color:#f0ebd6;text-decoration:none;transition:transform .45s cubic-bezier(.2,.7,.2,1),background-color .35s,border-color .35s,box-shadow .45s}
.pvresv-btn,.pvresv-btn:hover{opacity:1}
.pvresv-ico{grid-area:ico;display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;box-shadow:0 10px 22px -14px rgba(0,0,0,.6)}
.pvresv-ico svg{display:block}
.pvresv-ico--kakao{background:#FEE500}
.pvresv-ico--kakao svg{width:23px;height:22px;margin-top:2px}
.pvresv-ico--naver{background:linear-gradient(180deg,#0BE068 0%,#03C75A 100%)}
.pvresv-ico--naver svg{width:22px;height:22px}
.pvresv-ico--tel{background:#c9d19a}
.pvresv-ico--tel svg{width:22px;height:22px}
.pvresv-arr{grid-area:arr;align-self:start;font-size:20px;line-height:1;color:rgba(240,235,214,.45);transition:transform .45s cubic-bezier(.2,.7,.2,1),color .35s}
.pvresv-txt{grid-area:txt;align-self:end;min-width:0}
.pvresv-e{display:block;margin-bottom:9px;font-size:12px;font-weight:500;line-height:1;letter-spacing:.3em;text-transform:uppercase;color:#c9d19a}
.pvresv-t{display:block;font-size:17px;font-weight:600;line-height:1.35;letter-spacing:-.01em}
.pvresv-s{display:block;margin-top:6px;font-size:13px;line-height:1.6;letter-spacing:.01em;color:rgba(240,235,214,.58)}
@media(hover:hover){
  .pvresv-btn:hover{background:rgba(240,235,214,.09);border-color:rgba(201,209,154,.55);transform:translateY(-3px);box-shadow:0 24px 42px -28px rgba(0,0,0,.7)}
  .pvresv-btn:hover .pvresv-arr{transform:translateX(4px);color:#c9d19a}
}
@media(max-width:820px){
  .pvresv-ch{grid-template-columns:1fr;gap:12px}
  .pvresv-btn{grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"ico txt arr";align-items:center;column-gap:16px;row-gap:0;padding:18px 20px}
  .pvresv-ico{width:44px;height:44px}
  .pvresv-ico--naver svg{width:20px;height:20px}
  .pvresv-arr,.pvresv-txt{align-self:center}
  .pvresv-e{display:none}
  .pvresv-t{font-size:16px}
  .pvresv-s{margin-top:3px;font-size:12.5px}
}
@media(prefers-reduced-motion:reduce){.pvresv-btn,.pvresv-arr{transition:none}}

/* ── 언어별 채널 아이콘 ──
   외국어 페이지에서는 그 언어권에서 쓰는 메신저를 씁니다(scripts/lib/channels.mjs).
   도형과 색은 각 브랜드 공식 가이드를 따릅니다. */
.pvresv-ico--wechat{background:#07C160}
.pvresv-ico--wechat svg{width:24px;height:24px}
.pvresv-ico--instagram{background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%)}
.pvresv-ico--instagram svg{width:23px;height:23px}
@media(max-width:820px){
  .pvresv-ico--wechat svg{width:22px;height:22px}
  .pvresv-ico--instagram svg{width:21px;height:21px}
}
/* 버튼 개수에 맞춰 칸을 나눕니다(기본 3칸, 네 개면 네 칸, 두 개면 두 칸). */
@media(min-width:821px){
  .pvresv-ch:has(> a:nth-child(4)){grid-template-columns:repeat(4,minmax(0,1fr));max-width:1120px}
  .pvresv-ch:has(> a:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
}