:root{
  --ink:#10243a;--snow:#f4f7fa;--card:#fff;--line:#d5dee6;--fjord:#2b6c8f;--on:#fff;
  --heat:#e7a23b;--muted:#5b6b7b;--err:#a8431a;
  color-scheme:light dark;
}
@media (prefers-color-scheme:dark){
  :root{--ink:#e8eef4;--snow:#0d1824;--card:#14283b;--line:#2a4157;--fjord:#7fb6d4;--on:#0d1824;
    --heat:#f0b24f;--muted:#9bb0c2;--err:#f08a5d}
}
*{box-sizing:border-box}
body{margin:0;background:var(--snow);color:var(--ink);font:16px/1.5 system-ui,"Segoe UI",sans-serif}
#wizard{max-width:30rem;margin:0 auto;padding:1rem 1rem 3rem}
h1{font-size:1.5rem;line-height:1.2;font-weight:650;letter-spacing:-.01em;margin:0 0 .75rem}
h1:focus{outline:none}
p{margin:.5rem 0}
.muted{color:var(--muted);font-size:.875rem}
.lead{font-size:1rem}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:1.25rem}
.progress{display:flex;align-items:center;gap:.75rem;margin:0 0 .75rem}
.meter{flex:1;height:4px;background:var(--line);border-radius:2px;overflow:hidden}
.meter i{display:block;height:100%;background:var(--fjord)}
@media (prefers-reduced-motion:no-preference){.meter i{transition:width .25s}}

.row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 0;border-top:1px solid var(--line)}
.row.col{flex-direction:column;align-items:stretch;gap:.5rem}
.stepper{display:flex;align-items:center;gap:.25rem}
.stepper output{min-width:2.5rem;text-align:center;font-variant-numeric:tabular-nums;font-weight:600}
button{font:inherit;color:inherit;cursor:pointer}
button:focus-visible{outline:3px solid var(--fjord);outline-offset:2px}
.stepper button{width:2.75rem;height:2.75rem;border:1px solid var(--line);border-radius:10px;background:transparent;font-size:1.25rem}
.seg{display:flex;gap:.5rem;flex-wrap:wrap}
.seg button{flex:1;min-width:6rem;min-height:2.75rem;padding:.5rem .75rem;border:1px solid var(--line);border-radius:10px;background:transparent}
.seg button.on{border-color:var(--fjord);background:color-mix(in srgb,var(--fjord) 14%,transparent);font-weight:600}

.bands{display:grid;gap:.75rem;margin-top:.75rem}
.band{display:grid;gap:.15rem;text-align:left;padding:.9rem 1rem;border:1px solid var(--line);border-radius:12px;background:transparent}
.band.on{border:2px solid var(--fjord);padding:calc(.9rem - 1px) calc(1rem - 1px)}
.bname{font-weight:650}
.brange{color:var(--muted);font-size:.875rem;font-variant-numeric:tabular-nums}
.bprice{font-size:1.25rem;font-weight:650;font-variant-numeric:tabular-nums}
.scale{position:relative;height:2.1rem;margin:.35rem 0 .1rem;background:linear-gradient(var(--line),var(--line)) 0 .55rem/100% 2px no-repeat}
.scale .fill{position:absolute;top:.2rem;height:.7rem;border-radius:4px;background:var(--heat)}
.scale b{position:absolute;top:1.15rem;transform:translateX(-50%);font-size:.7rem;font-weight:400;color:var(--muted)}

.big{font-size:2.5rem;line-height:1.1;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
dl{margin:.5rem 0}
dl div{display:flex;justify-content:space-between;gap:1rem;padding:.4rem 0;border-top:1px solid var(--line)}
dt{color:var(--muted)}
dd{margin:0;font-variant-numeric:tabular-nums;text-align:right}
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;margin:.75rem 0}
.facts div{padding:.6rem .75rem;border:1px solid var(--line);border-radius:10px}
.facts b{display:block;font-size:1.1rem;font-variant-numeric:tabular-nums}
.note{padding:.6rem .75rem;border-left:3px solid var(--heat);background:color-mix(in srgb,var(--heat) 12%,transparent);font-size:.9rem}
.err{color:var(--err);font-weight:600;margin:.75rem 0 0}
details{margin-top:.75rem;font-size:.9rem}
summary{cursor:pointer;min-height:2.75rem;display:flex;align-items:center}

.nav{display:flex;gap:.75rem;margin-top:1rem}
.nav button{flex:1;min-height:3rem;border-radius:12px;border:1px solid var(--line);background:transparent;font-weight:600}
.nav .primary{background:var(--fjord);border-color:var(--fjord);color:var(--on)}
.inline{padding:.6rem 1rem;min-height:2.75rem;border:1px solid var(--fjord);border-radius:10px;background:transparent;color:var(--fjord);font-weight:600}



/* inputs, checkboxes, notices */
input[type=text],input[type=email],input[type=number],input[type=search],select{width:100%;min-height:2.75rem;padding:.5rem .75rem;border:1px solid var(--line);border-radius:10px;background:transparent;color:inherit;font:inherit}
input:focus-visible,select:focus-visible{outline:3px solid var(--fjord);outline-offset:2px}
.field-row{margin:.75rem 0}
.field-row label{display:block;font-weight:600;margin-bottom:.35rem}
.check{display:flex;gap:.75rem;align-items:flex-start;margin:.75rem 0;font-weight:400}
.check input{width:1.4rem;height:1.4rem;min-height:0;margin-top:.15rem;flex:none;accent-color:var(--fjord)}
.check a{color:var(--fjord)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}

/* indicative offer, lookup result, map */
.indicative{padding:.75rem 1rem;margin:0 0 1rem;border:1px solid var(--heat);border-left-width:6px;border-radius:10px;background:color-mix(in srgb,var(--heat) 14%,transparent);font-size:.95rem}
.indicative.ok{border-color:var(--fjord);background:color-mix(in srgb,var(--fjord) 12%,transparent)}
.note.ok{border-left-color:var(--fjord);background:color-mix(in srgb,var(--fjord) 12%,transparent)}
.or{text-align:center;margin:1rem 0 .25rem}
.map{
  width: 100%;
  height:18rem;
  display: block;
  margin:.75rem 0 0;
  border:1px solid var(--line);
  border-radius:12px;
  z-index:0}
.mapbar{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;margin-top:.5rem}