/* ─────────────────────────────────────────────────────────────────────
   비즈스타트 v3 (2026-09-11) — style.css 위에 얹는다.
   규격 /root/ops/design/specs/kbsc-biz.json (리듬 64/40 · 본문 16 · 라운드 18 · 브랜드 #0F766E)
   ★새 블록은 bs- 접두어만 쓴다 — 기존 .hero/.sec/.bar 류와 부딪히지 않게.
   ★리듬은 .bs-sec / .bs-band-wrap 의 margin-bottom 한 방향. 색 띠는 여백 담당 래퍼로 감싼다(A13⑤).
   ★앰버 #B45309 는 흰 바탕 글씨용, 밝은 앰버 #F59E0B 는 초점 링·면에만.
   ───────────────────────────────────────────────────────────────────── */
:root{
  --brand:#0F766E; --brand-ink:#fff; --brand-soft:#E6F2F0; --brand-deep:#0B2F2B; --brand-hover:#0C655E;
  --accent:#B45309; --accent-soft:#FEF3C7;
  --ink:#12211F; --ink-2:#3F4F4C; --ink-3:#5E6E6B;
  --bg:#FFFFFF; --bg-2:#F2F5F2; --ground:#FAFAF7; --line:#E1E7E3;
  --radius:18px; --radius-sm:12px;
  --rhythm:64px;
}
@media(max-width:720px){:root{--rhythm:40px}}
body{font-size:16px;background:var(--ground);color:var(--ink);
  font-family:"Pretendard Variable","Pretendard",-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif}

