/* ════════════════════════════════════════════════
   page-booking.css — ご予約内容を選ぶ（/booking）
   ※ 共通トークン・body基本は style.css 側。ここはページ固有のみ。
   ════════════════════════════════════════════════ */

/* 下部固定バー分の余白（JSが実バー高で上書き。これは保険） */
body{padding-bottom:130px;}

.bk-head{max-width:1120px;margin:0 auto;padding:44px 40px 32px;}
.bk-head .bk-eyebrow{display:flex;align-items:center;gap:14px;margin-bottom:20px;}
.bk-head .bk-eyebrow .idx{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:0.18em;color:var(--gold-dk);text-transform:uppercase;}
.bk-head .bk-eyebrow .bar{flex:1;max-width:60px;height:1px;background:var(--gold);opacity:.5;}
.bk-head .bk-eyebrow .lab{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:0.2em;color:var(--faint);text-transform:uppercase;}
.bk-head h1{font-family:'Playfair Display',serif;font-style:italic;font-weight:500;font-size:clamp(30px,5vw,46px);margin-bottom:14px;}
.bk-head .ja{font-family:'Noto Serif JP',serif;font-size:18px;margin-bottom:18px;letter-spacing:0.04em;}
.bk-head .lead{font-family:'Noto Serif JP',serif;font-size:14px;color:var(--soft);max-width:660px;line-height:2;}

.bk-wrap{max-width:1120px;margin:0 auto;padding:0 40px;}
.step{margin-top:54px;}
.step-head{display:flex;align-items:baseline;gap:16px;margin-bottom:22px;padding-bottom:14px;border-bottom:1px solid var(--line-i);}
.step-no{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:0.16em;color:var(--gold-dk);border:1px solid var(--gold);padding:5px 11px;flex-shrink:0;}
.step-ttl{font-family:'Noto Serif JP',serif;font-size:18px;font-weight:600;letter-spacing:0.04em;}
.step-en{font-family:'Playfair Display',serif;font-style:italic;font-size:15px;color:var(--faint);margin-left:auto;}
.step-note{font-size:12px;color:var(--soft);margin:-8px 0 18px;letter-spacing:0.02em;}

