/* ============ 分店頁（由 build_branches.py 產生嘅頁面用） ============ */

.branch-page { background: var(--cream); }

/* ---- 頁頭 ---- */
.bp-head {
  background: linear-gradient(160deg, var(--teal-deep) 0%, var(--teal-ink) 100%);
  color: var(--cream);
  padding: 120px 0 44px;
}
.bp-head .crumb {
  font-size: .82rem; letter-spacing: .06em; color: rgba(247,244,236,.6); margin-bottom: 22px;
}
.bp-head .crumb a { color: rgba(247,244,236,.75); text-decoration: none; }
.bp-head .crumb a:hover { color: var(--gold); }
.bp-en {
  font-family: var(--serif-en); font-style: italic; color: var(--gold);
  letter-spacing: .1em; margin: 0 0 6px; font-size: 1.05rem;
}
.bp-head h1 {
  font-family: var(--serif-tc); font-weight: 700; font-size: clamp(1.7rem, 5vw, 2.6rem);
  letter-spacing: .06em; margin: 0 0 24px; line-height: 1.3;
}
.bp-head h1 small {
  display: block; font-family: var(--sans-tc); font-weight: 400;
  font-size: .95rem; letter-spacing: .14em; color: rgba(247,244,236,.65); margin-top: 10px;
}

/* ---- 重點資料 ---- */
.bp-facts { list-style: none; margin: 0 0 28px; padding: 0; display: grid; gap: 12px; max-width: 760px; }
.bp-facts li { display: flex; gap: 12px; align-items: flex-start; line-height: 1.6; }
.bp-facts svg { width: 19px; height: 19px; flex: 0 0 19px; color: var(--gold); margin-top: 3px; }
.bp-facts a { color: var(--cream); }

.bp-cta { display: flex; flex-wrap: wrap; gap: 12px; }
.bp-cta .btn svg { width: 17px; height: 17px; }

/* ---- 內容區 ---- */
.bp-sec { padding: 44px 24px 0; }
.bp-sec:last-of-type { padding-bottom: 60px; }
.bp-sec h2 {
  font-family: var(--serif-tc); font-size: 1.3rem; letter-spacing: .08em;
  color: var(--teal-deep); margin: 0 0 16px;
  padding-bottom: 10px; border-bottom: 1px solid rgba(45,132,132,.18);
}
.bp-howto { font-size: 1.02rem; line-height: 1.9; color: var(--ink); margin: 0; max-width: 62ch; }

/* ---- 收費 ---- */
.bp-price { border-collapse: collapse; width: 100%; max-width: 460px; }
.bp-price th, .bp-price td { padding: 13px 4px; border-bottom: 1px solid rgba(45,132,132,.16); text-align: left; }
.bp-price th { font-weight: 500; color: var(--muted); }
.bp-price td {
  font-family: var(--serif-en); font-size: 1.22rem; color: var(--teal-deep);
  text-align: right; font-variant-numeric: tabular-nums;
}
.bp-note { color: var(--muted); font-size: .88rem; margin-top: 12px; }

/* ---- 相 ---- */
.bp-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.bp-photo { margin: 0; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-sm); background: var(--cream-2); }
.bp-photo img { display: block; width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.bp-nophoto { color: var(--muted); font-size: .92rem; margin: 0; }

/* ---- 其他分店 ---- */
.bp-others { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; }
.bp-others a {
  display: block; padding: 15px 17px; background: var(--white); border-radius: var(--radius);
  box-shadow: var(--shadow-sm); text-decoration: none; color: var(--teal-deep);
  font-weight: 500; transition: transform .16s, box-shadow .16s;
}
.bp-others a:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.bp-others span { display: block; font-size: .8rem; color: var(--muted); font-weight: 400; margin-top: 3px; }

@media (max-width: 640px) {
  .bp-head { padding: 100px 0 36px; }
  .bp-sec { padding-top: 34px; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }