.konf { padding-block: 150px var(--sp-12); min-height: 100svh; }
.konf__mreza { display: grid; gap: var(--sp-10); }
@media (min-width: 1000px) { .konf__mreza { grid-template-columns: .8fr 1.2fr; } .konf__uvod { position: sticky; top: 130px; align-self: start; } }
.konf__uvod { display: grid; gap: var(--sp-6); align-content: start; }
.konf__uvod h1 { font-size: var(--fs-h1); }
.pomiritve { list-style: none; padding: 0; margin: var(--sp-4) 0 0; display: grid; gap: var(--sp-4); border-top: 1px solid var(--line); padding-top: var(--sp-6); }
.pomiritve li { display: grid; grid-template-columns: 24px 1fr; gap: var(--sp-3); color: var(--ink-70); }
.pomiritve li::before { content: "✓"; font-family: var(--m); color: var(--accent-dark); }
.pomiritve strong { color: var(--ink); font-weight: 600; }

.obrazec { background: var(--bg-card); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: inset 0 0 0 1px var(--line-soft), var(--el-2) !important; border-radius: var(--r-xl); box-shadow: inset 0 0 0 1px var(--line-soft); padding: clamp(20px, 4vw, 48px); }
.napredek { display: flex; justify-content: space-between; align-items: center; gap: var(--sp-5); margin-bottom: var(--sp-8); }
.napredek__crta { flex: 1; height: 3px; border-radius: 3px; background: var(--line); overflow: hidden; }
.napredek__crta i { display: block; height: 100%; width: 25%; background: var(--accent); transition: width var(--d-5) var(--e-out); }
.korak-o { display: none; border: 0; padding: 0; margin: 0; min-width: 0; }
.korak-o.is-aktiven { display: grid; gap: var(--sp-6); animation: prihod var(--d-5) var(--e-out); }
@keyframes prihod { from { opacity: 0; transform: translateY(12px); } }
.korak-o legend { font: 600 var(--fs-h3)/1.1 var(--h); letter-spacing: -.03em; padding: 0; margin-bottom: var(--sp-6); }

