/* Seller estimate flow */
.es-wrap { max-width: 760px; margin: 0 auto; padding: 56px 32px 88px; }
.es-head { display: flex; flex-direction: column; gap: 14px; margin-bottom: 28px; }
.es-head h1 { font: 500 clamp(32px, 4vw, 48px)/1.06 var(--font-display); letter-spacing: -0.04em; margin: 0; color: var(--ink); text-wrap: balance; }
.es-head p { margin: 0; font: 400 17px/1.55 var(--font-sans); color: var(--ink-secondary); max-width: 52ch; }
.es-trust { display: flex; flex-wrap: wrap; gap: 6px 18px; font: 400 13px/20px var(--font-sans); color: var(--ink-muted); }
.es-trust span::before { content: ""; display: inline-block; width: 6px; height: 6px; background: var(--primary); margin-right: 8px; vertical-align: middle; }

.es-steps { list-style: none; margin: 0 0 16px; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.es-steps li { display: flex; align-items: center; gap: 8px; font: 500 13px/18px var(--font-sans); color: var(--ink-muted); padding-top: 10px; border-top: 2px solid var(--seam); }
.es-steps li span { width: 22px; height: 22px; display: inline-grid; place-items: center; border: 1px solid var(--seam-strong); font: 500 11px/1 var(--font-mono); color: var(--ink-muted); background: var(--surface); flex: none; }
.es-steps li.on { color: var(--ink); border-top-color: var(--primary); }
.es-steps li.on span { background: var(--primary); border-color: var(--primary); color: #FFFFFF; }
.es-steps li.done { color: var(--ink-secondary); border-top-color: var(--indigo-300); }
.es-steps li.done span { background: var(--primary-soft); border-color: var(--indigo-200); color: var(--primary); }

.es-card { background: var(--surface); border: 1px solid var(--seam); padding: 28px; display: flex; flex-direction: column; gap: 18px; }
.es-card h2 { font: 500 24px/1.2 var(--font-display); letter-spacing: -0.03em; margin: 0; color: var(--ink); outline: none; }
.es-sub { margin: -8px 0 0; font: 400 15px/23px var(--font-sans); color: var(--ink-secondary); }
.es-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.es-f { display: flex; flex-direction: column; gap: 6px; }
.es-f label, .es-q legend { font: 500 13px/18px var(--font-sans); color: var(--ink); }
.es-f label span, .es-q legend span { color: var(--ink-muted); font-weight: 400; }
.es-f input, .es-f select, .es-q textarea, .es-v-row input, .es-phone select { height: 42px; box-sizing: border-box; border: 1px solid var(--border-control); background: #FFFFFF; padding: 0 12px; font: 400 15px/20px var(--font-sans); color: var(--ink); border-radius: 0; width: 100%; }
.es-q textarea { height: auto; padding: 10px 12px; resize: vertical; }
.es-f input:focus, .es-f select:focus, .es-q textarea:focus, .es-v-row input:focus { outline: 2px solid var(--primary); outline-offset: -1px; border-color: var(--primary); }
.es-phone { display: grid; grid-template-columns: 132px 1fr; gap: 6px; }
.es-hint { margin: 0; font: 400 12.5px/18px var(--font-sans); color: var(--ink-muted); }
.es-err { margin: 0; padding: 10px 12px; background: var(--error-soft); color: var(--error); font: 500 14px/20px var(--font-sans); }
.es-note { margin: 0; padding: 12px 14px; background: var(--primary-soft); color: var(--indigo-700); font: 400 14px/21px var(--font-sans); border-left: 2px solid var(--primary); }
.es-actions { display: flex; justify-content: flex-end; gap: 10px; flex-wrap: wrap; padding-top: 4px; }
.es-actions .wdl-btn[disabled] { opacity: .45; cursor: not-allowed; transform: none; }

.es-q { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.es-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.es-chip { min-height: 36px; padding: 0 12px; border: 1px solid var(--seam-strong); background: #FFFFFF; color: var(--ink); font: 400 14px/18px var(--font-sans); cursor: pointer; border-radius: 0; transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease; }
.es-chip:hover { border-color: var(--ink); }
.es-chip.on { background: var(--ink); border-color: var(--ink); color: #FFFFFF; }
.es-chip.sm { min-height: 32px; font-size: 13px; }

.es-v { border: 1px solid var(--seam); background: var(--paper); padding: 16px; display: flex; flex-direction: column; gap: 12px; }
.es-v-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.es-v b { display: block; font: 500 16px/22px var(--font-sans); color: var(--ink); margin-top: 2px; word-break: break-all; }
.es-v-row { display: grid; grid-template-columns: 160px auto 1fr; gap: 8px; align-items: center; }
.es-v-row input { letter-spacing: .2em; font-family: var(--font-mono); }
.es-v-row input:disabled, .es-v-row .wdl-btn:disabled { opacity: .5; }
.es-v.ok { flex-direction: row; justify-content: space-between; align-items: center; background: #FFFFFF; }
.es-ok { font: 500 13px/18px var(--font-sans); color: var(--success); background: var(--success-soft); padding: 4px 10px; }
.es-ok::before { content: "✓ "; }
.es-chan { display: flex; gap: 6px; }
.es-link { background: none; border: 0; padding: 0; color: var(--primary); font: 500 14px/20px var(--font-sans); cursor: pointer; text-align: left; }
.es-link:hover { text-decoration: underline; text-underline-offset: 3px; }

.es-result { gap: 16px; }
.es-range { margin: 0; font: 500 clamp(36px, 5vw, 56px)/1.04 var(--font-display); letter-spacing: -0.045em; color: var(--primary); }
.es-next { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.es-next > div { display: flex; flex-direction: column; gap: 6px; padding: 14px; border: 1px solid var(--seam); background: var(--paper); }
.es-next b { font: 500 12px/16px var(--font-mono); color: var(--primary); }
.es-next span { font: 400 14px/21px var(--font-sans); color: var(--ink-secondary); }
.es-fine { margin: 0; font: 400 13px/20px var(--font-sans); color: var(--ink-muted); }

@media (max-width: 640px) {
  .es-wrap { padding: 32px 16px 64px; }
  .es-card { padding: 20px 16px; }
  .es-grid, .es-next { grid-template-columns: 1fr; }
  .es-steps li { font-size: 0; gap: 0; }
  .es-steps li span { font-size: 11px; }
  .es-v-row { grid-template-columns: 1fr auto; }
  .es-v-row .es-link { grid-column: 1 / -1; }
  .es-actions .wdl-btn { flex: 1 1 auto; }
}
.es-v-row input::placeholder { letter-spacing: 0; font-family: var(--font-sans); }
.es-v .es-hint b { display: inline; font-size: inherit; }
