/* AI 홈페이지 검색 진단 — 이 도구의 화면은 전부 여기서 그린다.
   ⚠️ Tailwind 유틸을 새로 쓰지 마라. css/tw.css 는 빌드본이라 빌드에 없는 클래스는 먹지 않는다
      (2026-09-06 에 px-7 · bg-rose-50 이 실제로 안 먹어 버튼 패딩과 배지 색이 깨졌다). */

.sc-wrap{max-width:1080px;margin:0 auto;padding:0 24px}
.sc-hero{padding:112px 0 40px;background:linear-gradient(180deg,#f8fafc 0%,#fff 100%)}
.sc-eyebrow{font-size:12px;font-weight:800;letter-spacing:.2em;color:#94a3b8;margin:0 0 12px}
.sc-h1{font-size:clamp(26px,3.4vw,38px);font-weight:800;color:#0f172a;line-height:1.35;margin:0 0 16px;word-break:keep-all}
.sc-lead{font-size:16px;color:#475569;line-height:1.75;margin:0;max-width:62ch;word-break:keep-all}
.sc-lead b{color:#0f172a;font-weight:700}

/* 입력 */
.sc-form{margin-top:32px;max-width:720px}
.sc-label{display:block;font-size:14px;font-weight:700;color:#334155;margin-bottom:8px}
.sc-row{display:flex;gap:12px;align-items:stretch}
.sc-input{flex:1;min-width:0;border:1px solid #cbd5e1;border-radius:12px;padding:14px 16px;
  font-size:15px;color:#0f172a;background:#fff;outline:none;transition:border-color .15s,box-shadow .15s}
.sc-input::placeholder{color:#94a3b8}
.sc-input:focus{border-color:#0f172a;box-shadow:0 0 0 3px rgba(15,23,42,.08)}
.sc-btn{flex:0 0 auto;border:0;border-radius:12px;background:#0f172a;color:#fff;
  font-size:15px;font-weight:800;padding:14px 30px;cursor:pointer;transition:background .15s,transform .1s}
.sc-btn:hover{background:#1e293b}
.sc-btn:active{transform:translateY(1px)}
.sc-btn:disabled{opacity:.55;cursor:not-allowed}
.sc-note{margin:12px 0 0;font-size:13px;color:#64748b}
.sc-msg{margin-top:20px;border-radius:12px;border:1px solid #e2e8f0;background:#f8fafc;color:#475569;padding:14px 16px;font-size:14px}
.sc-msg.bad{border-color:#fecdd3;background:#fff1f2;color:#9f1239}
@media (max-width:640px){.sc-row{flex-direction:column}.sc-btn{padding:14px 20px}}

/* 결과 요약 */
.sc-out{padding:8px 0 72px;background:#fff}
.sc-summary{border-radius:20px;border:1px solid #e2e8f0;padding:28px;
  background:linear-gradient(180deg,#f8fafc 0%,#fff 100%);box-shadow:0 10px 30px -18px rgba(15,23,42,.35)}
.sc-summary h2{font-size:clamp(21px,2.4vw,28px);font-weight:800;color:#0f172a;margin:8px 0 0;line-height:1.4;word-break:keep-all}
.sc-summary p{margin:12px 0 0;color:#475569;line-height:1.75;word-break:keep-all}
.sc-target{margin-top:16px;font-size:13px;color:#94a3b8;word-break:break-all}
.sc-tally{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.sc-tally span{font-size:13px;font-weight:800;border-radius:999px;padding:6px 14px;border:1px solid}
.sc-tally .ok{color:#047857;background:#ecfdf5;border-color:#a7f3d0}
.sc-tally .warn{color:#b45309;background:#fffbeb;border-color:#fde68a}
.sc-tally .miss{color:#be123c;background:#fff1f2;border-color:#fecdd3}

/* 검사 항목 — 입체 카드 */
.sc-group{margin-top:40px}
.sc-group-head{display:flex;align-items:baseline;gap:10px;margin-bottom:4px}
.sc-group-head h3{font-size:19px;font-weight:800;color:#0f172a;margin:0}
.sc-group-head em{font-style:normal;font-size:12px;font-weight:800;letter-spacing:.14em;color:#94a3b8}
.sc-group-sub{margin:0 0 18px;font-size:14px;color:#64748b;line-height:1.7;word-break:keep-all}
.sc-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media (max-width:860px){.sc-cards{grid-template-columns:1fr}}

.sc-card{position:relative;border-radius:16px;border:1px solid #e2e8f0;background:#fff;
  padding:20px 22px 20px 26px;box-shadow:0 8px 20px -14px rgba(15,23,42,.4);
  transition:transform .15s,box-shadow .15s}
.sc-card:hover{transform:translateY(-2px);box-shadow:0 16px 32px -18px rgba(15,23,42,.45)}
.sc-card:before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:4px;border-radius:0 4px 4px 0}
.sc-card.ok:before{background:#10b981}
.sc-card.warn:before{background:#f59e0b}
.sc-card.miss:before{background:#f43f5e}
.sc-card-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.sc-card-name{font-size:15px;font-weight:800;color:#0f172a}
.sc-badge{flex:0 0 auto;font-size:12px;font-weight:800;border-radius:999px;padding:4px 11px;border:1px solid}
.sc-badge.ok{color:#047857;background:#ecfdf5;border-color:#a7f3d0}
.sc-badge.warn{color:#b45309;background:#fffbeb;border-color:#fde68a}
.sc-badge.miss{color:#be123c;background:#fff1f2;border-color:#fecdd3}
.sc-val{margin:0;font-size:14px;color:#334155;word-break:break-all;line-height:1.6}
.sc-why{margin:10px 0 0;font-size:13px;color:#64748b;line-height:1.7;word-break:keep-all}

/* 해결책 — 프롬프트 */
.sc-fix{margin-top:44px;border-radius:20px;background:#0b1220;border:1px solid #1e293b;padding:30px 28px;
  box-shadow:0 20px 40px -24px rgba(2,6,23,.8)}
.sc-fix .sc-eyebrow{color:#64748b}
.sc-fix h3{font-size:clamp(19px,2.2vw,25px);font-weight:800;color:#fff;margin:0 0 12px;line-height:1.4;word-break:keep-all}
.sc-fix p{margin:0;color:#cbd5e1;font-size:14px;line-height:1.8;word-break:keep-all}
.sc-prompt{white-space:pre-wrap;word-break:break-all;background:#020617;color:#e2e8f0;
  border:1px solid #1e293b;border-radius:14px;padding:18px 20px;margin:20px 0 0;font-size:13.5px;line-height:1.8;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;max-height:420px;overflow:auto}
.sc-copy{margin-top:18px;border:0;border-radius:12px;background:#fff;color:#0f172a;
  font-size:15px;font-weight:800;padding:14px 28px;cursor:pointer;transition:background .15s}
.sc-copy:hover{background:#e2e8f0}
.sc-copied{margin-left:12px;font-size:14px;color:#94a3b8}

/* 다음 단계 — 카드 + 화살표 */
.sc-steps{margin-top:44px}
.sc-steps h3{font-size:19px;font-weight:800;color:#0f172a;margin:0 0 6px}
.sc-steps>p{margin:0 0 20px;font-size:14px;color:#64748b;line-height:1.7;word-break:keep-all}
.sc-flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:stretch;gap:12px}
.sc-step{border-radius:16px;border:1px solid #e2e8f0;background:#fff;padding:22px 20px;
  box-shadow:0 8px 20px -14px rgba(15,23,42,.4)}
.sc-step-n{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;
  border-radius:999px;background:#0f172a;color:#fff;font-size:13px;font-weight:800;margin-bottom:12px}
.sc-step h4{font-size:15px;font-weight:800;color:#0f172a;margin:0 0 8px;word-break:keep-all}
.sc-step p{margin:0;font-size:13.5px;color:#64748b;line-height:1.75;word-break:keep-all}
.sc-step a{color:#334155;font-weight:700;text-decoration:underline;text-underline-offset:3px;text-decoration-color:#cbd5e1}
.sc-step a:hover{color:#0f172a}
.sc-arrow{align-self:center;color:#cbd5e1;font-size:26px;line-height:1;font-weight:800;user-select:none}
@media (max-width:860px){
  .sc-flow{grid-template-columns:1fr}
  .sc-arrow{transform:rotate(90deg);justify-self:center;margin:2px 0}
}

/* 마지막 안내 */
.sc-tail{margin-top:44px;border-radius:20px;border:1px solid #e2e8f0;background:#f8fafc;padding:28px}
.sc-tail h3{font-size:18px;font-weight:800;color:#0f172a;margin:0 0 12px}
.sc-tail p{margin:0 0 12px;color:#475569;line-height:1.8;word-break:keep-all}
.sc-tail p:last-child{margin-bottom:0}
.sc-tail a{color:#334155;font-weight:700;text-decoration:underline;text-underline-offset:4px;text-decoration-color:#cbd5e1}
.sc-tail a:hover{color:#0f172a}
.sc-hidden{display:none}

/* noindex 처럼 「일부러 그런 것일 수 있는」 상태를 먼저 알린다.
   ⚠️ 이 안내 없이 빨강만 늘어놓으면 이전 안내 페이지·준비중 화면을 검사한 사람이 놀란다(2026-09-06). */
.sc-flag{margin-top:20px;border-radius:14px;border:1px solid #fde68a;background:#fffbeb;
  color:#92400e;padding:16px 18px;font-size:14px;line-height:1.75;word-break:keep-all}
.sc-tally .skip{color:#475569;background:#f1f5f9;border-color:#cbd5e1}
.sc-badge.skip{color:#475569;background:#f1f5f9;border-color:#cbd5e1}
.sc-card.skip{opacity:.72}
.sc-card.skip:before{background:#cbd5e1}

/* 하단 — 검사 결과가 아니라 「우리가 무엇을 파는가」를 보여 주는 자리 */
.sc-gives{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.sc-gives li{position:relative;padding-left:26px;font-size:14px;color:#334155;line-height:1.65;word-break:keep-all}
.sc-gives li:before{content:"";position:absolute;left:2px;top:7px;width:14px;height:14px;border-radius:999px;background:#0f172a}
.sc-gives li:after{content:"";position:absolute;left:6px;top:11px;width:6px;height:3px;border-left:1.5px solid #fff;
  border-bottom:1.5px solid #fff;transform:rotate(-45deg)}
@media (max-width:720px){.sc-gives{grid-template-columns:1fr}}
.sc-cta{display:inline-block;margin-top:22px;border-radius:12px;background:#0f172a;color:#fff;
  font-size:15px;font-weight:800;padding:14px 28px;text-decoration:none;transition:background .15s}
.sc-cta:hover{background:#1e293b;color:#fff}
/* ⚠️ .sc-tail a 가 구체성에서 이겨 글자색을 덮어 배경에 묻혔다(2026-09-06). 셀렉터를 맞춰 둔다. */
.sc-tail a.sc-cta{color:#fff;text-decoration:none}
.sc-tail a.sc-cta:hover{color:#fff;text-decoration:none}
.sc-tail-note{margin-top:16px !important;font-size:13.5px;color:#64748b}
/* 검사 범위 — 「사이트 전체를 봐 주는 줄 알았다」를 막는 자리(2026-09-06 대표님 지시) */
.sc-scope{margin:16px 0 0;font-size:14px;color:#92400e;background:#fffbeb;border:1px solid #fde68a;
  border-radius:12px;padding:14px 16px;line-height:1.75;max-width:62ch;word-break:keep-all}
.sc-scope b{color:#78350f}