.izbire { display: grid; gap: var(--sp-4); }
@media (min-width: 600px) { .izbire { grid-template-columns: 1fr 1fr; } }
.izbira { position: relative; }
.izbira input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.izbira label { background: transparent; display: grid; gap: var(--sp-2); padding: var(--sp-6); border-radius: var(--r-lg); box-shadow: inset 0 0 0 1px var(--line); cursor: pointer; transition: box-shadow var(--d-3), background var(--d-3); min-height: 100%; }
.izbira label strong { font: 600 var(--fs-body)/1.3 var(--h); }
.izbira label span { color: var(--ink-50); font-size: var(--fs-small); }
.izbira input:hover + label { box-shadow: inset 0 0 0 1px var(--ink-30); }
.izbira input:checked + label { box-shadow: inset 0 0 0 2px var(--accent); background: var(--accent-soft); }
.izbira input:focus-visible + label { outline: 2px solid var(--accent-dark); outline-offset: 3px; }
.izbire--male { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.izbire--male label { padding: var(--sp-4) var(--sp-5); }

.polje { display: grid; gap: var(--sp-3); }
.polje label, .polje .oznaka { font: 500 var(--fs-caption)/1.4 var(--m); text-transform: uppercase; letter-spacing: .1em; color: var(--ink-50); }
.polje input, .polje textarea, .polje select {
  font: inherit; color: var(--ink); background: rgba(255,255,255,.04); border: 0; border-radius: var(--r-md);
  box-shadow: inset 0 0 0 1px var(--line); padding: 14px 16px; min-height: 52px; width: 100%;
  transition: box-shadow var(--d-3);
}
.polje textarea { min-height: 120px; resize: vertical; }
.polje input:focus, .polje textarea:focus, .polje select:focus { outline: none; box-shadow: inset 0 0 0 2px var(--accent); }
.polje.is-napaka input, .polje.is-napaka textarea { box-shadow: inset 0 0 0 2px #FF6B6B; }
.napaka { color: #FF8C8C; font-size: var(--fs-small); min-height: 0; }
.polja-2 { display: grid; gap: var(--sp-5); }
@media (min-width: 600px) { .polja-2 { grid-template-columns: 1fr 1fr; } }

.nalaganje { border: 1px dashed var(--ink-30); border-radius: var(--r-lg); padding: var(--sp-8); text-align: center; display: grid; gap: var(--sp-3); cursor: pointer; transition: border-color var(--d-3), background var(--d-3); }
.nalaganje:hover, .nalaganje.is-nad { border-color: var(--accent); background: var(--accent-soft); }
.nalaganje input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.predogledi { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: var(--sp-4); }
.predogled { position: relative; aspect-ratio: 1; border-radius: var(--r-md); overflow: hidden; background: var(--bg-soft); display: grid; place-items: center; font: 500 10px/1.3 var(--m); color: var(--ink-50); text-align: center; padding: 6px; word-break: break-all; }
.predogled img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.predogled button { position: absolute; top: 4px; right: 4px; width: 28px; height: 28px; border-radius: 50%; border: 0; background: rgba(0,0,0,.7); color: #fff; cursor: pointer; }

.povzetek { display: grid; gap: 0; border-top: 1px solid var(--line); }
.povzetek div { display: grid; grid-template-columns: 130px 1fr; gap: var(--sp-4); padding-block: var(--sp-4); border-bottom: 1px solid var(--line); font-size: var(--fs-small); }
.povzetek dt { font: 500 var(--fs-micro)/1.6 var(--m); text-transform: uppercase; letter-spacing: .1em; color: var(--ink-50); }
.povzetek dd { margin: 0; }
.soglasje { display: flex; gap: var(--sp-4); align-items: flex-start; color: var(--ink-70); font-size: var(--fs-small); }
.soglasje input { width: 22px; height: 22px; margin-top: 1px; accent-color: var(--accent); flex: none; }

.gumbi { display: flex; justify-content: space-between; gap: var(--sp-4); margin-top: var(--sp-8); padding-top: var(--sp-6); border-top: 1px solid var(--line-soft); }
.gumbi .btn--ghost[hidden] { display: none; }
.uspeh { display: none; text-align: left; gap: var(--sp-6); }
.uspeh.is-aktiven { display: grid; animation: prihod var(--d-5) var(--e-out); }
.uspeh__ikona { width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; background: var(--accent); color: var(--bg); font-size: 1.6rem; }

/* Obvestilo: stran v izdelavi */
.obvestilo { display: grid; gap: var(--sp-5); align-items: center; margin-bottom: var(--sp-10); padding: var(--sp-6) var(--sp-7); border-radius: var(--r-xl);
  background: linear-gradient(100deg, rgba(255,122,69,.16), rgba(255,122,69,.04) 60%), var(--bg-card); box-shadow: inset 0 0 0 1px rgba(255,122,69,.45);
  animation: obvestilo-prihod .7s var(--e-out) both .15s; }
@media (min-width: 900px) { .obvestilo { grid-template-columns: auto 1fr auto; gap: var(--sp-6); } }
@keyframes obvestilo-prihod { from { opacity: 0; transform: translateY(-12px); } }
.obvestilo__ikona { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--accent); color: var(--bg); font: 600 1.25rem/1 var(--h); box-shadow: 0 0 0 6px var(--accent-soft); }
.obvestilo__besedilo strong { font: 600 var(--fs-h4)/1.25 var(--h); letter-spacing: -.02em; display: block; }
.obvestilo__besedilo p { color: var(--ink-70); margin-top: var(--sp-2); }
.obvestilo__kontakti { display: flex; flex-wrap: wrap; gap: var(--sp-3); }
.obvestilo__kontakti a { display: inline-flex; align-items: center; gap: var(--sp-3); min-height: 48px; padding: 0 var(--sp-5); border-radius: var(--r-pill); background: var(--cream); color: var(--bg); text-decoration: none; font: 600 var(--fs-small)/1 var(--h); transition: background var(--d-3), transform var(--d-3) var(--e-out); }
.obvestilo__kontakti a:hover { background: var(--cream-press); transform: translateY(-2px); }
.obvestilo__kontakti svg { width: 16px; height: 16px; flex: none; }