/* ============================================================
   quote-renew.css — 1분 예상견적 페이지 리뉴얼 오버레이
   · body.renewal-quote 하위만 적용
   · v6-* 클래스와 충돌하지 않게 specificity로 덮어씀
   ============================================================ */

/* ── 0. 스프라이트 아이콘 하드 캡 ── */
.renewal-quote .ico-svg {
  width: 20px !important;
  height: 20px !important;
  max-width: 20px;
  max-height: 20px;
  min-width: 20px;
  min-height: 20px;
  flex: 0 0 auto;
  flex-shrink: 0;
  display: inline-block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  vertical-align: -0.2em;
}
.renewal-quote .nav-toggle { color: var(--n-7); line-height: 0; }
.renewal-quote .nav-toggle .ico-svg { width: 22px !important; height: 22px !important; min-width: 22px; min-height: 22px; max-width: 22px; max-height: 22px; }

/* ── 1. 페이지 헤드 ── */
.renewal-quote .v6-head { padding: var(--sp-8) 0; }
.renewal-quote .v6-eyebrow {
  display: inline-block;
  background: var(--n-0);
  border: 1px solid var(--brand-line);
  color: var(--brand-ink);
  border-radius: var(--r-sm);
  padding: 5px 12px;
  font-size: var(--fs-micro);
  font-weight: var(--fw-semi);
  letter-spacing: 0.02em;
  box-shadow: none;
  text-transform: none;
}
.renewal-quote .v6-head h1 { color: var(--n-8); letter-spacing: var(--ls-heading); font-weight: var(--fw-bold); }
.renewal-quote .v6-head p { color: var(--n-6); }
.renewal-quote .v6-head strong { color: var(--n-8); }

/* ── 2. 스텝 인디케이터 ── */
.renewal-quote .v6-steps {
  display: flex;
  gap: var(--sp-2);
  margin-bottom: var(--sp-6);
  padding: var(--sp-4) 0;
  border-bottom: 1px solid var(--n-2);
}
.renewal-quote .v6-step {
  flex: 1;
  text-align: center;
  font-size: var(--fs-caption);
  font-weight: var(--fw-medium);
  color: var(--n-5);
  padding: var(--sp-2) 0;
  position: relative;
}
.renewal-quote .v6-step::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--n-2);
  border-radius: 1px;
}
.renewal-quote .v6-step.on { color: var(--brand-ink); font-weight: var(--fw-bold); }
.renewal-quote .v6-step.on::after { background: var(--brand); }
.renewal-quote .v6-step.done { color: var(--n-6); }
.renewal-quote .v6-step.done::after { background: var(--brand); }

/* ── 3. 카드 ── */
.renewal-quote .v6-card {
  background: var(--n-0);
  border: 1px solid var(--n-3);
  border-radius: var(--r-lg);
  box-shadow: none;
  padding: var(--sp-6);
  margin-bottom: var(--sp-5);
}
.renewal-quote .v6-card h2 { color: var(--n-8); font-size: var(--fs-h3); margin-bottom: var(--sp-5); }
.renewal-quote .v6-card:hover { border-color: var(--n-4); box-shadow: var(--sh-2); }

