/* 맛나감자탕 하위 페이지 '전체 통일'(TICKET_71 · 오너 2026-10-29 "전체 페이지에 적용해줘") — 홈·franchise(home.css) 밖 모든 쪽에 site.css 다음으로 연결(build.py head).
   기준 = TICKET_70 시안(site/_build/unify/unify.css). 첫 화면과 뼈대는 홈과 같게, 내용 바탕만 밝게. 글·구조는 그대로 — CSS 와 머리줄 JS(js/sub.js) 만.
   ① 제목 h1·h2·h3 = 홈 명조(Noto Serif KR, '?' 만 고딕 — site.css @font-face "UfQ") ② 페이지 머리 = 어두운 사진 띠(.page-top.band-* — 사진 url 은 이 파일에서 선언·사용해 경로가 이 파일 기준으로 맞음)
   ③ 머리줄 = 띠 위 투명 → 40px 내리면 먹색(JS 없으면 먹색) ④ 바닥글 = site.css(모든 쪽 공통, 홈과 같음) ⑤ 꼬리표 = 얇은 주황 글자, 카드 = 홈 모서리·선 ⑥ 움직임 없음(transition·animation 없음 — check.py 검사) */
:root {
  --uf-serif: "UfQ", "Noto Serif KR", "AppleMyungjo", "Batang", serif;
  --uf-bg: #14110F; --uf-cream: #F2EADF; --uf-sub: #E4DACD; --uf-acc: #FF9A2E; --uf-hair: rgba(242, 234, 223, .14);
  --uf-head: 0px;
}

/* ① 제목 = 명조 (본문·표·버튼은 고딕 그대로) */
h1, h2, h3 { font-family: var(--uf-serif); }
.block h2 { font-weight: 900; letter-spacing: -.03em; line-height: 1.3; }
.block h2::after { content: ""; display: block; width: 44px; height: 1px; margin-top: 18px; background: var(--main); }  /* 홈처럼 제목 아래 얇은 주황 선(장식) */

/* ③ 머리줄 — JS 없으면 먹색 그대로(띠는 그 아래). JS 있으면 띠 위에 겹치고 맨 위에서는 투명 */
.site-header { background: rgba(20, 17, 15, .94); border-bottom: 1px solid var(--uf-hair); }
.uf-js .site-header { margin-bottom: calc(-1 * var(--uf-head)); }
.uf-js:not(.uf-scrolled) .site-header { background: transparent; border-bottom-color: transparent; }

/* ② 사진 띠 — 글자 칸(--uf-tx = 글자 시작 + 820px) 아래 먹색 막 .86 이상 → 사진 화소가 흰색이어도 크림·보조·주황 글씨 4.5:1 이상 */
main { position: relative; }
.crumbs { position: absolute; top: calc(var(--uf-head) + 14px); left: 0; right: 0; z-index: 2; }
.crumbs ol { padding-top: 0; color: var(--uf-sub); }
.crumbs a { color: var(--uf-sub); }
.page-top { --uf-tx: calc(max(20px, 50% - 540px) + 820px); min-height: max(360px, 44vh); display: flex; align-items: flex-end; border-bottom: 0;
  --uf-shade: linear-gradient(90deg, rgba(20, 17, 15, .92) 0%, rgba(20, 17, 15, .86) var(--uf-tx), rgba(20, 17, 15, .5) calc(var(--uf-tx) + 18%), rgba(20, 17, 15, .35) 100%);
  --uf-shade-m: linear-gradient(180deg, rgba(20, 17, 15, .72) 0, rgba(20, 17, 15, .72) calc(var(--uf-head) + 40px), rgba(20, 17, 15, .25) calc(var(--uf-head) + 90px), rgba(20, 17, 15, .25) calc(var(--uf-head) + 40vw), var(--uf-bg) calc(var(--uf-head) + 62vw));
  background: var(--uf-shade), var(--uf-img, none) center 55% / cover no-repeat, var(--uf-bg); }
.page-head { width: 100%; padding: calc(var(--uf-head) + 72px) 20px 52px; }
.page-head > * { max-width: 820px; }
.page-head h1 { color: var(--uf-cream); font-size: clamp(32px, 2.4vw + 20px, 56px); font-weight: 900; letter-spacing: -.035em; }
.page-head .lead { color: var(--uf-sub); }
/* ⑤ 꼬리표: 주황 알약 → 얇은 주황 글자(kicker) */
.eyebrow { background: transparent; color: var(--uf-acc); padding: 0; border-radius: 0; font-weight: 700; letter-spacing: .08em; }
.eyebrow::before { content: ""; display: inline-block; width: 22px; height: 1px; margin-right: 10px; vertical-align: middle; background: var(--uf-acc); }

/* ⑤ 카드·문답 — 홈 모서리(4px)·얇은 선·그림자 없음, 바탕은 밝은 그대로 */
.card, .faq .q, .tbl-wrap, .facts { border-radius: 4px; box-shadow: none; }
.card:hover { border-color: rgba(255, 154, 46, .7); }


/* 띠 사진(사진 목록 사용처 '… 첫 화면 띠' — 실제 음식 사진, 장식이라 alt 없음, 1600px) */
.band-about { --uf-img: url(../img/photo/band-about.jpg); }
.band-menu { --uf-img: url(../img/photo/band-menu.jpg); }
.band-faq { --uf-img: url(../img/photo/band-faq.jpg); }
.band-stores { --uf-img: url(../img/photo/band-stores.jpg); }
.band-store { --uf-img: url(../img/photo/band-store.jpg); }

/* 휴대폰: 띠 = 사진 위·글자 아래(홈 휴대폰 방식), 빵부스러기 자리는 막 .72 */
@media (max-width: 760px) {
  .page-top { display: block; min-height: 0; background: var(--uf-shade-m), var(--uf-img, none) center top / auto calc(var(--uf-head) + 66vw) no-repeat, var(--uf-bg); }
  .page-head { padding: calc(var(--uf-head) + 58vw) 20px 40px; }
}
@media (forced-colors: active) { .eyebrow::before, .block h2::after { display: none; } }
