/* AIMarker 13.9 가게 AI 검색 등록(/local/ · /local/업종/ · 첫 화면 구획): 진단 도구 · AI 답변 예시 · 업종 카드 · 진행 순서. 디자인 시스템 'Signal'(v11) 토큰만 씀 */

/* ---------- 머리: 빠른 시작 · AI 답변 예시 ---------- */
.lc-hero .k-h1 { word-break: keep-all; }
.lc-ih .k-h1 { font-size: clamp(28px, 3.3vw, 42px); line-height: 1.22; }
.lc-eye { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 16px; padding: 0; list-style: none; }
.lc-eye li { height: 26px; display: inline-flex; align-items: center; padding: 0 10px; border-radius: 999px; background: var(--ds-blue-50); color: var(--ds-blue-700); font-size: 12.5px; font-weight: 650; }
.lc-start { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 26px; max-width: 580px; padding: 10px; border: 1px solid var(--ds-line-2); border-radius: 14px; background: #fff; box-shadow: var(--e2); }
.lc-start .sel, .lc-start .inp { height: 48px; font-size: 15.5px; }
.lc-start .sel { grid-column: 1 / -1; }
.lc-start .k-btn { grid-column: 1 / -1; height: 52px; font-size: 16.5px; }
.lc-start.one .sel { display: none; }
.lc-trust { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 14px 0 0; padding: 0; list-style: none; font-size: 13.5px; color: var(--ds-slate); }
.lc-trust li { display: inline-flex; align-items: center; gap: 6px; }
.lc-trust .ico { width: 16px; height: 16px; color: var(--ds-green); }

.lc-ai { max-width: 560px; justify-self: end; width: 100%; }
.lc-ai-body { padding: 18px 18px 16px; display: grid; gap: 12px; transition: opacity .26s var(--ease, ease); }
.lc-ai.sw .lc-ai-body { opacity: .15; }
.lc-q { justify-self: end; max-width: 88%; margin: 0; padding: 10px 14px; border-radius: 16px 16px 4px 16px; background: var(--ds-ink); color: #fff; font-size: 14.5px; line-height: 1.55; }
.lc-q span { display: block; margin-bottom: 2px; font-size: 11.5px; font-weight: 600; color: #AFC2EA; }
.lc-q b { font-weight: 600; }
.lc-a { display: grid; gap: 10px; }
.lc-a-t { margin: 0; display: flex; gap: 8px; align-items: flex-start; font-size: 14.5px; line-height: 1.6; color: var(--ds-ink-2); }
.lc-a-t b { flex: 0 0 auto; display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 8px; background: linear-gradient(135deg, var(--ds-blue-600), #33C8FF); color: #fff; font-size: 11px; font-weight: 700; }
.lc-card { margin-left: 34px; border: 1px solid var(--ds-line); border-radius: 12px; padding: 12px 14px; background: var(--ds-canvas); }
.lc-card .ch { display: grid; gap: 2px; }
.lc-card .ch b { font-size: 15.5px; font-weight: 700; color: var(--ds-ink); }
.lc-card .ch span { font-size: 12.5px; color: var(--ds-mist); }
.lc-card ul { margin: 8px 0 0; padding: 0; list-style: none; display: grid; gap: 4px; }
.lc-card li { position: relative; padding-left: 16px; font-size: 13.5px; color: var(--ds-ink-2); }
.lc-card li::before { content: ""; position: absolute; left: 3px; top: 8px; width: 6px; height: 6px; border-radius: 50%; background: var(--ds-green); }
.lc-card .src { margin: 10px 0 0; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font-size: 11.5px; color: var(--ds-mist); }
.lc-card .src span { padding: 1px 8px; border-radius: 999px; border: 1px solid var(--ds-line-2); background: #fff; color: var(--ds-slate); font-weight: 600; }
.lc-ai-ft { margin: 2px 0 0; padding-top: 12px; border-top: 1px dashed var(--ds-line-2); font-size: 12.5px; color: var(--ds-slate); line-height: 1.6; }
.lc-ai-ft .k { display: inline-block; margin-right: 6px; padding: 0 7px; border-radius: 5px; background: var(--ds-green-bg); color: var(--ds-green-ink); font-weight: 700; }
@media (max-width: 920px) { .lc-ai { justify-self: stretch; max-width: none; } }
@media (max-width: 560px) { .lc-start { grid-template-columns: 1fr; } .lc-card { margin-left: 0; } .lc-q { max-width: 100%; } }

/* ---------- 업종 칩 ---------- */
.lc-links .lp-chips a { gap: 6px; }

/* ---------- 왜 지금 / AI가 추천하는 가게 ---------- */
.lc-why { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.lc-why > div { padding: 20px 18px; border: 1px solid var(--ds-line); border-radius: 14px; background: #fff; }
.lc-why .ic { display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; background: var(--ds-blue-50); color: var(--ds-blue-700); }
.lc-why .ic .ico { width: 20px; height: 20px; }
.lc-why h3 { margin: 14px 0 6px; font-size: 17px; font-weight: 700; letter-spacing: -.02em; word-break: keep-all; }
.lc-why p { margin: 0; font-size: 14.5px; line-height: 1.65; color: var(--ds-slate); word-break: keep-all; }
.lc-why p b { color: var(--ds-ink); }
.lc-alarm { margin: 18px 0 0; padding: 14px 16px; border-radius: 12px; background: var(--ds-red-bg); border: 1px solid var(--ds-red-line); color: var(--ds-red-ink); font-size: 15px; font-weight: 600; word-break: keep-all; }
@media (max-width: 1080px) { .lc-why { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .lc-why { grid-template-columns: 1fr; } }

/* ---------- 진단 도구 ---------- */
.lc-sec { scroll-margin-top: 64px; }
.lc { display: grid; grid-template-columns: minmax(0, 1fr) 390px; gap: 24px; align-items: start; }
.lc-form { display: grid; gap: 10px; min-width: 0; }
.lc-step { border: 1px solid var(--ds-line); border-radius: 14px; background: #fff; }
.lc-step[open] { border-color: var(--ds-line-2); box-shadow: var(--e1); }
.lc-step > summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 30px 1fr auto; gap: 12px; align-items: center; padding: 16px 18px; border-radius: 14px; }
.lc-step > summary::-webkit-details-marker { display: none; }
.lc-step > summary:hover { background: var(--ds-canvas); }
.lc-step .n { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--ds-ink); color: #fff; font-size: 13.5px; font-weight: 700; }
.lc-step .tt { font-size: 16.5px; font-weight: 700; letter-spacing: -.015em; color: var(--ds-ink); display: grid; gap: 1px; word-break: keep-all; }
.lc-step .tt small { font-size: 13px; font-weight: 500; color: var(--ds-mist); }
.lc-gain { display: inline-flex; align-items: center; gap: 4px; height: 26px; padding: 0 10px; border-radius: 999px; background: var(--ds-amber-bg); color: var(--ds-amber-ink); font-size: 12.5px; font-weight: 700; white-space: nowrap; }
.lc-gain.part { background: var(--ds-blue-50); color: var(--ds-blue-700); }
.lc-gain.full { background: var(--ds-green-bg); color: var(--ds-green-ink); }
.lc-gain .ico { width: 14px; height: 14px; }
.lc-body { padding: 4px 18px 18px; display: grid; gap: 12px; }
.lc-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.lc-body .field { margin: 0; }
.lc-body .field label { margin-bottom: 6px; }
.lc-body .field label em { margin-left: 4px; }
.lc-ta { height: auto; min-height: 72px; padding: 10px 14px; line-height: 1.6; resize: vertical; }
.lc-hours { display: grid; gap: 6px; }
.lc-day { display: grid; grid-template-columns: 64px minmax(0, 1fr) 14px minmax(0, 1fr) 62px; gap: 8px; align-items: center; }
.lc-day .dn { font-size: 14.5px; font-weight: 650; color: var(--ds-ink-2); }
.lc-day .inp { height: 40px; padding: 0 10px; font-size: 15px; }
.lc-day .sep { text-align: center; color: var(--ds-mist); }
.lc-day.off .inp { background: var(--ds-canvas); color: var(--ds-faint); }
.lc-hnote { margin: 2px 0 0; font-size: 12.5px; line-height: 1.6; color: var(--ds-mist); }
.lc-day[data-d="hol"] { margin-top: 4px; padding-top: 10px; border-top: 1px dashed var(--ds-line); }
.lc-off { display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 10px; border: 1px solid var(--ds-line-2); border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 600; color: var(--ds-slate); background: #fff; }
.lc-off input { width: 16px; height: 16px; accent-color: var(--ds-red); margin: 0; }
.lc-day.off .lc-off { border-color: var(--ds-red-line); background: var(--ds-red-bg); color: var(--ds-red-ink); }
.lc-hbtn { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 0; }
.lc-items { display: grid; gap: 6px; }
.lc-it { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) 36px; gap: 8px; align-items: center; }
.lc-it .inp { height: 42px; }
.lc-rm { width: 36px; height: 36px; display: inline-grid; place-items: center; border: 0; border-radius: 8px; background: none; color: var(--ds-mist); cursor: pointer; }
.lc-rm:hover { background: var(--ds-canvas); color: var(--ds-red-ink); }
.lc-rm .ico { width: 16px; height: 16px; }
.lc-add { justify-self: start; display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 12px; border: 1px dashed var(--ds-line-2); border-radius: 8px; background: none; font: inherit; font-size: 14px; font-weight: 600; color: var(--ds-blue-700); cursor: pointer; }
.lc-add .ico { width: 15px; height: 15px; }
.lc-feat { display: flex; flex-wrap: wrap; gap: 8px; }
.lc-warn { padding: 12px 14px; border-radius: 10px; background: var(--ds-amber-bg); border: 1px solid var(--ds-amber-line); }
.lc-warn b { display: block; font-size: 13px; color: var(--ds-amber-ink); margin-bottom: 4px; }
.lc-warn p { margin: 0; font-size: 13.5px; line-height: 1.65; color: var(--ds-ink-2); word-break: keep-all; }
.lc-go { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-top: 6px; }
.lc-go span { font-size: 13px; color: var(--ds-mist); }

/* 오른쪽 점수 칸 */
.lc-side { position: sticky; top: 80px; border: 1px solid var(--ds-line-2); border-radius: 16px; background: #fff; box-shadow: var(--e2); padding: 20px; display: grid; gap: 16px; max-height: calc(100vh - 100px); overflow: auto; overscroll-behavior: contain; }
.lc-sc { display: grid; grid-template-columns: 92px 1fr; gap: 14px; align-items: center; }
.lc-ring { --c: var(--ds-red); position: relative; width: 92px; height: 92px; border-radius: 50%; background: conic-gradient(var(--c) calc(var(--p) * 1%), var(--ds-sunken) 0); display: grid; place-items: center; transition: background .3s; }
.lc-ring::before { content: ""; position: absolute; inset: 9px; border-radius: 50%; background: #fff; }
.lc-ring b, .lc-ring small { position: relative; }
.lc-ring b { font-size: 30px; font-weight: 800; letter-spacing: -.04em; line-height: 1; font-variant-numeric: tabular-nums; margin-top: 6px; }
.lc-ring small { margin-top: -18px; font-size: 11px; color: var(--ds-mist); }
.g-b .lc-ring { --c: var(--ds-blue-600); } .g-a .lc-ring { --c: var(--ds-green); } .g-c .lc-ring { --c: var(--ds-amber); }
.lc-k { margin: 0; font-size: 12.5px; font-weight: 700; color: var(--ds-blue-700); letter-spacing: .01em; }
.lc-grade { margin: 2px 0 0; font-size: 17px; font-weight: 750; letter-spacing: -.02em; color: var(--ds-ink); word-break: keep-all; }
.g-d .lc-grade { color: var(--ds-red-ink); } .g-c .lc-grade { color: var(--ds-amber-ink); }
.lc-qn { margin: 4px 0 0; font-size: 13.5px; color: var(--ds-slate); word-break: keep-all; }
.lc-qn b { color: var(--ds-ink); }
.lc-parts { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.lc-parts li { display: grid; grid-template-columns: 118px 1fr 46px; gap: 10px; align-items: center; font-size: 13px; color: var(--ds-ink-2); }
.lc-parts i { display: block; height: 6px; border-radius: 3px; background: var(--ds-sunken); position: relative; overflow: hidden; }
.lc-parts i::after { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--w); background: var(--ds-blue-600); border-radius: 3px; transition: width .3s; }
.lc-parts b { text-align: right; font-weight: 650; font-variant-numeric: tabular-nums; }
.lc-fill p { margin: 0 0 8px; font-size: 13px; font-weight: 700; color: var(--ds-ink); display: flex; gap: 6px; align-items: center; }
.lc-fill.done p { color: var(--ds-green-ink); }
.lc-fill .ico { width: 15px; height: 15px; }
.lc-fill > div { display: flex; flex-wrap: wrap; gap: 6px; }
.lc-tip { display: inline-flex; align-items: center; gap: 4px; height: 30px; padding: 0 10px; border: 1px solid var(--ds-blue-200); border-radius: 999px; background: var(--ds-blue-50); color: var(--ds-blue-700); font: inherit; font-size: 12.5px; font-weight: 650; cursor: pointer; }
.lc-tip:hover { border-color: var(--ds-blue-600); }
.lc-tip .ico { width: 13px; height: 13px; }
.lc-qs { border-top: 1px solid var(--ds-line); padding-top: 14px; }
.lc-qh { margin: 0 0 8px; font-size: 13px; font-weight: 700; color: var(--ds-ink); }
.lc-qs ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.lc-qs li { display: grid; grid-template-columns: 20px 1fr; gap: 8px; align-items: start; }
.lc-qs .m { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; margin-top: 1px; }
.lc-qs .m .ico { width: 12px; height: 12px; stroke-width: 3; }
.lc-qs li.ok .m { background: var(--ds-green-bg); color: var(--ds-green-ink); }
.lc-qs li.no .m { background: var(--ds-sunken); color: var(--ds-slate); }
.lc-qs li.miss .m { background: var(--ds-red-bg); color: var(--ds-red-ink); }
.lc-qs .t b { display: block; font-size: 13.5px; font-weight: 600; color: var(--ds-ink); line-height: 1.45; word-break: keep-all; }
.lc-qs .t small { display: block; font-size: 12px; color: var(--ds-mist); margin-top: 1px; }
.lc-qs li.miss .t small { color: var(--ds-red-ink); }
.lc-lk { border: 0; padding: 0; background: none; font: inherit; color: var(--ds-blue-700); font-weight: 650; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.lc-cta { display: grid; gap: 8px; }
.lc-cta .k-btn { width: 100%; justify-content: center; }
.lc-note { margin: 0; font-size: 12px; line-height: 1.6; color: var(--ds-mist); }
.lc-pill { display: none; }

@media (max-width: 1080px) {
  .lc { grid-template-columns: 1fr; }
  .lc-side { position: static; max-height: none; overflow: visible; }   /* 휴대폰 · 태블릿: 입력 칸이 먼저, 점수는 위에 붙는 알약으로 */
  .lc-pill:not([hidden]) { pointer-events: none; position: sticky; top: 64px; z-index: 30; display: flex; align-items: center; gap: 10px; margin: 0; padding: 8px 14px; border-radius: 999px; background: rgba(11, 23, 51, .94); color: #fff; font-size: 13px; box-shadow: var(--e2); justify-self: center; }
  .lc-pill b { font-size: 15px; }
  .lc-pill .q { color: #AFC2EA; }
}
@media (max-width: 640px) {
  .lc-row { grid-template-columns: 1fr; }
  .lc-step > summary { grid-template-columns: 28px 1fr; padding: 14px; }
  .lc-step .lc-gain { grid-column: 2; justify-self: start; }
  .lc-body { padding: 2px 14px 16px; }
  .lc-day { grid-template-columns: 44px minmax(0, 1fr) 10px minmax(0, 1fr) 54px; gap: 5px; }
  .lc-day .inp { padding: 0 6px; font-size: 14px; }
  .lc-off { padding: 0 7px; font-size: 13px; gap: 4px; }
  .lc-parts li { grid-template-columns: 104px 1fr 42px; }
  .lc-side { padding: 16px; }
}

/* 결과물 */
.lc-out { margin-top: 24px; border: 1px solid var(--ds-line-2); border-radius: 16px; background: #fff; box-shadow: var(--e1); padding: 22px; scroll-margin-top: 72px; }
.lc-out-h { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 20px; align-items: flex-end; margin-bottom: 14px; }
.lc-out-h .k-h3 { margin: 4px 0 0; }
.lc-out-a { display: flex; gap: 8px; flex-wrap: wrap; }
.lc-tabs { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; border-bottom: 1px solid var(--ds-line); margin: 0 -4px 16px; padding: 0 4px; }
.lc-tabs::-webkit-scrollbar { display: none; }
.lc-tabs button { flex: 0 0 auto; height: 40px; padding: 0 12px; border: 0; border-bottom: 2px solid transparent; background: none; font: inherit; font-size: 14.5px; font-weight: 600; color: var(--ds-slate); cursor: pointer; margin-bottom: -1px; }
.lc-tabs button[aria-selected="true"] { color: var(--ds-ink); border-bottom-color: var(--ds-blue-600); }
/* 휴대폰: 탭 7개가 화면 밖으로 숨지 않게 두 줄 칩으로 */
@media (max-width: 640px) {
  .lc-tabs { flex-wrap: wrap; overflow: visible; gap: 6px; border-bottom: 0; margin: 0 0 14px; padding: 0; }
  .lc-tabs button { height: 34px; padding: 0 12px; border: 1px solid var(--ds-line-2); border-radius: 999px; margin: 0; font-size: 13.5px; }
  .lc-tabs button[aria-selected="true"] { border-color: var(--ds-ink); background: var(--ds-ink); color: #fff; }
}
.lc-pn { margin: 0 0 12px; font-size: 14px; line-height: 1.65; color: var(--ds-slate); word-break: keep-all; }
.lc-pn b { color: var(--ds-ink); }
.lc-code { margin: 0; max-height: 420px; overflow: auto; padding: 14px 16px; border-radius: 10px; background: var(--ds-console); color: var(--ds-console-ink); font: 12.5px/1.6 var(--ds-mono); white-space: pre-wrap; word-break: break-all; }
.lc-row-b { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.lc-frame { border: 1px solid var(--ds-line-2); border-radius: 12px; overflow: hidden; background: var(--ds-canvas); }
.lc-frame .k-screen-bar { border-bottom: 1px solid var(--ds-line); }
.lc-frame iframe { display: block; width: 100%; height: 640px; border: 0; background: #F6F8FB; }
.lc-faq { border-top: 1px solid var(--ds-line); }
.lc-faq details { border-bottom: 1px solid var(--ds-line); }
.lc-faq summary { cursor: pointer; padding: 12px 2px; font-size: 15px; font-weight: 650; color: var(--ds-ink); word-break: keep-all; }
.lc-faq p { margin: 0 0 12px; font-size: 14.5px; line-height: 1.7; color: var(--ds-ink-2); word-break: keep-all; }
.lc-miss { margin-top: 14px; padding: 14px 16px; border-radius: 10px; background: var(--ds-red-bg); border: 1px solid var(--ds-red-line); }
.lc-miss p { margin: 0 0 6px; font-size: 14px; color: var(--ds-red-ink); }
.lc-miss ul { margin: 0; padding-left: 18px; display: grid; gap: 4px; font-size: 14px; color: var(--ds-ink-2); }
.lc-same { margin: 0; padding: 0; list-style: none; counter-reset: s; display: grid; gap: 10px; }
.lc-same > li { counter-increment: s; position: relative; padding: 14px 16px 14px 52px; border: 1px solid var(--ds-line); border-radius: 12px; }
.lc-same > li::before { content: counter(s); position: absolute; left: 14px; top: 14px; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--ds-ink); color: #fff; font-size: 13px; font-weight: 700; }
.lc-same > li.done::before { background: var(--ds-green); }
.lc-same > li > div { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.lc-same b { font-size: 15.5px; }
.lc-same .ok { display: inline-flex; gap: 4px; align-items: center; font-size: 12.5px; font-weight: 700; color: var(--ds-green-ink); }
.lc-same .ok .ico { width: 14px; height: 14px; }
.lc-same p { margin: 4px 0 6px; font-size: 14px; line-height: 1.65; color: var(--ds-slate); word-break: keep-all; }
.lc-same ul { margin: 0 0 6px; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 6px; }
.lc-same ul li { padding: 3px 9px; border-radius: 6px; background: var(--ds-canvas); font-size: 12.5px; color: var(--ds-ink-2); }
.lc-same .k-a { font-size: 14px; }
.lc-same .k-a .ico { width: 14px; height: 14px; }
.lc-chk { margin-top: 12px; }
.lc-chk-ok { display: flex; gap: 10px; padding: 14px 16px; border-radius: 10px; background: var(--ds-green-bg); border: 1px solid var(--ds-green-line); }
.lc-chk-ok .ico { width: 20px; height: 20px; color: var(--ds-green-ink); flex: 0 0 auto; margin-top: 2px; }
.lc-chk-ok b { color: var(--ds-green-ink); }
.lc-chk-ok p { margin: 2px 0 0; font-size: 13.5px; color: var(--ds-ink-2); }
.lc-fd { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.lc-fd li { padding: 12px 14px; border: 1px solid var(--ds-amber-line); border-radius: 10px; background: var(--ds-amber-bg); }
.lc-fd li.lv3 { border-color: var(--ds-red-line); background: var(--ds-red-bg); }
.lc-fd li.fixed { opacity: .6; }
.lc-fd div { display: flex; gap: 8px; align-items: center; }
.lc-fd .sv { padding: 1px 8px; border-radius: 999px; background: #fff; font-size: 12px; font-weight: 700; color: var(--ds-amber-ink); }
.lc-fd li.lv3 .sv { color: var(--ds-red-ink); }
.lc-fd q { font-weight: 700; color: var(--ds-ink); }
.lc-fd p { margin: 6px 0 0; font-size: 13.5px; line-height: 1.6; color: var(--ds-ink-2); }
.lc-fd .ok { display: inline-flex; gap: 4px; align-items: center; font-weight: 700; color: var(--ds-green-ink); }
.lc-fd .ok .ico { width: 14px; height: 14px; }
@media (max-width: 640px) { .lc-out { padding: 16px; } .lc-frame iframe { height: 560px; } }

/* ---------- 진행 순서(결제 뒤) ---------- */
.lc-flow { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; counter-reset: f; }
.lc-flow li { counter-increment: f; position: relative; padding: 18px 16px; border: 1px solid var(--ds-line); border-radius: 14px; background: #fff; }
.lc-flow li::before { content: counter(f); display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--ds-blue-600); color: #fff; font-size: 13px; font-weight: 700; }
.lc-flow b { display: block; margin: 12px 0 6px; font-size: 15.5px; font-weight: 700; letter-spacing: -.015em; word-break: keep-all; }
.lc-flow span { display: block; font-size: 13.5px; line-height: 1.65; color: var(--ds-slate); word-break: keep-all; }
.lc-flow em { display: inline-block; margin-top: 10px; padding: 1px 8px; border-radius: 999px; background: var(--ds-green-bg); color: var(--ds-green-ink); font-style: normal; font-size: 12px; font-weight: 700; }
@media (max-width: 1080px) { .lc-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .lc-flow { grid-template-columns: 1fr; } }

/* ---------- 업종 카드 ---------- */
.lc-inds { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.lc-inds a { display: grid; gap: 6px; align-content: start; padding: 16px; border: 1px solid var(--ds-line); border-radius: 14px; background: #fff; text-decoration: none; color: var(--ds-ink); transition: border-color .12s, box-shadow .12s; }
.lc-inds a:hover { border-color: var(--ds-blue-600); box-shadow: var(--e1); color: var(--ds-ink); }
.lc-inds b { font-size: 16px; font-weight: 700; letter-spacing: -.015em; }
.lc-inds span { font-size: 13px; line-height: 1.55; color: var(--ds-slate); word-break: keep-all; }
.lc-inds em { font-style: normal; font-size: 12.5px; font-weight: 650; color: var(--ds-blue-700); }
@media (max-width: 1080px) { .lc-inds { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 720px) { .lc-inds { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---------- 업종 페이지: 손님 질문 · 필요한 정보 ---------- */
.lc-ql { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.lc-ql li { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border: 1px solid var(--ds-line); border-radius: 12px; background: #fff; font-size: 15px; font-weight: 600; color: var(--ds-ink); word-break: keep-all; }
.lc-ql li::before { content: "Q"; flex: 0 0 auto; display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; background: var(--ds-ink); color: #fff; font-size: 12px; font-weight: 700; }
.lc-ql li small { display: block; margin-top: 2px; font-size: 12.5px; font-weight: 500; color: var(--ds-mist); }
@media (max-width: 720px) { .lc-ql { grid-template-columns: 1fr; } }

/* ---------- 첫 화면 구획 ---------- */
.lc-home .lc-home-in { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 48px; align-items: center; }
.lc-home .lp-chips { margin-top: 18px; }
@media (max-width: 920px) { .lc-home .lc-home-in { grid-template-columns: 1fr; gap: 28px; } }
@media (prefers-reduced-motion: reduce) { .lc-ai-body, .lc-ring, .lc-parts i::after { transition: none; } }

/* ---------- 13.9b 30초 AI 검색 진단(창): 질문 5~7개 → 빈틈을 빨갛게, 크게 ---------- */
html.lq-on, html.lq-on body { overflow: hidden; }
.lq { position: fixed; inset: 0; z-index: 2147482400; display: flex; align-items: center; justify-content: center; padding: 20px; background: rgba(11, 23, 51, .55); animation: lqIn .18s ease; }
@keyframes lqIn { from { opacity: 0; } }
.lq-in { position: relative; width: 100%; max-width: 600px; max-height: calc(100vh - 40px); display: flex; flex-direction: column; border-radius: 22px; background: #fff; box-shadow: 0 40px 100px rgba(8, 20, 47, .45); overflow: hidden; }
.lq-top { position: relative; flex: 0 0 auto; padding: 16px 60px 14px 22px; border-bottom: 1px solid var(--ds-line); background: #fff; }
.lq-k { margin: 0; display: flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 750; color: var(--ds-ink); }
.lq-k .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ds-red); box-shadow: 0 0 0 4px var(--ds-red-bg); }
.lq-ind { font-weight: 600; color: var(--ds-mist); }
.lq-x { position: absolute; top: 8px; right: 10px; width: 44px; height: 44px; display: inline-grid; place-items: center; border: 0; border-radius: 10px; background: none; color: var(--ds-slate); cursor: pointer; }
.lq-x:hover { background: var(--ds-canvas); }
.lq-x .ico { width: 18px; height: 18px; }
.lq-bar { position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; }
.lq-bar i { display: block; height: 100%; width: 0; background: var(--ds-blue-600); transition: width .3s ease; }
.lq-body { flex: 1 1 auto; overflow: auto; overscroll-behavior: contain; padding: 26px 24px 24px; outline: 0; }
.lq-n { margin: 0; font-size: 13px; font-weight: 700; color: var(--ds-blue-700); }
.lq-q { margin: 8px 0 0; font-size: clamp(21px, 2.6vw, 25px); line-height: 1.38; font-weight: 800; letter-spacing: -.03em; color: var(--ds-ink); word-break: keep-all; }
.lq-h { margin: 8px 0 0; font-size: 14.5px; line-height: 1.6; color: var(--ds-slate); word-break: keep-all; }
.lq-o { display: grid; gap: 10px; margin-top: 22px; }
.lq-o button { display: grid; grid-template-columns: 28px 1fr 18px; gap: 12px; align-items: center; min-height: 58px; padding: 12px 16px; border: 1.5px solid var(--ds-line-2); border-radius: 14px; background: #fff; font: inherit; font-size: 16.5px; font-weight: 700; color: var(--ds-ink); text-align: left; cursor: pointer; word-break: keep-all; transition: border-color .15s, background .15s, transform .1s; }
.lq-o button:hover, .lq-o button:focus-visible { border-color: var(--ds-blue-600); background: var(--ds-blue-50); outline: 0; }
.lq-o button:active { transform: scale(.99); }
.lq-o .no { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: var(--ds-canvas); color: var(--ds-mist); font-size: 13px; font-weight: 700; }
.lq-o .ico { width: 18px; height: 18px; color: var(--ds-faint); }
.lq-back { margin-top: 16px; padding: 6px 0; border: 0; background: none; font: inherit; font-size: 14px; font-weight: 600; color: var(--ds-mist); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.lq-wait { display: grid; justify-items: center; gap: 10px; padding: 52px 0; text-align: center; }
.lq-wait p { margin: 0; font-size: 17px; font-weight: 750; color: var(--ds-ink); }
.lq-wait small { font-size: 13.5px; color: var(--ds-mist); word-break: keep-all; }
.lq-wait .spin { width: 30px; height: 30px; border-radius: 50%; border: 3px solid var(--ds-blue-100); border-top-color: var(--ds-blue-600); animation: lqSpin .8s linear infinite; }
@keyframes lqSpin { to { transform: rotate(360deg); } }

/* 결과: 머리(어두운 바탕 · 위험 정도) */
.lq-r { margin: -26px -24px 0; padding: 26px 24px 22px; color: #fff; background: radial-gradient(120% 90% at 100% 0, rgba(229, 72, 77, .34), transparent 60%), var(--ds-ink); }
.lq-r.g-c { background: radial-gradient(120% 90% at 100% 0, rgba(217, 122, 6, .34), transparent 60%), var(--ds-ink); }
.lq-r.g-b, .lq-r.g-a { background: radial-gradient(120% 90% at 100% 0, rgba(11, 99, 246, .38), transparent 60%), var(--ds-ink); }
.lq-rh { display: grid; grid-template-columns: 104px 1fr; gap: 18px; align-items: center; }
.lq-ring { --c: #FF5A5F; position: relative; width: 104px; height: 104px; border-radius: 50%; background: conic-gradient(var(--c) calc(var(--p) * 1%), rgba(255, 255, 255, .13) 0); display: grid; place-items: center; }
.lq-ring::before { content: ""; position: absolute; inset: 9px; border-radius: 50%; background: var(--ds-ink); }
.lq-ring b, .lq-ring small { position: relative; }
.lq-ring b { font-size: 36px; font-weight: 850; letter-spacing: -.04em; line-height: 1; font-variant-numeric: tabular-nums; margin-top: 8px; }
.lq-ring small { margin-top: -22px; font-size: 11.5px; color: rgba(255, 255, 255, .62); }
.g-c .lq-ring { --c: #FFB020; } .g-b .lq-ring { --c: #4F9BFF; } .g-a .lq-ring { --c: #2BD38A; }
.lq-lv { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; font-weight: 650; color: rgba(255, 255, 255, .74); }
.lq-lv span { display: inline-flex; align-items: center; height: 26px; padding: 0 11px; border-radius: 999px; background: #C9252C; color: #fff; font-size: 13.5px; font-weight: 850; letter-spacing: .04em; }
.g-d .lq-lv span { animation: lqPulse 1.6s ease-in-out infinite; }
@keyframes lqPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(229, 72, 77, .65); } 50% { box-shadow: 0 0 0 9px rgba(229, 72, 77, 0); } }
.g-c .lq-lv span { background: #FFB020; color: var(--ds-ink); } .g-b .lq-lv span { background: var(--ds-blue-600); } .g-a .lq-lv span { background: var(--ds-green-ink); }
.lq-t { margin: 8px 0 0; font-size: clamp(19px, 2.4vw, 23px); line-height: 1.4; font-weight: 800; letter-spacing: -.03em; color: #fff; word-break: keep-all; }
.lq-s { margin: 16px 0 0; font-size: 14.5px; line-height: 1.7; color: rgba(255, 255, 255, .84); word-break: keep-all; }
.lq-s b { color: #fff; font-weight: 850; }
.g-d .lq-s b { color: #FF9A9D; }
.lq-cells { display: flex; gap: 4px; margin-top: 14px; }
.lq-cells i { flex: 1 1 0; height: 10px; border-radius: 3px; }
.lq-cells .v0, .lq-leg .v0::before { background: #FF5A5F; }
.lq-cells .v1, .lq-leg .v1::before { background: #FFB020; }
.lq-cells .v2, .lq-leg .v2::before { background: #2BD38A; }
.lq-leg { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 10px 0 0; font-size: 12.5px; color: rgba(255, 255, 255, .78); }
.lq-leg span { display: inline-flex; align-items: center; gap: 6px; }
.lq-leg span::before { content: ""; width: 8px; height: 8px; border-radius: 2px; }

/* 결과: 빈틈 · 예시 답변 · 질문 · 단추 */
.lq-g, .lq-qs, .lq-cta, .lq-chat { margin-top: 22px; }
.lq-g h3, .lq-qs h3 { margin: 0 0 10px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 16.5px; font-weight: 800; letter-spacing: -.02em; color: var(--ds-ink); }
.lq-g h3 b { color: var(--ds-red-ink); }
.lq-g h3 em { font-style: normal; height: 22px; display: inline-flex; align-items: center; padding: 0 8px; border-radius: 999px; background: var(--ds-red-bg); color: var(--ds-red-ink); font-size: 12px; font-weight: 750; }
.lq-g ol { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.lq-g li { display: grid; grid-template-columns: 26px 1fr; gap: 10px; padding: 12px 14px; border: 1px solid var(--ds-red-line); border-left: 4px solid var(--ds-red); border-radius: 12px; background: #FFF7F7; }
.lq-g li.lv1 { border-color: var(--ds-amber-line); border-left-color: var(--ds-amber); background: #FFFBF3; }
.lq-g .m { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--ds-red); color: #fff; font-size: 14px; font-weight: 850; }
.lq-g .lv1 .m { background: var(--ds-amber); }
.lq-g .m .ico { width: 14px; height: 14px; stroke-width: 3; }
.lq-g b { display: block; font-size: 15px; font-weight: 750; line-height: 1.45; color: var(--ds-ink); word-break: keep-all; }
.lq-g p { margin: 3px 0 0; font-size: 13.5px; line-height: 1.6; color: var(--ds-slate); word-break: keep-all; }
.lq-chat { padding: 16px; border: 1px solid var(--ds-line-2); border-radius: 16px; background: var(--ds-canvas); display: grid; gap: 10px; }
.lq-chat-h { margin: 0; display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; justify-content: space-between; }
.lq-chat-h b { font-size: 15px; font-weight: 800; color: var(--ds-ink); word-break: keep-all; }
.lq-chat-h em { font-style: normal; font-size: 11.5px; font-weight: 700; color: var(--ds-mist); padding: 2px 8px; border: 1px solid var(--ds-line-2); border-radius: 999px; background: #fff; }
.lq-chat .lc-q { max-width: 92%; }
.lq-cs { margin-left: 34px; display: grid; gap: 6px; }
.lq-c { display: grid; gap: 1px; padding: 9px 12px; border: 1px solid var(--ds-line); border-radius: 10px; background: #fff; }
.lq-c b { font-size: 14px; font-weight: 750; color: var(--ds-ink); }
.lq-c span { font-size: 12.5px; color: var(--ds-green-ink); }
.lq-c.no { border: 1.5px dashed var(--ds-red); background: #FFF5F5; }
.lq-c.no b { color: var(--ds-red-ink); text-decoration: line-through; text-decoration-thickness: 1.5px; }
.lq-c.no span { color: var(--ds-red-ink); font-weight: 650; }
.lq-chat-f { margin: 0; font-size: 12.5px; color: var(--ds-mist); line-height: 1.6; word-break: keep-all; }
.lq-qs ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.lq-qs li { display: grid; grid-template-columns: 22px 1fr; gap: 9px; align-items: start; font-size: 14px; font-weight: 600; color: var(--ds-ink); line-height: 1.45; word-break: keep-all; }
.lq-qs li small { display: block; font-size: 12px; font-weight: 500; color: var(--ds-mist); margin-top: 1px; }
.lq-qs .m { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; font-size: 12px; font-weight: 850; }
.lq-qs .m .ico { width: 12px; height: 12px; stroke-width: 3; }
.lq-qs .v2 .m { background: var(--ds-green-bg); color: var(--ds-green-ink); }
.lq-qs .v1 .m { background: var(--ds-amber-bg); color: var(--ds-amber-ink); }
.lq-qs .v0 .m { background: var(--ds-red-bg); color: var(--ds-red-ink); }
.lq-qs .v0 small { color: var(--ds-red-ink); }
.lq-cta { padding: 20px; border-radius: 16px; background: var(--ds-blue-50); border: 1px solid var(--ds-blue-200); }
.lq-cta h3 { margin: 0; font-size: 19px; font-weight: 850; letter-spacing: -.03em; color: var(--ds-ink); word-break: keep-all; }
.lq-cta > p { margin: 6px 0 0; font-size: 14px; line-height: 1.65; color: var(--ds-ink-2); word-break: keep-all; }
.lq-btns { display: grid; gap: 8px; margin-top: 14px; }
.lq-btns .k-btn { width: 100%; justify-content: center; }
.lq-btns em { font-style: normal; margin-left: 8px; height: 22px; display: inline-flex; align-items: center; padding: 0 8px; border-radius: 999px; background: rgba(255, 255, 255, .22); font-size: 12px; font-weight: 750; }
.lq-fine { margin: 10px 0 0; font-size: 12.5px; line-height: 1.6; color: var(--ds-slate); text-align: center; word-break: keep-all; }
.lq-more { margin: 12px 0 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; }
.lq-more .k-a { border: 0; background: none; padding: 6px 0; font: inherit; font-size: 14px; font-weight: 650; cursor: pointer; display: inline-flex; align-items: center; gap: 4px; }
.lq-more .ico { width: 15px; height: 15px; }
.lq-note { margin: 16px 0 0; font-size: 12px; line-height: 1.65; color: var(--ds-mist); word-break: keep-all; }
.lc-ql-go { margin: 18px 0 0; }
@media (max-width: 640px) {
  .lq { padding: 0; align-items: stretch; }
  .lq-in { max-width: none; max-height: none; height: 100%; border-radius: 0; }
  .lq-body { padding: 22px 18px 28px; }
  .lq-r { margin: -22px -18px 0; padding: 22px 18px 20px; }
  .lq-rh { grid-template-columns: 88px 1fr; gap: 14px; }
  .lq-ring { width: 88px; height: 88px; }
  .lq-ring b { font-size: 30px; }
  .lq-cs { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) { .lq, .g-d .lq-lv span, .lq-wait .spin { animation: none; } .lq-bar i, .lq-o button { transition: none; } }
.lq-why { margin: 14px 0 0; padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, .12); font-size: 13px; line-height: 1.6; color: rgba(255, 255, 255, .8); word-break: keep-all; }
.lq-why cite { margin-left: 6px; font-style: normal; font-size: 11.5px; color: rgba(255, 255, 255, .55); }
.lq-foot { flex: 0 0 auto; padding: 12px 24px calc(12px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--ds-line); background: #fff; box-shadow: 0 -10px 24px -14px rgba(11, 23, 51, .28); transition: opacity .2s, transform .2s; }
.lq-foot.off { opacity: 0; transform: translateY(6px); pointer-events: none; }
.lq-foot[hidden] { display: none; }
.lq-foot .k-btn { width: 100%; height: 52px; justify-content: space-between; padding: 0 18px; font-size: 16px; }
.lq-foot .k-btn b { font-weight: 800; }
@media (max-width: 640px) { .lq-foot { padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px)); } }