/* 무료 사이트 진단 페이지 전용 스타일 (style.css 변수 재사용) */

.diag-hero{position:relative}
.diag-hero .hero-keywords{list-style:none;padding:0}
.diag-hero .hero-keywords li{list-style:none;margin:0;padding:0}
.diag-form-card{
  margin-top:34px;max-width:640px;background:#fff;border:1px solid var(--line);border-radius:18px;
  padding:10px;display:flex;gap:10px;box-shadow:0 18px 44px rgba(15,49,54,.10);
}
.diag-form-card .input{border:0;min-height:46px}
.diag-form-card .input:focus{box-shadow:none}
.diag-form-card .btn{flex-shrink:0}
@media(max-width:560px){.diag-form-card{flex-direction:column;padding:12px}.diag-form-card .btn{width:100%}}

.diag-hero-note{margin-top:14px;font-size:13px;color:var(--muted);display:flex;align-items:center;gap:7px}
.diag-hero-note svg{width:15px;height:15px;flex-shrink:0;stroke:var(--teal-dark);fill:none;stroke-width:2.2}

.diag-result-wrap{padding-top:56px}
.diag-result{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);
  padding:32px;max-width:760px;margin:0 auto;position:relative;min-height:360px;
}
.diag-result-top{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}
.diag-target{font-size:12.5px;color:#8aa0a2}
.diag-target b{display:block;margin-top:2px;font-size:16px;color:var(--ink);font-weight:800;word-break:break-all}
.diag-tag-example{font-size:11px;font-weight:800;letter-spacing:.03em;color:var(--teal-dark);background:#eaf6f4;border-radius:999px;padding:5px 11px;white-space:nowrap}

.diag-head{display:flex;align-items:center;gap:18px;margin-top:22px}
.diag-grade{
  width:68px;height:68px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:30px;font-weight:900;flex-shrink:0;border:2px solid currentColor;letter-spacing:0;
}
.diag-grade-A{color:var(--green);background:#eef7f1}
.diag-grade-B{color:var(--teal-dark);background:#eaf6f4}
.diag-grade-C{color:var(--gold);background:#fbf2e2}
.diag-grade-D{color:var(--danger);background:#fbeae8}
.diag-comment b{display:block;font-size:16px;margin-bottom:4px}
.diag-comment span{font-size:13.5px;color:var(--muted)}

.diag-meta{margin-top:18px;font-size:12px;color:#8aa0a2;padding-top:16px;border-top:1px dashed var(--line);font-variant-numeric:tabular-nums}

.diag-chip-row{display:flex;gap:8px;margin-top:16px;flex-wrap:wrap}
.diag-chip{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:800;padding:7px 12px;border-radius:999px}
.diag-chip .dot{width:7px;height:7px;border-radius:50%}
.diag-chip-pass{background:#eef7f1;color:var(--green)}.diag-chip-pass .dot{background:var(--green)}
.diag-chip-warn{background:#fbf2e2;color:var(--gold)}.diag-chip-warn .dot{background:var(--gold)}
.diag-chip-fail{background:#fbeae8;color:var(--danger)}.diag-chip-fail .dot{background:var(--danger)}

.diag-cat-list{margin-top:18px}
.diag-cat-row{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);font-size:14px}
.diag-cat-row:last-child{border-bottom:0}
.diag-cat-status{display:flex;align-items:center;gap:7px;font-weight:800;font-size:12.5px}
.diag-cat-status svg{width:14px;height:14px}
.diag-cat-status.pass{color:var(--green)}
.diag-cat-status.warn{color:var(--gold)}
.diag-cat-status.fail{color:var(--danger)}

.diag-gauge-row{display:flex;align-items:center;gap:20px;margin-top:20px;padding:18px;background:var(--soft);border-radius:18px}
.diag-gauge-title{font-weight:800;font-size:15px}
.diag-gauge-score{font-size:12.5px;color:var(--muted);margin-top:2px;font-variant-numeric:tabular-nums}
.diag-gauge-sub{font-size:12px;color:#8aa0a2;margin-top:6px;max-width:38ch}

.diag-detail-head{display:flex;justify-content:space-between;align-items:baseline;margin-top:24px}
.diag-detail-head h4{font-size:14px;font-weight:900}
.diag-detail-head span{font-size:12px;color:#8aa0a2}
.diag-detail-list{margin-top:12px;display:flex;flex-direction:column;gap:9px}
.diag-detail-item{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;padding:11px 13px;background:var(--soft);border-radius:12px}
.diag-cat-tag{flex-shrink:0;font-size:10.5px;font-weight:800;padding:3px 8px;border-radius:7px;background:#eaf6f4;color:var(--teal-dark);white-space:nowrap;margin-top:1px}
.diag-detail-item.locked{color:#96a5a8}
.diag-detail-item.locked svg{flex-shrink:0;margin-top:1px;stroke:#96a5a8;fill:none;stroke-width:2.2;width:14px;height:14px}
.diag-locked-text{filter:blur(4.5px);user-select:none}
.diag-detail-empty{font-size:13.5px;color:var(--muted);padding:10px 2px}

.diag-cta{margin-top:24px;padding-top:20px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:12px}
.diag-cta p{font-size:12.5px;color:var(--muted)}

.diag-loading{min-height:360px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:18px}
.diag-spin{width:38px;height:38px;border-radius:50%;border:3px solid var(--line);border-top-color:var(--teal-dark);animation:diag-spin .9s linear infinite}
@keyframes diag-spin{to{transform:rotate(360deg)}}
.diag-loading p{font-size:13.5px;color:var(--muted)}
.diag-checklist{display:flex;flex-direction:column;gap:9px;max-width:280px;width:100%}
.diag-checklist li{list-style:none;font-size:12.5px;color:#a2b0b2;display:flex;gap:8px;align-items:center;opacity:.45;transition:opacity .2s ease,color .2s ease}
.diag-checklist li.done{opacity:1;color:var(--ink)}
.diag-checklist .tick{width:14px;flex-shrink:0}

.diag-error{min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;padding:24px}
.diag-error .icon{width:48px;height:48px;border-radius:50%;background:#fbeae8;color:var(--danger);display:flex;align-items:center;justify-content:center}
.diag-error .icon svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2.4}
.diag-error p{font-size:14px;color:var(--muted);max-width:34ch}

.diag-check-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.diag-check-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px 24px;transition:.25s}
.diag-check-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.diag-check-card h3{font-size:16.5px;margin:20px 0 13px;letter-spacing:-.02em}
.diag-check-card ul{list-style:none;margin:0;padding:0}
.diag-check-card li{position:relative;padding:7px 0 7px 15px;border-top:1px solid #edf1f0;color:#526268;font-size:13px}
.diag-check-card li:first-child{border-top:0}
.diag-check-card li:before{content:"·";position:absolute;left:0;color:var(--teal-dark);font-weight:900}

.diag-lead-card{max-width:560px}
.diag-lead-card .form-group:last-of-type{margin-bottom:0}

@media(max-width:1050px){.diag-check-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){
  .diag-check-grid{grid-template-columns:1fr}
  .diag-result{padding:24px}
  .diag-head{gap:14px}
  .diag-grade{width:56px;height:56px;font-size:24px}
  .diag-gauge-row{flex-direction:column;align-items:flex-start}
}