/* ── 공통 초점 표시 — 키보드로 다니는 손님도 지금 어디 있는지 보여야 한다 ── */
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{
  outline:3px solid #F59E0B;outline-offset:2px;border-radius:10px}

/* ── 헤더 ─────────────────────────────────────────── */
.hd{background:rgba(250,250,247,.95)}
.hd nav a{font-size:15px}
.bs-hd-cta{margin-left:8px;display:inline-flex;align-items:center;min-height:42px;padding:0 16px;
  border-radius:999px;background:var(--brand);color:#fff;font-size:15px;font-weight:700;white-space:nowrap}
.bs-hd-cta:hover{background:var(--brand-hover)}
@media(max-width:720px){.bs-hd-cta{display:none}}

/* 홈이 아닌 지면 맨 위 한 줄 — 가격이 첫 화면에 보이게(v3 43.2) */
.bs-strip{background:var(--brand-deep);color:#E6F2F0;font-size:15px}
.bs-strip .wrap{display:flex;gap:6px 12px;align-items:center;flex-wrap:wrap;min-height:50px;padding-block:6px}
.bs-strip b{color:#fff;font-weight:800}
.bs-strip a{margin-left:auto;display:inline-flex;align-items:center;min-height:40px;padding:0 16px;
  border-radius:999px;background:#fff;color:var(--brand-deep);font-weight:800;font-size:15px}
@media(max-width:720px){.bs-strip a{margin-left:0}}

/* ── 섹션 머리 ────────────────────────────────────── */
.bs-sec{margin-bottom:var(--rhythm)}
.bs-hdrow{display:flex;align-items:flex-end;gap:10px 16px;flex-wrap:wrap;margin-bottom:22px}
.bs-h2{margin:0 0 6px;font-size:clamp(23px,3vw,31px);font-weight:800;letter-spacing:-.028em;line-height:1.3;color:var(--ink)}
.bs-sub{margin:0;color:var(--ink-2);font-size:16px}
.bs-more{margin-left:auto;display:inline-flex;align-items:center;min-height:44px;padding:0 6px;
  font-weight:800;color:var(--brand);font-size:15px}
.bs-more:hover{text-decoration:underline}

/* ── 버튼 ─────────────────────────────────────────── */
.bs-acts{display:flex;gap:10px;flex-wrap:wrap}
.bs-btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 24px;
  border-radius:999px;font-size:16px;font-weight:800;border:1.5px solid var(--line);background:#fff;color:var(--ink);
  transition:background .15s var(--ease),border-color .15s var(--ease)}
.bs-btn:hover{border-color:var(--brand)}
.bs-btn.pri{background:var(--brand);border-color:var(--brand);color:#fff}
.bs-btn.pri:hover{background:var(--brand-hover);border-color:var(--brand-hover)}

/* ── 히어로 — 글은 왼쪽, 사진은 오른쪽. 모바일은 할 일(버튼)이 사진보다 먼저 ── */
.bs-hero{margin-bottom:var(--rhythm);padding-top:clamp(22px,4vw,52px)}
.bs-hero-in{display:grid;gap:clamp(22px,4vw,52px);align-items:center;grid-template-columns:minmax(0,1fr)}
@media(min-width:900px){.bs-hero-in{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)}}
.bs-kicker{margin:0 0 12px;color:var(--accent);font-weight:800;font-size:16px}
.bs-hero h1{margin:0 0 16px;font-size:clamp(31px,5vw,54px);line-height:1.2;letter-spacing:-.036em;font-weight:800;color:var(--ink)}
.bs-hero h1 em{font-style:normal;color:var(--brand)}
.bs-lead{margin:0 0 24px;font-size:clamp(16px,1.9vw,19px);color:var(--ink-2);max-width:36ch}
.bs-proof{list-style:none;margin:20px 0 0;padding:0;display:flex;gap:8px 18px;flex-wrap:wrap;color:var(--ink-2);font-size:15px;font-weight:700}
.bs-proof li{display:flex;align-items:center;gap:8px}
.bs-proof li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--brand);flex:0 0 auto}
.bs-hero-media{position:relative;border-radius:26px;overflow:hidden;background:var(--bg-2);aspect-ratio:16/10;max-width:100%}
.bs-hero-media img{width:100%;height:100%;object-fit:cover;object-position:72% 50%}
.bs-hero-note{position:absolute;left:14px;bottom:14px;right:auto;max-width:calc(100% - 28px);
  background:rgba(255,255,255,.96);border-radius:14px;padding:10px 14px;font-size:15px;font-weight:700;color:var(--ink);
  box-shadow:0 8px 24px -12px rgba(11,47,43,.45)}
.bs-hero-note b{color:var(--brand)}

/* ── 가게 찾기 ────────────────────────────────────── */
.bs-find{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:clamp(18px,3vw,30px)}
.bs-find .search{margin:0 0 6px;max-width:none}
.bs-find-lbl{display:block;margin:16px 0 8px;font-size:15px;font-weight:800;color:var(--ink-2)}

/* ── 요금 띠 (배경 블록 — 여백은 .bs-band-wrap 이 맡는다) ───────────── */
.bs-band-wrap{margin-bottom:var(--rhythm)}
.bs-band{background:var(--brand-deep);color:#fff;border-radius:28px;overflow:hidden;
  display:grid;grid-template-columns:minmax(0,1fr)}
@media(min-width:900px){.bs-band{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}}
.bs-band-body{padding:clamp(24px,4vw,50px)}
.bs-band h2{margin:0 0 12px;font-size:clamp(24px,3.2vw,34px);line-height:1.25;letter-spacing:-.03em;color:#fff}
.bs-price{display:flex;align-items:baseline;gap:6px 12px;flex-wrap:wrap;margin:0 0 6px}
.bs-price b{font-size:clamp(40px,6vw,62px);font-weight:800;letter-spacing:-.04em;color:#fff;line-height:1.05}
.bs-price span{font-size:18px;color:#E6F2F0;font-weight:800}
.bs-price-sub{color:#BFD8D3;font-size:15px;margin:0 0 22px}
.bs-inc{list-style:none;padding:0;margin:0 0 26px;display:grid;gap:10px 18px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.bs-inc li{display:flex;gap:9px;align-items:flex-start;font-size:16px;color:#fff}
.bs-inc li::before{content:"✓";color:#5EEAD4;font-weight:800;flex:0 0 auto}
.bs-band .bs-btn.pri{background:#fff;border-color:#fff;color:var(--brand-deep)}
.bs-band .bs-btn.pri:hover{background:#E6F2F0}
.bs-band .bs-btn:not(.pri){background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
.bs-free{margin-top:22px;border-top:1px solid rgba(255,255,255,.2);padding-top:18px;display:grid;gap:8px;font-size:15px;color:#BFD8D3}
.bs-free b{color:#fff}
.bs-free a{color:#fff;text-decoration:underline;text-underline-offset:3px;
  display:inline-flex;align-items:center;min-height:32px}   /* 글자 링크도 터치 높이 24px 이상(A6) — 18px 이었다 */
.bs-band-media{min-height:280px;position:relative}
.bs-band-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:28% 45%}

/* ── 만드는 순서 — 카드가 아니라 번호 흐름으로(카드 그리드 반복 3개 제한 A11) ── */
.bs-steps{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:18px;counter-reset:s;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.bs-steps li{counter-increment:s;position:relative;padding:0 0 0 52px}
.bs-steps li::before{content:counter(s);position:absolute;left:0;top:0;width:38px;height:38px;border-radius:50%;
  display:grid;place-items:center;background:var(--brand);color:#fff;font-weight:800;font-size:16px}
.bs-steps b{display:block;font-size:17.5px;margin:6px 0 4px;color:var(--ink)}
.bs-steps span{display:block;color:var(--ink-2);font-size:15.5px}

/* ── 자주 묻는 질문 ───────────────────────────────── */
.bs-faq{max-width:860px}
.bs-faq details{border-bottom:1px solid var(--line)}
.bs-faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px;
  min-height:60px;font-size:17px;font-weight:700;color:var(--ink)}
.bs-faq summary::-webkit-details-marker{display:none}
.bs-faq summary::after{content:"+";font-size:26px;line-height:1;color:var(--brand);font-weight:500;flex:0 0 auto}
.bs-faq details[open] summary::after{content:"−"}
.bs-faq p{margin:0 0 18px;color:var(--ink-2);font-size:16px}

/* ── 사장님 안내 카드 (목록·상세 중간) ─────────────── */
.bs-owner{display:grid;grid-template-columns:minmax(0,1fr);background:#fff;border:1px solid var(--line);
  border-radius:var(--radius);overflow:hidden;margin-top:30px}
@media(min-width:720px){.bs-owner{grid-template-columns:240px minmax(0,1fr)}}
.bs-owner-ph{position:relative;min-height:170px;background:var(--bg-2)}
.bs-owner-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:28% 40%}
.bs-owner-bd{padding:20px 22px}
.bs-owner-t{display:block;font-size:19px;font-weight:800;margin-bottom:6px;color:var(--ink)}
.bs-owner-bd p{margin:0 0 14px;color:var(--ink-2);font-size:15.5px}
aside .bs-owner{grid-template-columns:minmax(0,1fr);margin-top:18px}

/* ── 지면 끝 행동 띠 + 꼬리말 ─────────────────────── */
.bs-end{background:var(--brand);color:#fff}
.bs-end .wrap{display:flex;gap:16px 24px;align-items:center;flex-wrap:wrap;padding-block:clamp(28px,4vw,44px)}
.bs-end h2{margin:0;font-size:clamp(21px,2.6vw,27px);letter-spacing:-.02em;color:#fff}
.bs-end p{margin:6px 0 0;color:#E6F2F0;font-size:16px}
.bs-end .bs-btn{margin-left:auto;background:#fff;border-color:#fff;color:var(--brand-deep)}
@media(max-width:720px){.bs-end .bs-btn{margin-left:0;width:100%}}
.ft{margin-top:0;font-size:15px;color:var(--ink-2);background:var(--bg-2)}

/* ── 기존 지면(목록·지역·업종·상세) 읽기 크기·터치·대비 ─────────────
   예전 값: 보조글씨 #94a3b8(2.4:1) · 13~14px · 더 보기 24px 높이 → A5·A4·A6 위반이었다 */
.sec.alt{background:transparent}
.sec-hd p,.note,.crumb,.card .meta,.tools .cnt,.tools .sorts a{font-size:15px}
.sec-hd .more{min-height:44px;display:inline-flex;align-items:center;padding:0 6px;margin:0}
.crumb a{min-height:40px;display:inline-flex;align-items:center}
.badge{font-size:13px;padding:4px 10px}
.badge.star{background:var(--accent-soft);color:#92400E}
.chip{min-height:44px;font-size:15px}
.chip .n{font-size:13px}
.chip.on{background:var(--brand);border-color:var(--brand)}
.frow > b{font-size:14px;color:var(--ink-2)}
.kv div{font-size:15.5px}
.kv b{font-size:15px;color:var(--ink-2)}
.pager a,.pager span{min-width:44px;height:44px;font-size:15px}
.card h3{font-size:16.5px}
.hd nav a.on{background:var(--brand-soft);color:var(--brand)}
@media(max-width:720px){.hd nav a{font-size:15px}}

/* 모바일 가게 찾기 칩 — 줄바꿈이면 업종 5줄·지역 6줄이 쌓여 화면 하나를 먹었다(9/11 스크린샷). 한 줄로 민다 */
@media(max-width:720px){
  .bs-find .chips{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;min-width:0;max-width:100%;
    -webkit-overflow-scrolling:touch;scrollbar-width:none}
  .bs-find .chips::-webkit-scrollbar{display:none}
  .bs-find .chips > .chip{flex:0 0 auto}
}

/* ── 가게 상세 보강 (소개·메뉴·소식·같은 동네) ───────────────────── */
.bs-detail{display:grid;gap:24px}
.bs-dblock{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:clamp(18px,3vw,30px);min-width:0}
.bs-dblock .bs-h2{margin-bottom:12px}
.bs-dblock .bs-hdrow{margin-bottom:10px}
.bs-tagline{margin:0 0 14px;font-size:clamp(18px,2.2vw,21px);font-weight:800;color:var(--brand)}
.bs-intro{margin:0 0 12px;font-size:16px;color:var(--ink);line-height:1.75;overflow-wrap:anywhere}
.bs-intro.t{font-weight:800}
.bs-menu{list-style:none;margin:0;padding:0;display:grid;gap:0 28px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.bs-menu li{display:flex;flex-wrap:wrap;gap:2px 10px;align-items:baseline;padding:12px 0;border-bottom:1px dashed var(--line);min-width:0}
.bs-menu .n{font-weight:700;font-size:16px;flex:1 1 auto;min-width:0;overflow-wrap:anywhere}
.bs-menu .p{font-weight:800;color:var(--brand);font-size:16px;white-space:nowrap}
.bs-menu .d{flex:1 0 100%;color:var(--ink-2);font-size:15px}
.bs-posts{list-style:none;margin:0;padding:0}
.bs-posts li{display:flex;gap:12px;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);min-width:0}
.bs-posts a{flex:1;min-width:0;min-height:48px;display:flex;align-items:center;font-size:16px;font-weight:600;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bs-posts a:hover{color:var(--brand)}
.bs-posts time{color:var(--ink-3);font-size:15px;white-space:nowrap}
.bs-links{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:0 18px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.bs-links a{display:flex;gap:8px;align-items:baseline;min-height:46px;padding:10px 0;border-bottom:1px solid var(--line);
  font-size:16px;font-weight:600;min-width:0;overflow-wrap:anywhere}
.bs-links a span{color:var(--ink-3);font-size:15px;font-weight:500;white-space:nowrap}
.bs-links a:hover{color:var(--brand)}
.bs-chips-gap{margin-top:18px}

/* ── 9/11 검수에서 걸린 것 ────────────────────────────────────────── */
/* 글자 링크 터치 높이(A6) — 상세 '홈페이지' 주소 링크 122×19, 업종 지면 갈래 이름 링크 69×18 이었다 */
.kv a,.filters .frow > b a,.bh .sub a{display:inline-flex;align-items:center;min-height:32px}
/* 업종 지면의 세부업종 줄은 인라인 style 13.5px — 인라인을 이기려면 !important 뿐이다 */
.filters p{font-size:15px !important;color:var(--ink-2) !important}
/* 목록·지역·업종 제목을 h1 으로 올렸다(미리보기에서만) — 모양은 h2 와 같게 */
.sec-hd h1{margin:0;font-size:clamp(22px,3vw,30px);font-weight:800;letter-spacing:-.025em;line-height:1.3}

/* ── 히어로 2차 (9/11 사용자 지시): 전체 폭 배경 사진 + 가운데 검색 — 로컬비즈 방식 ─────────
   ★사진 위 흰 글씨 대비는 도구가 판정 불가로 넘긴다 — 스크린샷으로 본다.
   ★스크림은 두 층: 글자·검색 뒤(가운데 타원)만 진하게, 가장자리는 옅게. 사진이 살아 있어야 한다(apt25·petbi 사건). */
.bs-hx{position:relative;isolation:isolate;min-height:clamp(480px,64vh,640px);display:grid;align-items:center;
  grid-template-columns:minmax(0,1fr);   /* ★1fr(=auto 최소폭)이면 모바일 한 줄 빠른찾기 버튼 폭만큼 칸이 늘어나 제목이 잘렸다 — overflow:hidden 이 가려 가로밀림 검사도 통과했다(9/11 스크린샷) */
  overflow:hidden;background:var(--brand-deep)}
.bs-hx-in{min-width:0;width:100%}
.bs-hx-bg{position:absolute;inset:0;z-index:-2}
.bs-hx-bg img{width:100%;height:100%;object-fit:cover;object-position:50% 55%}
.bs-hx::before{content:"";position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(ellipse 58% 52% at 50% 50%, rgba(5,22,20,.58) 0%, rgba(5,22,20,.30) 60%, rgba(5,22,20,0) 100%),
    linear-gradient(180deg, rgba(5,22,20,.30) 0%, rgba(5,22,20,.08) 45%, rgba(5,22,20,.40) 100%)}
.bs-hx-in{text-align:center;padding-block:clamp(52px,8vw,100px);color:#fff}
.bs-hx-kicker{margin:0 0 12px;font-weight:800;font-size:16px;color:#FDE68A;text-shadow:0 1px 10px rgba(0,0,0,.5)}
.bs-hx h1{margin:0 0 14px;font-size:clamp(31px,5vw,50px);line-height:1.22;letter-spacing:-.035em;font-weight:800;color:#fff;
  text-shadow:0 2px 18px rgba(0,0,0,.5)}
.bs-hx-lead{margin:0 auto 26px;max-width:40ch;font-size:clamp(16px,1.9vw,19px);color:#F3F7F6;text-shadow:0 1px 12px rgba(0,0,0,.55)}
.bs-hx-search{margin:0 auto;max-width:680px;display:flex;gap:6px;background:#fff;border-radius:999px;padding:6px;
  box-shadow:0 18px 44px -18px rgba(0,0,0,.6)}
.bs-hx-search input{flex:1;min-width:0;height:54px;border:0;padding:0 20px;font-size:17px;border-radius:999px;background:transparent;color:var(--ink)}
.bs-hx-search input::placeholder{color:#6B7A77}
.bs-hx-search input:focus-visible{outline:none}
.bs-hx-search:focus-within{box-shadow:0 0 0 3px #F59E0B,0 18px 44px -18px rgba(0,0,0,.6)}
.bs-hx-search button{height:54px;padding:0 30px;border:0;border-radius:999px;background:var(--brand);color:#fff;
  font-size:17px;font-weight:800;cursor:pointer;white-space:nowrap}
.bs-hx-search button:hover{background:var(--brand-hover)}
.bs-hx-quick{margin:16px auto 0;max-width:760px;display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.bs-hx-quick a{display:inline-flex;align-items:center;min-height:40px;padding:0 15px;border-radius:999px;
  background:rgba(5,22,20,.55);border:1px solid rgba(255,255,255,.45);color:#fff;font-size:15px;font-weight:700}
.bs-hx-quick a:hover{background:rgba(5,22,20,.75);border-color:#fff}
.bs-hx-stats{list-style:none;margin:28px 0 0;padding:0;display:flex;justify-content:center;gap:10px 34px;flex-wrap:wrap}
.bs-hx-stats li{font-size:15px;color:#E6F2F0;text-shadow:0 1px 10px rgba(0,0,0,.55)}
.bs-hx-stats b{display:block;font-size:clamp(23px,3vw,31px);font-weight:800;color:#fff;line-height:1.2}
@media(max-width:720px){
  .bs-hx{min-height:580px}
  .bs-hx-search{border-radius:18px}
  .bs-hx-search input{height:50px;padding:0 12px;font-size:16px}
  .bs-hx-search button{height:50px;padding:0 20px;font-size:16px;border-radius:14px}
  .bs-hx-quick{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;scrollbar-width:none;padding-bottom:4px;max-width:100%}
  .bs-hx-quick::-webkit-scrollbar{display:none}
  .bs-hx-quick a{flex:0 0 auto}
}

/* 히어로 바로 아래 사장님 한 줄 — 제작·요금은 모두의사이트의 것이라 이름을 붙여 둔다 */
.bs-partner{background:#fff;border-bottom:1px solid var(--line);margin-bottom:var(--rhythm)}
.bs-partner .wrap{display:flex;gap:6px 14px;align-items:center;flex-wrap:wrap;min-height:60px;padding-block:8px;
  font-size:15.5px;color:var(--ink-2)}
.bs-partner b{color:var(--ink)}
.bs-partner a{margin-left:auto;display:inline-flex;align-items:center;min-height:42px;padding:0 18px;border-radius:999px;
  border:1.5px solid var(--brand);color:var(--brand);font-weight:800;font-size:15px}
.bs-partner a:hover{background:var(--brand-soft)}
@media(max-width:720px){.bs-partner a{margin-left:0}}
.bs-band-kicker{margin:0 0 10px !important;color:#FDE68A !important;font-weight:800;font-size:15px !important}