/* =====================================================================
   10 상담 · 예약(reservation) — Figma `247:42174`(2026-09 리터치)
   섹션 클래스(.rsv-*) 범위로만 오버라이드 — 아티팩트 번들(페이지 CSS 전역 병합)에서도 다른 페이지로 새지 않게 함
   ===================================================================== */

/* ---------- Hero: Figma desc 1320 폭 한 줄(base max-width 640 해제) ---------- */
.rsv-hero p:not(.eyebrow){max-width:none}

/* ---------- Quick Channels: 물결 사진(Figma CROP 영역을 프레임에 맞춰 늘림 — 1920·768·375 동일) + 블랙 30% · 글래스 채널 버튼 ---------- */
.rsv-channels{position:relative;isolation:isolate;padding:130px 0;background:linear-gradient(rgba(0,0,0,.3),rgba(0,0,0,.3)),#1E1B17 url(../figma/reservation/channels-bg-crop.webp) 0 0/100% 100% no-repeat}
.rsv-channels .sec-head{margin-bottom:80px}
.rsv-channels .sec-head .title{gap:22px}
.rsv-channels .sec-head .title h2,.rsv-channels .sec-head .title h2 em{padding:0;color:#fff}
.rsv-channels .sec-head .title p{font-size:15px;line-height:1.7;color:var(--on-dark-2)}
.rsv-channels .channel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.rsv-channels .channel{display:flex;align-items:center;gap:18px;padding:17px 21px 17px 17px;border-radius:18px;background:rgba(248,246,241,.08);border:1px solid rgba(248,246,241,.03);color:var(--porcelain);box-shadow:none;transition:background .4s var(--ease),border-color .4s var(--ease),transform .4s var(--ease)}
.rsv-channels .channel:hover{background:rgba(248,246,241,.14);border-color:rgba(194,176,147,.4);transform:translateY(-4px);box-shadow:none}
.rsv-channels .channel .ic{flex:none;width:56px;height:56px;border-radius:14px;background:rgba(255,255,255,.11);display:grid;place-items:center;color:var(--porcelain)}
.rsv-channels .channel .ic svg{width:26px;height:26px}
.rsv-channels .channel>div{flex:1;min-width:0}
.rsv-channels .channel b{display:block;font-size:18px;font-weight:500;line-height:1.5;letter-spacing:-.02em;color:var(--porcelain)}
.rsv-channels .channel>div span{display:block;margin-top:4px;font-size:13px;line-height:1.8;letter-spacing:-.01em;color:var(--on-dark-2)}
.rsv-channels .channel .arr{font-size:16px;line-height:1.7;color:var(--beige)}

/* ---------- Online Consultation: 좌 520(카피 · 체크리스트) · 우 704(폼 패딩 64/32) ---------- */
.rsv-consult{padding:110px 0}
.rsv-consult .container{display:grid;grid-template-columns:520fr 704fr;gap:96px;align-items:start}
.rsv-consult .lead{margin-top:22px;font-size:34px;font-weight:400;line-height:1.5;letter-spacing:-.03em;color:var(--text-strong)}
.rsv-consult .desc{margin-top:18px;font-size:16px;line-height:1.7;letter-spacing:-.03em;color:var(--text-mid)}
.rsv-consult .check-list{margin-top:40px}
.rsv-consult .form{display:grid;grid-template-columns:1fr 1fr;gap:32px 36px;padding:64px 32px 0}
.rsv-consult .field label{display:flex;align-items:baseline;gap:6px;margin:0 0 12px;padding-left:4px;font-size:11px;font-weight:500;line-height:1.3;letter-spacing:.2em;text-transform:none;color:var(--text-mid)}
.rsv-consult .field label small{margin:0;font-size:11px;font-weight:500;letter-spacing:.04em;text-transform:none;color:rgba(217,24,24,.7)}
.rsv-consult .field input,.rsv-consult .field select,.rsv-consult .field textarea{display:block;width:100%;height:auto;min-height:0;margin:0;padding:6px 4px 5px;border:0;border-bottom:1px solid var(--hair);border-radius:0;background:transparent;font:inherit;font-size:16px;font-weight:400;line-height:1.7;letter-spacing:-.03em;color:var(--text)}
.rsv-consult .field input::placeholder,.rsv-consult .field textarea::placeholder{color:var(--text-3)}
.rsv-consult .field select,.rsv-consult .field input[type="date"]{color:var(--text-3)}
.rsv-consult .field select.is-set,.rsv-consult .field input[type="date"].is-set,.rsv-consult .field input[type="date"]:focus{color:var(--text)}
.rsv-consult .field select{appearance:none;-webkit-appearance:none;padding-right:28px;cursor:pointer;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3.3 6l4.7 4.7L12.7 6' stroke='%236B6660' stroke-width='1.7'/%3E%3C/svg%3E") right 4px center/16px no-repeat}
.rsv-consult .field input[type="date"]{position:relative;cursor:pointer}
.rsv-consult .field input[type="date"]::-webkit-calendar-picker-indicator{position:absolute;inset:0;width:auto;height:auto;opacity:0;cursor:pointer}
.rsv-consult .field :is(input,select){height:39px}
.rsv-consult .field textarea{min-height:39px;resize:none;field-sizing:content;max-height:240px}
.rsv-consult .field :is(input,select,textarea):focus{outline:none;border-bottom-color:var(--beige)}
/* 동의: 고지 11px → 체크박스 18(화이트 · 헤어라인 · r4) */
.rsv-consult .agree{display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.rsv-consult .agree small{font-size:11px;line-height:1.5;letter-spacing:0;color:var(--text-3)}
.rsv-consult .check{display:flex;align-items:center;gap:10px;font-size:12px;line-height:1.2;letter-spacing:-.01em;color:var(--text-2);cursor:pointer}
.rsv-consult .check input{flex:none;appearance:none;-webkit-appearance:none;width:18px;height:18px;margin:0;border:1px solid var(--hair);border-radius:4px;background:#fff center/12px no-repeat;cursor:pointer;transition:background-color .2s,border-color .2s}
.rsv-consult .check input:checked{background-color:var(--beige);border-color:var(--beige);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M2.5 6.2l2.3 2.3 4.7-5' stroke='%23fff' stroke-width='1.6'/%3E%3C/svg%3E")}
.rsv-consult .check input:focus-visible{outline:2px solid var(--beige);outline-offset:2px}
.rsv-consult .check a{font-weight:500;text-decoration:underline;text-underline-offset:3px}
.rsv-consult .form .submit{grid-column:1/-1;display:flex;justify-content:flex-end;margin-top:16px;padding-top:8px}

/* ---------- 폼 전송 상태 (Figma 상태 시안 없음 → 기존 톤: 베이지 · 브라운 · pill) — consult.js · _wp/inc/consult.php ---------- */
.rsv-consult [hidden]{display:none!important}/* form(grid) · 패널(display 지정)이 hidden 속성을 이기지 않게 */
/* 허니팟: 화면 · 보조기기(aria-hidden) · 탭 이동(tabindex -1)에서 모두 제외 */
.rsv-consult .cf-hp{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.rsv-consult .cf-beacon{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
/* 필드 오류 */
.rsv-consult .cf-err{margin:6px 0 0;padding-left:4px;font-size:12px;line-height:1.5;letter-spacing:-.01em;word-break:keep-all;color:#B42318}
.rsv-consult .agree .cf-err{margin-top:-12px;padding-left:0}
.rsv-consult .field [aria-invalid="true"],.rsv-consult .field [aria-invalid="true"]:focus{border-bottom-color:#B42318}
.rsv-consult .check input[aria-invalid="true"]{border-color:#B42318}
/* 전체 안내(오류 · 미리보기) — aria-live(role=alert) */
.rsv-consult .cf-alert{grid-column:1/-1;margin:0;padding:13px 18px;border-radius:12px;border:1px solid rgba(180,35,24,.18);background:rgba(180,35,24,.05);font-size:14px;line-height:1.6;letter-spacing:-.02em;word-break:keep-all;color:#8A2A1E}
.rsv-consult .cf-alert.is-info{border-color:var(--hair);background:var(--porcelain);color:var(--text-mid)}
.rsv-consult .cf-alert:not([hidden])+.submit{margin-top:0}
/* 제출 중: 화살표 자리에 스피너 · 중복 제출 방지(pointer-events · JS busy) */
.rsv-consult .form .submit .pill.is-loading{pointer-events:none;cursor:progress}
.rsv-consult .form .submit .pill.is-loading svg{display:none}
.rsv-consult .form .submit .pill.is-loading::before{content:"";order:2;width:14px;height:14px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:cf-spin .8s linear infinite}
@keyframes cf-spin{to{transform:rotate(360deg)}}
/* 접수 완료 패널 — 폼 자리(우측 칸 · 태블릿/모바일은 카피 아래) */
.rsv-consult .cf-done{padding:64px 32px 0;scroll-margin-top:calc(var(--header-h) + 24px)}
.rsv-consult .cf-done .ic{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--beige);color:#fff}
.rsv-consult .cf-done .ic svg{width:26px;height:26px}
.rsv-consult .cf-done h3{margin-top:28px;font-size:28px;font-weight:400;line-height:1.5;letter-spacing:-.03em;color:var(--text-strong)}
.rsv-consult .cf-done h3:focus{outline:none}
.rsv-consult .cf-done p{margin-top:14px;font-size:16px;line-height:1.7;letter-spacing:-.03em;color:var(--text-mid)}
.rsv-consult .cf-done .cf-tel{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:36px;padding:22px 28px;border-radius:18px;background:var(--porcelain);border:1px solid var(--hair);transition:border-color .3s var(--ease)}
.rsv-consult .cf-done .cf-tel:hover{border-color:var(--beige)}
.rsv-consult .cf-done .cf-tel small{font-size:12px;font-weight:500;letter-spacing:.2em;color:var(--beige)}
.rsv-consult .cf-done .cf-tel b{font-family:var(--ff-en);font-size:30px;font-weight:500;line-height:1.2;letter-spacing:.01em;font-feature-settings:"lnum" 1;color:var(--brown)}
.rsv-consult .cf-done .cf-again{display:inline-block;margin-top:24px;padding-left:4px;font-size:13px;font-weight:500;color:var(--text-2);text-decoration:underline;text-underline-offset:3px}
/* 개인정보 수집 · 이용 동의 전문 모달 (<dialog> · JS 없으면 :target) */
.rsv-consult .cf-modal{width:min(560px,100% - 32px);max-width:none;max-height:min(720px,100dvh - 48px);margin:auto;padding:0;border:0;border-radius:24px;background:#fff;color:var(--text);box-shadow:0 30px 80px -24px rgba(20,18,15,.45);overflow:hidden}
.rsv-consult .cf-modal::backdrop{background:rgba(20,18,15,.55)}
.rsv-consult .cf-modal[open],.rsv-consult .cf-modal:target{display:flex;flex-direction:column}
.rsv-consult .cf-modal:target:not([open]){position:fixed;inset:0;z-index:1000;box-shadow:0 0 0 100vmax rgba(20,18,15,.55)}
html:has(.rsv-consult .cf-modal[open]){overflow:hidden}
.rsv-consult .cf-modal__box{display:flex;flex-direction:column;min-height:0;max-height:inherit}
.rsv-consult .cf-modal__head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:26px 24px 18px 32px;border-bottom:1px solid var(--hair)}
.rsv-consult .cf-modal__head h3{font-size:20px;font-weight:500;line-height:1.5;letter-spacing:-.03em;color:var(--text-strong)}
.rsv-consult .cf-modal__x{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:50%;color:var(--text-mid);transition:background .3s var(--ease)}
.rsv-consult .cf-modal__x:hover{background:var(--bone)}
.rsv-consult .cf-modal__x svg{width:22px;height:22px}
.rsv-consult .cf-modal__body{flex:1;min-height:0;overflow:auto;padding:22px 32px 8px;font-size:14px;line-height:1.75;letter-spacing:-.02em;word-break:keep-all;color:var(--text-mid)}
.rsv-consult .cf-modal__body dl{margin:18px 0 0;border-top:2px solid var(--beige)}
.rsv-consult .cf-modal__body dt{padding-top:14px;font-size:13px;font-weight:500;color:var(--text-strong)}
.rsv-consult .cf-modal__body dd{margin:4px 0 0;padding-bottom:14px;border-bottom:1px solid var(--hair)}
.rsv-consult .cf-modal__body .note{margin-top:14px;font-size:12.5px;color:var(--text-3)}
.rsv-consult .cf-modal__foot{display:flex;justify-content:flex-end;gap:10px;padding:18px 32px 26px}

/* ---------- Visit Info: 사진(Figma CROP · 모바일은 크롭 영역이 달라 visit-bg-mo) + 틴트 #242013 40% + 하단 블랙 그라데이션 20% + 노이즈 · 글래스 카드(요일 Cormorant 56) ---------- */
.rsv-visit{position:relative;isolation:isolate;padding:110px 0;background:linear-gradient(180deg,rgba(0,0,0,0) 42.8%,rgba(0,0,0,.2) 100%),linear-gradient(rgba(36,32,19,.4),rgba(36,32,19,.4)),#E9E4DB url(../figma/location/values-bg-crop.webp) 0 0/100% 100% no-repeat}
.rsv-visit::before{content:"";position:absolute;inset:0;z-index:-1;background-image:var(--noise);opacity:.18;pointer-events:none}
.rsv-visit .sec-head{margin-bottom:56px}
.rsv-visit .sec-head .title{gap:22px}
.rsv-visit .sec-head .title h2,.rsv-visit .sec-head .title h2 em{padding:0;color:#fff}
.rsv-visit .sec-head .title p{font-size:15px;line-height:1.7;color:var(--on-dark-2)}
/* 고스트 버튼(Figma `action` ghost): 화이트 6% + 헤어 10% + 블러 12 → CSS 6px · 라벨 화이트 */
.rsv-visit .pill--glass{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.1);color:#fff;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.rsv-visit .pill--glass svg{color:#fff}
.rsv-visit .pill--glass:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.3);color:#fff}
.rsv-visit .value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.rsv-visit .value{padding:35px 35px 47px;border-radius:20px;background:rgba(255,247,226,.16);border:1px solid rgba(248,246,241,.14);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px)}
.rsv-visit .value:hover{border-color:rgba(233,217,191,.45);box-shadow:0 18px 50px -20px rgba(20,18,15,.5)}
.rsv-visit .value .num{padding-bottom:16px;font-family:var(--ff-en);font-style:italic;font-weight:300;font-size:56px;line-height:.6;letter-spacing:0;color:var(--beige-bright)}
.rsv-visit .value h3{margin-top:12px;font-size:22px;font-weight:500;line-height:1.4;letter-spacing:-.03em;color:#fff}
.rsv-visit .value p{margin-top:16px;font-size:15px;font-weight:400;line-height:1.85;letter-spacing:-.01em;color:var(--on-dark-2)}

/* ===== Responsive ===== */
/* ---------- Desktop ≥1280 — Figma 1920: 어두운 섹션 제목 옆에 설명 한 줄(h2 행 75 · 간격 16 · 설명 16/-3%) ---------- */
@media (min-width:1280px){
  .rsv-channels .sec-head .title,.rsv-visit .sec-head .title{flex-direction:row;align-items:baseline;gap:16px}
  .rsv-channels .sec-head .title h2,.rsv-visit .sec-head .title h2{padding-bottom:11px}
  .rsv-channels .sec-head .title p,.rsv-visit .sec-head .title p{font-size:16px;letter-spacing:-.03em}
}
/* ---------- Tablet 768–1279 — Figma `398:36276`: 채널 · 방문 카드 1열 · 온라인 상담 카피 위 / 폼 아래 · 제목 이탤릭 화이트 ---------- */
@media (max-width:1279px){
  .rsv-channels{padding:80px 0}
  .rsv-channels .sec-head .title{gap:20px}
  .rsv-channels .sec-head .title h2{padding-bottom:11px;font-size:64px}
  .rsv-channels .sec-head .title p{font-size:16px;letter-spacing:-.03em}
  .rsv-channels .channel-grid{grid-template-columns:1fr}

  .rsv-consult .container{grid-template-columns:1fr;gap:64px}
  .rsv-consult .cf-done{padding-top:8px}

  .rsv-visit{padding:80px 0}
  .rsv-visit .sec-head .title{flex-direction:row;align-items:baseline;gap:10px}
  .rsv-visit .sec-head .title h2{padding-bottom:11px;font-size:44px}
  .rsv-visit .sec-head .title p{font-size:16px;letter-spacing:-.03em}
  .rsv-visit .value-grid{grid-template-columns:1fr}
}
/* ---------- Mobile ≤767 — Figma `398:36334`: 제목 33 · 채널 행 72.8 · 폼 2열 유지(16 간격) · 방문 카드 설명 줄바꿈(br.mo-only) ---------- */
@media (max-width:767px){
  .rsv-channels{padding:72px 0 44px}
  .rsv-channels .sec-head{margin-bottom:56px}
  .rsv-channels .sec-head .title{gap:10px}
  .rsv-channels .sec-head .title h2{padding-bottom:7px;font-size:33px}
  .rsv-channels .sec-head .title p{font-size:15px;letter-spacing:-.01em}
  .rsv-channels .channel{gap:16px;padding:13.2px 15.2px 13.2px 13.2px;border-radius:14px;border-width:.8px}
  .rsv-channels .channel .ic{width:44.8px;height:44.8px;border-radius:10px}
  .rsv-channels .channel .ic svg{width:20.8px;height:20.8px}
  .rsv-channels .channel b{font-size:14px}
  .rsv-channels .channel>div span{margin-top:2px;font-size:12px;line-height:1.6}
  .rsv-channels .channel .arr{font-size:12.8px}

  .rsv-consult{padding:61px 0}
  .rsv-consult .container{gap:32px}
  .rsv-consult .lead{margin-top:20px;font-size:26px}
  .rsv-consult .desc{margin-top:14px;font-size:15px;letter-spacing:-.01em}
  .rsv-consult .check-list{margin-top:32px}
  .rsv-consult .form{gap:28px 16px;padding:40px 0 0}
  .rsv-consult .field label{gap:4.8px;margin-bottom:10px;padding-left:3.2px;font-size:12px}
  .rsv-consult .field label small{font-size:12px}
  .rsv-consult .field input,.rsv-consult .field select,.rsv-consult .field textarea{padding:4.8px 3.2px;border-bottom-width:.8px;font-size:14px}
  .rsv-consult .field :is(input,select){height:33.6px}
  .rsv-consult .field textarea{min-height:33.6px}
  .rsv-consult .field select{padding-right:22px;background-position:right 3px center;background-size:13px}
  .rsv-consult .agree small{font-size:10px}
  .rsv-consult .check{gap:8px;font-size:11px}
  .rsv-consult .check input{width:15px;height:15px;border-width:.8px;border-radius:3.2px;background-size:10px}
  .rsv-consult .form .submit{margin-top:20px}
  /* 제출 버튼은 모바일에서도 Figma `gold`(48h · 14px) — 공통 .pill 모바일(39h) 대신 */
  .rsv-consult .form .submit .pill{height:48px;padding:0 28px;gap:12px;font-size:14px}
  .rsv-consult .form .submit .pill svg{width:16px;height:16px}
  .rsv-consult .cf-err{font-size:11px;padding-left:3.2px}
  .rsv-consult .agree .cf-err{margin-top:-10px}
  .rsv-consult .cf-alert{padding:12px 14px;border-radius:10px;font-size:13px}
  .rsv-consult .cf-done{padding:8px 0 0}
  .rsv-consult .cf-done .ic{width:48px;height:48px}
  .rsv-consult .cf-done .ic svg{width:22px;height:22px}
  .rsv-consult .cf-done h3{margin-top:22px;font-size:22px}
  .rsv-consult .cf-done p{margin-top:10px;font-size:14px;letter-spacing:-.01em}
  .rsv-consult .cf-done .cf-tel{flex-direction:column;align-items:flex-start;gap:4px;margin-top:28px;padding:18px 20px;border-radius:14px}
  .rsv-consult .cf-done .cf-tel small{font-size:11px}
  .rsv-consult .cf-done .cf-tel b{font-size:26px}
  .rsv-consult .cf-modal{border-radius:20px}
  .rsv-consult .cf-modal__head{padding:18px 12px 14px 20px}
  .rsv-consult .cf-modal__head h3{font-size:17px}
  .rsv-consult .cf-modal__body{padding:16px 20px 4px;font-size:13px}
  .rsv-consult .cf-modal__body dt{font-size:12.5px}
  .rsv-consult .cf-modal__foot{padding:14px 20px 20px}

  .rsv-visit{padding:64px 0;background:linear-gradient(180deg,rgba(0,0,0,0) 42.8%,rgba(0,0,0,.2) 100%),linear-gradient(rgba(36,32,19,.4),rgba(36,32,19,.4)),#E9E4DB url(../figma/reservation/visit-bg-mo.webp) 0 0/100% 100% no-repeat}/* 모바일은 Figma 크롭 영역이 다름 */
  .rsv-visit .sec-head{flex-direction:column;align-items:flex-start;gap:40px}
  .rsv-visit .sec-head .title h2{padding-bottom:7px;font-size:33px}
  .rsv-visit .sec-head .title p{font-size:15px;letter-spacing:-.01em}
  .rsv-visit .pill--glass{backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
  .rsv-visit .value-grid{gap:14px}
  .rsv-visit .value{padding:23.2px 23.2px 35.2px;border-radius:16px;border-width:.8px}
  .rsv-visit .value .num{font-size:40px}
  .rsv-visit .value h3{margin-top:4px;font-size:19px;line-height:1.6}
  .rsv-visit .value p{margin-top:10px;font-size:13px}
}
/* ---------- 좁은 폰 ≤374: '이용해 / 주세요.' 강제 줄바꿈이 자연 줄바꿈과 겹치므로 해제 ---------- */
@media (max-width:374px){
  .rsv-consult .desc br:nth-of-type(3){display:none}
}