/* ── 4. 필드/폼 요소 ── */
.renewal-quote .v6-field { margin-bottom: var(--sp-5); }
.renewal-quote .v6-field label {
  display: block;
  color: var(--n-7);
  font-size: var(--fs-body-sm);
  font-weight: var(--fw-medium);
  margin-bottom: var(--sp-2);
}
.renewal-quote .v6-field select,
.renewal-quote .v6-field input[type="file"] {
  width: 100%;
  padding: var(--sp-3) var(--sp-4);
  border: 1px solid var(--n-3);
  border-radius: var(--r-md);
  background: var(--n-0);
  color: var(--n-7);
  font-size: var(--fs-body);
  font-family: var(--font-sans);
  transition: border-color var(--dur-fast), box-shadow var(--dur-fast);
}
.renewal-quote .v6-field select:focus,
.renewal-quote .v6-field input[type="file"]:focus {
  outline: none;
  border-color: var(--brand);
  box-shadow: 0 0 0 3px var(--brand-weak);
}
.renewal-quote .v6-field select:disabled {
  background: var(--n-1);
  color: var(--n-4);
  cursor: not-allowed;
}
.renewal-quote .v6-badge {
  font-size: var(--fs-micro);
  font-weight: var(--fw-semi);
  border-radius: var(--r-xs);
  padding: 1px 6px;
  margin-left: 6px;
  vertical-align: middle;
}
.renewal-quote .v6-badge.gray { background: var(--n-2); color: var(--n-5); border: 1px solid var(--n-3); }
.renewal-quote .v6-badge.info { background: var(--brand-weak); color: var(--brand-ink); border: 1px solid var(--brand-line); }

/* ── 5. 필드셋 (라디오 그룹) ── */
.renewal-quote fieldset.v6-field { border: none; padding: 0; margin: 0 0 var(--sp-4); }
.renewal-quote fieldset.v6-field legend { display: none; }
.renewal-quote fieldset.v6-field .v6-radio-group {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-3);
}
.renewal-quote .v6-radio {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: var(--sp-2) var(--sp-4);
  border: 1px solid var(--n-3);
  border-radius: var(--r-lg);
  background: var(--n-0);
  color: var(--n-6);
  font-size: var(--fs-body-sm);
  cursor: pointer;
  transition: border-color var(--dur-fast), background var(--dur-fast), color var(--dur-fast);
}
.renewal-quote .v6-radio:hover { border-color: var(--n-4); }
.renewal-quote .v6-radio input { accent-color: var(--brand); width: 16px; height: 16px; }
.renewal-quote .v6-radio input:checked + span { color: var(--brand-ink); font-weight: var(--fw-semi); }
.renewal-quote .v6-radio:has(input:checked) {
  border-color: var(--brand-line);
  background: var(--brand-weak);
  color: var(--brand-ink);
}

/* ── 6. 도움말 ── */
.renewal-quote .v6-help {
  font-size: var(--fs-caption);
  color: var(--n-5);
  margin-top: var(--sp-2);
}
.renewal-quote .v6-help strong { color: var(--n-7); }

/* ── 7. 액션 버튼 ── */
.renewal-quote .v6-actions {
  display: flex;
  justify-content: flex-end;
  gap: var(--sp-3);
  margin-top: var(--sp-6);
  padding-top: var(--sp-5);
  border-top: 1px solid var(--n-2);
}
.renewal-quote .btn { border-radius: var(--r-lg); min-height: 48px; font-weight: var(--fw-semi); }
.renewal-quote .btn.primary { background: var(--brand); border-color: var(--brand); color: #fff; }
.renewal-quote .btn.primary:hover { background: var(--brand-hover); border-color: var(--brand-hover); }
.renewal-quote .btn:not(.primary) { background: var(--n-0); border: 1px solid var(--n-4); color: var(--n-7); }
.renewal-quote .btn:not(.primary):hover { border-color: var(--n-6); color: var(--n-8); }
.renewal-quote .btn:disabled { opacity: 0.5; cursor: not-allowed; }

/* ── 8. 결과 영역 ── */
.renewal-quote #quoteResult { color: var(--n-6); }
.renewal-quote #shareFallback { background: var(--n-0); border: 1px solid var(--n-3); border-radius: var(--r-lg); padding: var(--sp-6); }

/* ── 9. 푸터/토스트/스킵링크 ── */
.renewal-quote .site-footer { border-top: 1px solid var(--n-3); }
.renewal-quote .toast { background: var(--n-8); color: var(--n-0); border-radius: var(--r-md); }
.renewal-quote .skip-link:focus { background: var(--brand); color: #fff; padding: var(--sp-2) var(--sp-3); border-radius: var(--r-sm); left: var(--sp-4); top: var(--sp-4); z-index: 100; }