/* ============================================================
   店舗案内（/shop/）

   出所：店舗カンプ（2026-08-27 支給）。
   カンプは Tailwind + Noto Serif JP + 独自の色指定で作られていたが、
   本サイトのトンマナに合わせて置き換えている。対応は下記。

     カンプ            → 本サイト
     Noto Serif JP     → Shippori Mincho（英字は Cinzel）
     gold  #d4b996     → --kb-c-gold  #c5a059
     sumi  #333333     → --kb-c-ink   #2b2b2b
     kinari#fbfaf8     → --kb-c-paper #fafaf7
     haishaku #d6c6b2  → --kb-c-rule
     影 0 2px 15px     → TOPの写真と同じ 0 1px 2px（サイトの影はこの1種類だけ）
     Phosphor アイコン → 既存の .kb-more ＋ .kb-round（ラベル＋丸ボタン）

   数値・文言はここに書かない。すべて「店舗」投稿タイプから出る。
   ============================================================ */

.kb-shop{ padding:clamp(3rem,7vw,5.5rem) 0 clamp(4rem,9vw,7rem); }
.kb-shop__inner{
  max-width:1060px; margin:0 auto;
  padding:0 clamp(1.25rem,4vw,3rem);
}

/* ---- ページ見出し ---- */
.kb-shop__head{ text-align:center; margin-bottom:clamp(2.75rem,7vw,5rem); }
.kb-shop__en{
  display:block; margin-bottom:1rem;
  font-family:var(--kb-font-en); font-size:.8rem;
  letter-spacing:var(--kb-ls-wide); text-transform:uppercase; color:var(--kb-c-gold);
}
.kb-shop__title{
  margin:0; font-weight:500;
  font-size:clamp(1.5rem,3.4vw,2rem); letter-spacing:.22em; color:var(--kb-text);
}
.kb-shop__lead{
  margin:clamp(1.5rem,3.5vw,2.25rem) auto 0; max-width:44em;
  font-size:.86rem; line-height:2.4; letter-spacing:.1em; color:var(--kb-text-soft);
}
.kb-shop__rule{
  display:block; width:2.5rem; height:1px; margin:clamp(1.5rem,3.5vw,2.25rem) auto 0;
  background:var(--kb-c-gold);
}

/* ---- 店舗カード ---- */
.kb-shop__list{ display:flex; flex-direction:column; gap:clamp(2rem,4.5vw,3.5rem); }

.kb-scard{
  display:flex; flex-direction:column;
  background:var(--kb-c-white);
  border:1px solid var(--kb-rule); border-radius:2px;
  box-shadow:0 1px 2px 0 rgb(0 0 0 / .05);
  overflow:hidden;
}

/* 写真。カンプでは幅5/12、ホバーで少し寄る */
.kb-scard__media{
  background:var(--kb-c-paper);
  border-bottom:1px solid var(--kb-rule);
  overflow:hidden;
}
.kb-scard__media img{
  display:block; width:100%; height:100%; min-height:240px;
  object-fit:cover;
  transition:transform .7s ease;
}
.kb-scard:hover .kb-scard__media img{ transform:scale(1.05); }

.kb-scard__body{
  display:flex; flex-direction:column; justify-content:center;
  padding:clamp(1.75rem,4vw,3.25rem);
}
.kb-scard__en{
  display:block; margin-bottom:.85rem;
  font-family:var(--kb-font-en); font-size:.7rem;
  letter-spacing:var(--kb-ls-wide); text-transform:uppercase; color:var(--kb-c-gold);
}
.kb-scard__name{
  margin:0 0 clamp(1.1rem,2.5vw,1.6rem); font-weight:500;
  font-size:clamp(1.05rem,2.2vw,1.35rem); letter-spacing:.16em; color:var(--kb-text);
}
.kb-scard__lead{
  margin:0 0 clamp(1.5rem,3vw,2rem);
  font-size:.8rem; line-height:2.3; letter-spacing:.05em; color:var(--kb-text-soft);
}

/* 地図リンク。ラベルを右に置く形（カンプのテキストリンクに近い並び） */
.kb-more--left{ justify-content:flex-start; gap:.9rem; }

/* ---- 2カラム（カンプは md 以上で左右交互）---- */
@media (min-width:768px){
  .kb-scard{ flex-direction:row; }
  .kb-scard--rev{ flex-direction:row-reverse; }
  .kb-scard__media{
    flex:0 0 41.6667%;   /* カンプの 5/12 */
    border-bottom:0; border-right:1px solid var(--kb-rule);
  }
  .kb-scard--rev .kb-scard__media{ border-right:0; border-left:1px solid var(--kb-rule); }
  .kb-scard__media img{ min-height:100%; }
  .kb-scard__body{ flex:1 1 auto; min-width:0; }
}