.plan-fixed{display:flex;align-items:center;gap:24px;background:var(--w2);border:1px solid var(--line);padding:22px 26px;position:relative;}
.plan-fixed .pf-badge{position:absolute;top:-1px;left:-1px;background:var(--gold);color:#fff;font-family:'Space Mono',monospace;font-size:9px;letter-spacing:0.16em;padding:5px 11px;text-transform:uppercase;}
.plan-fixed .pf-main{flex:1;padding-top:6px;}
.plan-fixed .pf-en{font-family:'Playfair Display',serif;font-style:italic;font-size:20px;margin-bottom:4px;}
.plan-fixed .pf-ja{font-family:'Noto Serif JP',serif;font-size:13px;color:var(--soft);}
.plan-fixed .pf-price{text-align:right;flex-shrink:0;}
.plan-fixed .pf-price b{font-family:'Cormorant Garamond',serif;font-size:34px;font-weight:500;}
.plan-fixed .pf-price small{display:block;font-size:11px;color:var(--soft);}
.plan-fixed .pf-check{flex-shrink:0;width:26px;height:26px;border-radius:50%;background:var(--gold);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;}

/* プラン選択（2択） */
.plan-choose{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;}
.plan-opt{position:relative;text-align:left;background:var(--w);border:1px solid var(--line);padding:22px 24px 20px;cursor:pointer;display:flex;flex-direction:column;gap:8px;transition:border-color .25s,box-shadow .25s;font-family:inherit;}
.plan-opt:hover{border-color:var(--gold-lt);}
.plan-opt.sel{border-color:var(--gold);box-shadow:0 10px 30px rgba(58,54,48,0.07);}
.plan-opt .po-badge{align-self:flex-start;font-family:'Space Mono',monospace;font-size:9px;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold-dk);border:1px solid var(--gold);padding:4px 11px;}
.plan-opt .po-price{font-family:'Cormorant Garamond',serif;font-size:30px;font-weight:500;color:var(--ink);line-height:1.1;}
.plan-opt .po-price small{font-family:'Noto Sans JP',sans-serif;font-size:12px;color:var(--soft);margin-left:6px;}
.plan-opt .po-for{font-size:12.5px;color:var(--soft);}
.plan-opt .po-styles{font-size:12.5px;color:var(--ink);letter-spacing:0.02em;}
.plan-opt .po-mark{position:absolute;top:16px;right:16px;width:24px;height:24px;border-radius:50%;background:var(--gold);color:#fff;display:none;align-items:center;justify-content:center;font-size:13px;}
.plan-opt.sel .po-mark{display:flex;}
@media(max-width:600px){.plan-choose{grid-template-columns:1fr;}}

.style-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.opt-card{position:relative;border:1px solid var(--line);background:#fff;cursor:pointer;text-align:left;padding:0;overflow:hidden;transition:.25s;font-family:inherit;color:inherit;display:flex;flex-direction:column;height:100%;}
.opt-card:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(58,54,48,0.08);}
.opt-card .oc-img{aspect-ratio:4/3;background:linear-gradient(135deg,var(--w3),var(--w2));background-size:cover;background-position:center;}
.opt-card .oc-body{padding:16px 18px 18px;flex:1;}
.opt-card .oc-en{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:0.18em;color:var(--gold-dk);text-transform:uppercase;margin-bottom:7px;}
.opt-card .oc-ja{font-family:'Noto Serif JP',serif;font-size:16px;font-weight:600;margin-bottom:6px;}
.opt-card .oc-desc{font-size:12px;color:var(--soft);line-height:1.7;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:41px;}
.opt-card .oc-mark{position:absolute;top:12px;right:12px;width:26px;height:26px;border-radius:50%;border:1px solid var(--gold);background:rgba(255,255,255,.85);display:flex;align-items:center;justify-content:center;font-size:13px;color:var(--gold-dk);opacity:0;transform:scale(.8);transition:.25s;}
.opt-card.sel{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold);}
.opt-card.sel .oc-mark{opacity:1;transform:scale(1);background:var(--gold);color:#fff;}

.panel{display:none;animation:bk-fade .4s ease;}
.panel.show{display:block;}
@keyframes bk-fade{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
.set-group-label{display:flex;align-items:baseline;gap:10px;margin:30px 0 14px;font-family:'Noto Serif JP',serif;font-size:14px;font-weight:600;color:var(--ink);}
.set-group-label:first-child{margin-top:0;}
.set-group-label span{font-family:'Space Mono',monospace;font-size:9px;letter-spacing:0.16em;color:var(--faint);text-transform:uppercase;}
.set-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:13px;}
.set-card{position:relative;border:1px solid var(--line);background:#fff;cursor:pointer;overflow:hidden;text-align:left;padding:0;transition:.25s;font-family:inherit;color:inherit;display:flex;flex-direction:column;height:100%;}
.set-card:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(58,54,48,0.08);}
.set-card .sc-img{height:152px;background:linear-gradient(135deg,var(--w3),var(--w2));background-size:cover;background-position:center;}
.set-card.paper .sc-img{box-shadow:inset 0 0 0 1px var(--line-i);}
.set-card .sc-body{padding:13px 15px 15px;flex:1;}
.set-card .sc-en{font-family:'Playfair Display',serif;font-style:italic;font-size:16px;line-height:1.2;margin-bottom:3px;}
.set-card .sc-name{font-family:'Space Mono',monospace;font-size:9.5px;letter-spacing:0.12em;color:var(--gold-dk);text-transform:uppercase;margin-bottom:7px;}
.set-card .sc-mood{font-size:11.5px;color:var(--soft);line-height:1.7;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:39px;}
.set-card .sc-mark{position:absolute;top:10px;right:10px;width:24px;height:24px;border-radius:50%;background:rgba(255,255,255,.85);border:1px solid var(--gold);display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--gold-dk);opacity:0;transform:scale(.8);transition:.25s;}
.set-card.sel{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold);}
.set-card.sel .sc-mark{opacity:1;transform:scale(1);background:var(--gold);color:#fff;}

.sumbar.is-hidden{display:none;}
.sumbar{position:fixed;left:0;right:0;bottom:0;z-index:50;background:rgba(250,250,247,.96);backdrop-filter:blur(8px);border-top:1px solid var(--gold);box-shadow:0 -6px 24px rgba(58,54,48,0.08);}
.sumbar-in{max-width:1120px;margin:0 auto;padding:14px 40px;display:flex;align-items:center;gap:20px;}
.sum-chips{flex:1;display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;min-width:0;}
.chip{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--soft);}
.chip .ck{font-family:'Space Mono',monospace;font-size:9px;letter-spacing:0.12em;color:var(--gold-dk);text-transform:uppercase;}
.chip b{font-family:'Noto Serif JP',serif;font-weight:600;color:var(--ink);font-size:13px;}
.chip.empty b{color:var(--faint);font-weight:400;}
.sum-cta{flex-shrink:0;display:flex;align-items:center;gap:14px;}
.sum-price{font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:500;}
.sum-price small{font-size:11px;color:var(--soft);font-family:'Noto Sans JP';}
.btn-go{font-family:'Noto Serif JP',serif;font-size:14px;font-weight:600;letter-spacing:0.06em;background:var(--gold);color:#fff;border:none;padding:14px 26px;cursor:pointer;transition:.25s;white-space:nowrap;}
.btn-go:hover{background:var(--gold-dk);}
.btn-go:disabled{opacity:.4;cursor:not-allowed;}

.bk-result{display:none;margin-top:48px;border:1px solid var(--gold);background:var(--w2);padding:28px 30px;}
.bk-result.show{display:block;animation:bk-fade .4s ease;}
.bk-result h3{font-family:'Playfair Display',serif;font-style:italic;font-size:20px;margin-bottom:6px;}
.bk-result .r-sub{font-size:12px;color:var(--soft);margin-bottom:18px;}
.bk-result pre{font-family:'Noto Serif JP',serif;font-size:13.5px;line-height:2;white-space:pre-wrap;background:#fff;border:1px solid var(--line-i);padding:18px 20px;}
.bk-result .r-btns{display:flex;gap:12px;margin-top:18px;flex-wrap:wrap;align-items:center;}
.r-btn{font-family:'Noto Serif JP',serif;font-size:13px;font-weight:500;letter-spacing:0.04em;padding:12px 22px;text-decoration:none;cursor:pointer;border:1px solid var(--gold);}
.r-btn.line{background:var(--gold);color:#fff;}
.r-btn.form{background:#fff;color:var(--gold-dk);}
.r-note{font-size:11px;color:var(--faint);margin-top:14px;}
.bk-reset{background:none;border:none;color:var(--soft);font-size:12px;text-decoration:underline;cursor:pointer;font-family:inherit;}

@media(max-width:1000px){
  .style-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:860px){
  body{padding-bottom:180px;}
  .bk-head{padding:36px 22px 24px;}
  .bk-wrap{padding:0 22px;}
  .style-grid{grid-template-columns:1fr;}
  .plan-fixed{flex-wrap:wrap;gap:14px;}
  .plan-fixed .pf-price{text-align:left;}
  .sumbar-in{padding:12px 18px;flex-wrap:wrap;gap:12px;}
  .sum-chips{flex-basis:100%;}
  .sum-cta{flex:1;justify-content:space-between;}
  .step-en{display:none;}
}
