/* BizkoShop — odprtje trgovine (app.bizkoshop.si/zacetek). Izhodišče: predstavitev/dist/onboarding/style.css, sloj »app« na koncu. */
:root{
  --navy:#07377f;--deep:#082d68;--night:#061b42;--blue:#117de1;--teal:#05ada4;--mint:#14c584;
  --ink:#11284a;--muted:#56697f;--line:#dce6f0;--tint:#f2f6fa;--paper:#f5f8fc;
  --brand:linear-gradient(112deg,#0a49b6 0%,#1887ee 38%,#00a6a6 70%,#15c779 100%);
  --grad-btn:linear-gradient(112deg,#0a49b6,#1678de 55%,#0795a8);
  --ok:#067a5c;--bad:#b42335;--bad-bg:#fdf1f3;
  --serif:Georgia,"Times New Roman",serif;
  --sans:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --ease-out:cubic-bezier(.23,1,.32,1);--ease-io:cubic-bezier(.77,0,.175,1);--ease-soft:cubic-bezier(.2,.8,.2,1);
  --r-card:16px;--r-btn:12px;--r-in:12px;
  --sh-1:0 1px 2px #0b2a5a0d,0 10px 28px -12px #0b2a5a29;
  --sh-2:0 2px 6px #0b2a5a0f,0 28px 60px -22px #0b2a5a4d;
  --top:64px;--gut:max(16px,min(40px,4vw));
}
*{box-sizing:border-box}
html{scroll-padding-top:calc(var(--top) + 24px);scrollbar-color:#9fb4cb #eef3f8;-webkit-text-size-adjust:100%}
body{margin:0;min-height:100dvh;font-family:var(--sans);color:var(--ink);background:var(--tint);-webkit-font-smoothing:antialiased;line-height:1.5;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0 0 auto;height:460px;z-index:-1;pointer-events:none;background:radial-gradient(60% 90% at 12% -10%,#cfe3fb 0%,transparent 60%),radial-gradient(50% 80% at 95% -20%,#cdf3e8 0%,transparent 55%)}
::selection{background:#bff0e2;color:#062859}
img{max-width:100%;display:block}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
a{color:#0a64bd}
h1,h2,h3{text-wrap:balance;margin:0}
p{text-wrap:pretty;margin:0}
em{font-family:var(--serif);font-style:italic;font-weight:500}
[hidden]{display:none!important}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.ic{width:20px;height:20px;flex:none}
:focus-visible{outline:2px solid #0a8f8a;outline-offset:2px}
.skip{position:fixed;left:12px;top:-60px;z-index:90;background:#fff;color:var(--deep);padding:10px 14px;border-radius:10px;box-shadow:var(--sh-2);font-weight:700}
.skip:focus{top:10px}

/* ---------- Zgornja vrstica ---------- */
.ob-top{position:sticky;top:0;z-index:40;height:var(--top);background:#ffffffd9;-webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);box-shadow:0 1px 0 #0b34731a}
.ob-top-in{height:100%;max-width:1360px;margin:0 auto;padding:0 var(--gut);display:flex;align-items:center;gap:16px}
.wordmark{display:inline-flex;align-items:center;gap:10px;min-height:44px;text-decoration:none;white-space:nowrap;color:#0b3473;font-weight:800;font-size:21px;letter-spacing:-.06em}
.wordmark-mark{width:32px;height:32px;border-radius:9px;background:linear-gradient(112deg,#0a49b6,#1887ee 38%,#00a6a6 70%,#15c779);position:relative;flex:none}
.wordmark-mark::after{content:"";position:absolute;left:8px;right:8px;top:13px;height:11px;border:2px solid #fff;border-radius:2px 2px 5px 5px}
.wordmark-mark::before{content:"";position:absolute;left:11px;right:11px;top:7px;height:8px;border:2px solid #fff;border-bottom:0;border-radius:6px 6px 0 0}
.wordmark-text{color:#0b3473}.wordmark-text span{color:#0a8f8a}
.ob-top-sep{width:1px;height:22px;background:#c7d4e3}
.ob-top-title{font-size:14px;font-weight:700;color:#37506d}
.ob-top-end{margin-left:auto;display:flex;align-items:center;gap:8px}
.ob-count{font-size:13px;font-weight:750;color:#0b3473;background:#e9f1fa;border-radius:999px;padding:6px 12px;font-variant-numeric:tabular-nums;white-space:nowrap}
.ob-back-site{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 12px;border-radius:10px;font-size:14px;font-weight:750;color:#0a4f9c;text-decoration:none;transition:background-color .2s,color .2s}
.ob-back-site .ic{width:18px;height:18px;transition:transform .3s var(--ease-soft)}
.ob-progress{position:absolute;left:0;right:0;bottom:0;height:3px;background:#0b347312}
.ob-progress i{position:absolute;inset:0;background:var(--brand);transform-origin:0 50%;transform:scaleX(.125);transition:transform .5s var(--ease-out)}

/* ---------- Ogrodje ---------- */
.ob-shell{max-width:1360px;margin:0 auto;padding:32px var(--gut) 64px;display:grid;grid-template-columns:300px minmax(0,1fr);gap:clamp(24px,3vw,48px);align-items:start}
.ob-rail{position:sticky;top:calc(var(--top) + 24px);display:grid;gap:14px}
.ob-rail-card{position:relative;overflow:hidden;border-radius:20px;padding:26px 18px 18px;color:#fff;background:linear-gradient(160deg,#0a3b86 0%,#072e69 45%,#061b42 100%);box-shadow:0 30px 60px -30px #061b42b3,inset 0 1px 0 #ffffff1f}
.ob-rail-card::before{content:"";position:absolute;width:320px;height:320px;right:-150px;top:-150px;border-radius:50%;background:radial-gradient(circle,#15c7794d,transparent 65%);pointer-events:none}
.ob-rail-card::after{content:"";position:absolute;width:280px;height:280px;left:-140px;bottom:-160px;border-radius:50%;background:radial-gradient(circle,#1887ee40,transparent 65%);pointer-events:none}
.ob-rail-h{position:relative;font-size:22px;line-height:1.15;font-weight:800;letter-spacing:-.04em;margin:0 6px 18px}
.ob-rail-h em{display:block;color:#8ce6ce}
.ob-steps{position:relative;list-style:none;margin:0;padding:0;display:grid;gap:2px}
.ob-steps li{position:relative}
.ob-steps li:not(:last-child)::after{content:"";position:absolute;left:23px;top:36px;bottom:-10px;width:1.5px;background:#ffffff26}
.ob-steps li.done:not(:last-child)::after{background:linear-gradient(#5fe0c4,#5fe0c499)}
.ob-steps button{position:relative;z-index:1;width:100%;min-height:44px;display:flex;align-items:center;gap:12px;padding:6px 8px;border:0;border-radius:12px;background:transparent;color:#c9d8ec;text-align:left;font-size:14px;font-weight:650;transition:background-color .2s,color .2s}
.ob-steps button:disabled{cursor:default}
.ob-steps li:not(.cur) button:disabled{color:#9fb3cf}
.ob-steps .sn{width:32px;height:32px;flex:none;display:grid;place-items:center;border-radius:10px;font-size:13px;font-weight:800;background:#ffffff12;box-shadow:inset 0 0 0 1px #ffffff2e;font-variant-numeric:tabular-nums;transition:background-color .3s,box-shadow .3s,transform .3s var(--ease-soft)}
.ob-steps .sn .ic{width:16px;height:16px;stroke-width:2.2}
.ob-steps li.done .sn{background:linear-gradient(135deg,#1aa889,#0a8f8a);box-shadow:none;color:#fff}
.ob-steps li.done button{color:#e6f0fb}
.ob-steps li.cur button{background:#ffffff14;color:#fff;box-shadow:inset 0 0 0 1px #ffffff1f}
.ob-steps li.cur .sn{background:#fff;color:#07377f;box-shadow:0 0 0 4px #ffffff26}
.ob-steps button:focus-visible{outline:2px solid #5fe0c4;outline-offset:1px}
.ob-sum{position:relative;margin-top:16px;padding:14px 12px 4px;border-top:1px solid #ffffff1f;display:grid;gap:2px}
.sum-h{font-size:12px;font-weight:700;color:#a9bdd8;margin:0 0 6px}
.sum-r{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:34px;font-size:13px}
.sum-r span{color:#a9bdd8}
.sum-r b{display:flex;align-items:center;gap:8px;font-weight:700;color:#fff;text-align:right;min-width:0}
.sum-r b small{font-weight:500;color:#c9d8ec}
.sum-t img{width:34px;height:22px;object-fit:cover;object-position:top;border-radius:5px;box-shadow:0 0 0 1px #ffffff33}
.sum-url{display:block!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:170px;font-weight:650!important;color:#8ce6ce!important}
.ob-note{display:flex;align-items:center;gap:10px;margin:0 4px;font-size:12.5px;line-height:1.4;color:var(--muted)}
.ob-note .ic{width:18px;height:18px;color:#0a8f8a}
.ob-note-m{display:none}

/* ---------- Glavni del ---------- */
.ob-main{min-width:0;outline:none}
.ob-dots{display:none}
.ob-form{margin:0}
.ob-stage{min-height:420px}
.step-in{will-change:auto}
.sh{margin:6px 0 28px;max-width:720px}
.sh-n{font-size:13px;font-weight:700;color:#07747b;margin-bottom:10px}
.sh h1{font-size:clamp(30px,3.4vw,46px);line-height:1.06;font-weight:800;letter-spacing:-.045em;color:#0b2a5a;outline:none}
.sh h1 em{color:#0a64bd}
.sh-p{margin-top:12px;font-size:16px;line-height:1.6;color:var(--muted);max-width:60ch}
.sb{display:grid;gap:20px}

.cardx{background:#fff;border-radius:var(--r-card);padding:clamp(20px,2.4vw,30px);box-shadow:var(--sh-1),0 0 0 1px #0b34730d;display:grid;gap:18px;min-width:0}
.cardx-soft{background:#fbfdff}
.ch-h{font-size:17px;font-weight:800;letter-spacing:-.02em;color:#0b2a5a}
.ch-p{font-size:14.5px;color:var(--muted);margin-top:-8px}
.split{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(260px,1fr);gap:20px;align-items:start}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 18px;align-items:start}
.span2{grid-column:1/-1}
.fine{font-size:13px;line-height:1.55;color:var(--muted);display:flex;gap:8px;align-items:flex-start}
.fine .ic{width:17px;height:17px;color:#0a8f8a;margin-top:1px}
.fine a{font-weight:700}

/* Polja */
.fl{display:grid;gap:7px;min-width:0;align-content:start}
.fl label{font-size:14px;font-weight:700;color:#1c355a}
.opt{font-weight:500;color:var(--muted);font-size:12.5px;margin-left:4px}
.in-wrap{position:relative;display:flex;align-items:stretch;min-width:0;border-radius:var(--r-in);background:#fff;box-shadow:inset 0 0 0 1px #c9d6e4;transition:box-shadow .2s}
.in-wrap:hover{box-shadow:inset 0 0 0 1px #9fb4cb}
.in-wrap:focus-within{box-shadow:inset 0 0 0 1.5px #0a64bd,0 0 0 4px #1678de24}
.in-wrap input,.in-wrap select{flex:1;min-width:0;min-height:48px;padding:12px 14px;border:0;background:transparent;border-radius:var(--r-in);font-size:16px;outline:none}
.in-wrap input::placeholder{color:#7d8ea4}
.sel::after{content:"";position:absolute;right:16px;top:50%;width:8px;height:8px;margin-top:-6px;border-right:1.6px solid #4b6280;border-bottom:1.6px solid #4b6280;transform:rotate(45deg);pointer-events:none}
.sel select{appearance:none;-webkit-appearance:none;padding-right:40px;cursor:pointer}
.has-btn input{padding-right:4px}
.in-btn{display:inline-flex;align-items:center;gap:6px;margin:4px;padding:0 12px;min-height:40px;border:0;border-radius:9px;background:#eef4fa;color:#0a4f9c;font-size:13px;font-weight:700;transition:background-color .2s,transform .16s var(--ease-out)}
.in-btn .ic{width:17px;height:17px}
.in-btn:active{transform:scale(.97)}
.suffix .sfx{display:flex;align-items:center;padding:0 14px 0 2px;color:#4b6280;font-weight:600;font-size:15px;white-space:nowrap}
.suffix input{padding-right:0;font-weight:650;color:#0b2a5a}
.help{font-size:12.5px;line-height:1.45;color:var(--muted)}
.err{display:flex;align-items:flex-start;gap:7px;font-size:13px;font-weight:650;color:var(--bad);line-height:1.4}
.err .ic{width:16px;height:16px;margin-top:1px}
.fl.is-bad .in-wrap{box-shadow:inset 0 0 0 1.5px var(--bad);background:var(--bad-bg)}
.fl.is-bad .in-wrap:focus-within{box-shadow:inset 0 0 0 1.5px var(--bad),0 0 0 4px #b4233522}

/* Izbire (radijski gumbi kot kartice) */
.fs{border:0;margin:0;padding:0;min-width:0;display:grid;gap:10px}
.fs legend{padding:0;margin-bottom:10px;font-size:14px;font-weight:700;color:#1c355a}
.chs{display:grid;gap:10px}
.chs-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.ch{position:relative;display:flex;align-items:center;gap:12px;min-height:64px;padding:12px 14px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px #d3deea;cursor:pointer;transition:box-shadow .2s,background-color .2s,transform .16s var(--ease-out)}
.ch input,.plan input,.th input,.bill-o input,.cb input{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}
.ch-ic{width:38px;height:38px;flex:none;display:grid;place-items:center;border-radius:10px;background:#eef4fa;color:#0a5fb0;transition:background-color .25s,color .25s}
.ch-tx{display:grid;gap:2px;min-width:0;flex:1}
.ch-tx b{font-size:14.5px;color:#0b2a5a}
.ch-tx small{font-size:13px;color:var(--muted);line-height:1.4}
.ch-dot{width:20px;height:20px;flex:none;border-radius:50%;box-shadow:inset 0 0 0 1.5px #9fb4cb;background:#fff;transition:box-shadow .2s var(--ease-out)}
.ch.is-on{box-shadow:inset 0 0 0 1.5px #0a64bd,0 10px 24px -16px #0a49b680;background:#f6faff}
.ch.is-on .ch-dot,.plan.is-on .ch-dot{box-shadow:inset 0 0 0 6px #0a64bd}
.ch.is-on .ch-ic{background:linear-gradient(135deg,#0a49b6,#0795a8);color:#fff}
.ch:active,.plan:active,.th:active{transform:scale(.985)}
.ch:has(input:focus-visible),.plan:has(input:focus-visible),.th:has(input:focus-visible),.bill-o:has(input:focus-visible),.cb:has(input:focus-visible){outline:2px solid #0a8f8a;outline-offset:2px}
.tag{font-size:11.5px;font-weight:750;color:#07606a;background:#e3f6f1;padding:4px 8px;border-radius:999px;white-space:nowrap}

/* Potrditvena polja */
.cbs{display:flex;flex-wrap:wrap;gap:8px}
.cb{position:relative;display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:8px 14px 8px 10px;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1px #d3deea;cursor:pointer;font-size:14px;font-weight:650;transition:box-shadow .2s,background-color .2s}
.cb small{font-weight:500;color:var(--muted)}
.cb-box{width:22px;height:22px;flex:none;border-radius:7px;display:grid;place-items:center;background:#fff;box-shadow:inset 0 0 0 1.5px #9fb4cb;color:#fff;transition:background-color .2s,box-shadow .2s}
.cb-box .ic{width:15px;height:15px;stroke-width:2.4;opacity:0;transform:scale(.6);transition:opacity .2s,transform .25s var(--ease-out)}
.cb.is-on{box-shadow:inset 0 0 0 1.5px #0a64bd;background:#f6faff}
.cb.is-on .cb-box{background:#0a64bd;box-shadow:none}
.cb.is-on .cb-box .ic{opacity:1;transform:none}
.cb.is-fixed{cursor:default}
.cb.is-fixed .cb-box{background:#5d7390}

/* ---------- Paketi ---------- */
.trial{display:flex;align-items:center;gap:14px;padding:14px 18px;border-radius:14px;background:linear-gradient(112deg,#e8f2fd,#e3f7f0);box-shadow:inset 0 0 0 1px #0a64bd1f}
.trial-ic{width:40px;height:40px;flex:none;display:grid;place-items:center;border-radius:11px;background:var(--grad-btn);color:#fff;box-shadow:0 10px 20px -10px #0a49b699}
.trial b{display:block;font-size:15px;color:#0b2a5a}
.trial small{display:block;font-size:13px;color:#3f5673;line-height:1.45}
.bill{position:relative;display:inline-grid;grid-template-columns:1fr 1fr;padding:4px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px #d3deea;justify-self:start;isolation:isolate}
.bill-o{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border-radius:10px;font-size:14px;font-weight:750;color:#37506d;cursor:pointer;white-space:nowrap;transition:color .25s}
.bill-o small{font-weight:700;font-size:12px;margin-left:6px;color:#07747b;transition:color .25s}
.bill-o.is-on{color:#fff}
.bill-o.is-on small{color:#c8f5e8}
.bill-pill{position:absolute;z-index:0;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:10px;background:var(--grad-btn);box-shadow:0 8px 18px -8px #0a49b699;transition:transform .4s var(--ease-out)}
.bill:has(.bill-o:last-of-type.is-on) .bill-pill{transform:translateX(100%)}
.fs-plans{gap:0}
.plans{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding-top:12px}
.plan{position:relative;display:flex;flex-direction:column;gap:10px;padding:20px 16px 16px;border-radius:var(--r-card);background:#fff;box-shadow:var(--sh-1),inset 0 0 0 1px #d3deea;cursor:pointer;min-width:0;transition:box-shadow .3s var(--ease-out),transform .3s var(--ease-soft)}
.plan-badge{position:absolute;top:-11px;left:14px;box-shadow:0 6px 14px -6px #06573f99;font-size:11px;font-weight:800;color:#fff;background:linear-gradient(90deg,#08784f,#066f78);padding:3px 9px;border-radius:999px}
.plan-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.plan-name{font-size:18px;font-weight:800;letter-spacing:-.03em;color:#0b2a5a}
.plan-price{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.plan-price strong{font-size:clamp(26px,2.2vw,32px);font-weight:800;letter-spacing:-.04em;color:#0b2a5a;font-variant-numeric:tabular-nums;white-space:nowrap}
.plan-price small{font-size:13px;color:var(--muted);font-weight:600}
.plan-save{font-size:12.5px;font-weight:700;color:#067a5c;margin-top:-6px}
.plan-lead{font-size:13.5px;line-height:1.45;color:#3f5673}
.plan-meta{display:grid;gap:6px;margin-top:auto;padding-top:12px;border-top:1px solid #e6edf4}
.plan-meta span{display:flex;align-items:center;gap:7px;font-size:12.5px;color:#34496a;line-height:1.3}
.plan-meta .ic{width:15px;height:15px;color:#0a8f8a}
.plan.is-on{box-shadow:0 18px 40px -20px #0a49b699,inset 0 0 0 2px #0a64bd;background:#f8fbff}
.plan.is-on .plan-name{color:#0a4f9c}

/* ---------- Teme ---------- */
.pv{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(240px,1fr);gap:24px;align-items:center;padding:16px;border-radius:20px;background:#fff;box-shadow:var(--sh-2),0 0 0 1px #0b34730d}
.pv-frame{border-radius:12px;overflow:hidden;background:#eef3f8;box-shadow:0 0 0 1px #0b34731a;min-width:0}
.pv-bar{display:flex;align-items:center;gap:6px;height:34px;padding:0 12px;background:#f5f8fc;border-bottom:1px solid #e3ebf3}
.pv-bar>i{width:9px;height:9px;border-radius:50%;background:#d5dfea}
.pv-bar>span{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;margin:0 8px 0 10px;min-width:0;height:22px;border-radius:7px;background:#fff;box-shadow:0 0 0 1px #e1e9f2;font-size:12px;color:#3f5673}
.pv-bar>span .ic{width:12px;height:12px;color:#067a5c}
.pv-url{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pv-img{aspect-ratio:16/10;overflow:hidden;background:#e9eff6}
.pv-img img{width:100%;height:100%;object-fit:cover;object-position:top}
.pv-info{display:grid;gap:10px;padding:4px 8px 4px 0;min-width:0}
.pv-grp{font-size:13px;font-weight:700;color:#07747b}
.pv-name{font-size:30px;font-weight:800;letter-spacing:-.04em;color:#0b2a5a;line-height:1.05}
.pv-info>p:not(.pv-grp):not(.fine){font-size:15px;line-height:1.55;color:#3f5673}
.pv-info ul{list-style:none;margin:2px 0 0;padding:0;display:grid;gap:8px}
.pv-info li{display:flex;gap:9px;font-size:14px;color:#1c355a;line-height:1.4}
.pv-info li .ic{width:17px;height:17px;color:#0a8f8a;margin-top:1px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{min-height:44px;padding:0 16px;border:0;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px #d3deea;font-size:13.5px;font-weight:700;color:#37506d;transition:background-color .2s,color .2s,box-shadow .2s,transform .16s var(--ease-out)}
.chip span{font-weight:800;color:#07747b;margin-left:2px}
.chip:active{transform:scale(.97)}
.chip.is-on{background:#0b2a5a;color:#fff;box-shadow:none}
.chip.is-on span{color:#8ce6ce}
.ths{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}
.th{position:relative;display:grid;border-radius:14px;background:#fff;padding:6px 6px 0;box-shadow:inset 0 0 0 1px #d3deea;cursor:pointer;transition:box-shadow .25s,transform .25s var(--ease-soft)}
.th-img{aspect-ratio:16/10;border-radius:9px;overflow:hidden;background:#e9eff6}
.th-img img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .5s var(--ease-soft)}
.th-tx{display:grid;gap:1px;padding:10px 8px 12px}
.th-tx b{font-size:14.5px;color:#0b2a5a}
.th-tx small{font-size:12.5px;color:var(--muted)}
.th-check{position:absolute;top:12px;right:12px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#0a64bd;color:#fff;box-shadow:0 6px 14px -4px #0a49b6aa;opacity:0;transform:scale(.7);transition:opacity .2s,transform .3s var(--ease-out)}
.th-check .ic{width:16px;height:16px;stroke-width:2.4}
.th.is-on{box-shadow:inset 0 0 0 2px #0a64bd,0 16px 32px -20px #0a49b699}
.th.is-on .th-check{opacity:1;transform:none}

/* ---------- Naslov ---------- */
.rules{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px 14px}
.rules li{display:flex;align-items:center;gap:6px;font-size:12.5px;color:#5d7088;transition:color .2s}
.rules li .ic{width:15px;height:15px;stroke-width:2;color:#8a9bb0}
.rules li.ok{color:#0b5b47}
.rules li.ok .ic{color:#067a5c}
.tbtn{justify-self:start;display:inline-flex;align-items:center;min-height:44px;padding:0 2px;border:0;background:none;color:#0a64bd;font-size:14px;font-weight:750;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.tbtn:hover{color:#06478f;text-decoration-thickness:2px}
.addr-pv{position:relative;overflow:hidden;border-radius:var(--r-card);padding:24px;color:#fff;background:linear-gradient(150deg,#0a3b86,#061b42);box-shadow:var(--sh-2);display:grid;gap:14px;min-width:0}
.addr-pv::before{content:"";position:absolute;width:260px;height:260px;right:-120px;top:-130px;border-radius:50%;background:radial-gradient(circle,#15c77947,transparent 65%);pointer-events:none}
.addr-l{position:relative;font-size:13px;font-weight:650;color:#a9bdd8}
.prod-pv .addr-l{color:var(--muted)}
.addr-bar{position:relative;display:flex;align-items:center;gap:10px;padding:14px 16px;border-radius:12px;background:#ffffff14;box-shadow:inset 0 0 0 1px #ffffff26;min-width:0;transition:box-shadow .3s}
.addr-bar .ic{width:18px;height:18px;color:#8ce6ce}
.addr-url{min-width:0;font-size:clamp(15px,1.5vw,18px);font-weight:600;color:#dce8f6;overflow-wrap:anywhere;line-height:1.35}
.addr-url b{color:#fff;font-weight:800}
.addr-proto{color:#8fa6c6;font-weight:500}
.addr-pv.is-ok .addr-bar{box-shadow:inset 0 0 0 1.5px #5fe0c4}
.addr-st{position:relative;display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:700;color:#c9d8ec}
.addr-st .ic{width:17px;height:17px}
.addr-pv.is-ok .addr-st{color:#8ce6ce}
.addr-f{position:relative;list-style:none;margin:4px 0 0;padding:14px 0 0;border-top:1px solid #ffffff1f;display:grid;gap:9px}
.addr-f li{display:flex;gap:9px;font-size:13.5px;color:#dce8f6;line-height:1.4}
.addr-f .ic{width:17px;height:17px;color:#8ce6ce;margin-top:1px}

/* ---------- Pregled ---------- */
.rv{margin:0;display:grid}
.rv-row{display:grid;grid-template-columns:130px minmax(0,1fr) auto;gap:4px 16px;align-items:center;padding:12px 0;border-bottom:1px solid #e9eff5}
.rv-row:first-child{padding-top:0}
.rv-row:last-child{border-bottom:0;padding-bottom:0}
.rv dt{font-size:13px;font-weight:700;color:var(--muted)}
.rv dd{margin:0;font-size:15px;font-weight:700;color:#0b2a5a;min-width:0;overflow-wrap:anywhere}
.rv dd small{display:block;font-size:13px;font-weight:500;color:var(--muted);margin-top:2px}
.rv-th{display:flex;align-items:center;gap:10px}
.rv-th img{width:48px;height:30px;object-fit:cover;object-position:top;border-radius:6px;box-shadow:0 0 0 1px #0b34731a}
.tot{position:relative;overflow:hidden;border-radius:var(--r-card);padding:24px;color:#fff;background:linear-gradient(150deg,#0a3b86,#061b42);box-shadow:var(--sh-2);display:grid;gap:10px}
.tot::before{content:"";position:absolute;width:260px;height:260px;right:-120px;bottom:-140px;border-radius:50%;background:radial-gradient(circle,#1887ee47,transparent 65%);pointer-events:none}
.tot>*{position:relative}
.tot-l{font-size:14px;font-weight:700;color:#a9bdd8}
.tot-p{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.tot-p strong{font-size:44px;font-weight:800;letter-spacing:-.045em;line-height:1;font-variant-numeric:tabular-nums}
.tot-p small{font-size:14px;color:#c9d8ec}
.tot-trial{display:flex;gap:8px;align-items:flex-start;font-size:14px;font-weight:700;color:#8ce6ce;line-height:1.4}
.tot-trial .ic{width:18px;height:18px;margin-top:1px}
.tot-s{font-size:13px;color:#c9d8ec;line-height:1.5}
.tot ul{list-style:none;margin:4px 0 0;padding:12px 0 0;border-top:1px solid #ffffff1f;display:grid;gap:8px}
.tot li{display:flex;align-items:center;gap:9px;font-size:13.5px;color:#e6f0fb}
.tot li .ic{width:17px;height:17px;color:#8ce6ce}
.tbtn-l{color:#8ce6ce}
.tbtn-l:hover{color:#fff}
.tot .tbtn:focus-visible{outline-color:#5fe0c4}
.terms{padding:4px 0}
.cb-terms{align-items:flex-start;padding:14px 16px;font-weight:600;line-height:1.45;max-width:640px}
.cb-terms .cb-box{margin-top:0}

/* ---------- Prvi izdelek ---------- */
.ready{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:14px;background:#e6f7f1;box-shadow:inset 0 0 0 1px #067a5c29;color:#0b4a3b;font-size:14.5px;line-height:1.5}
.ready>.ic{width:34px;height:34px;padding:8px;border-radius:10px;background:linear-gradient(135deg,#0b8a55,#067a78);color:#fff;stroke-width:2.2}
.ready b{color:#073a2e}
.prod-pv{display:grid;gap:12px;align-content:start}
.pc{display:grid;border-radius:var(--r-card);overflow:hidden;background:#fff;box-shadow:var(--sh-2),0 0 0 1px #0b34730d;max-width:340px}
.pc-img{aspect-ratio:4/3;display:grid;place-items:center;background:linear-gradient(135deg,#e8f2fd,#e3f7f0);color:#7aa0c8}
.pc-img .ic{width:44px;height:44px;stroke-width:1.2}
.pc-tx{display:grid;gap:6px;padding:16px}
.pc-tx small{font-size:12px;font-weight:700;color:#07747b}
.pc-tx b{font-size:16px;color:#0b2a5a;overflow-wrap:anywhere;line-height:1.3}
.pc-row{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap}
.pc-row strong{font-size:20px;font-weight:800;letter-spacing:-.02em;color:#0b2a5a;font-variant-numeric:tabular-nums}
.pc-row span{font-size:12.5px;font-weight:650;color:#8a4b12}
.pc-row span.in{color:#067a5c}
.pc-btn{margin-top:6px;display:grid;place-items:center;min-height:42px;border-radius:10px;background:#0b2a5a;color:#fff;font-size:14px;font-weight:750}
.next{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;counter-reset:n}
.next li{counter-increment:n;position:relative;display:grid;gap:2px;padding:14px 14px 14px 52px;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1px #dfe7f0}
.next li::before{content:counter(n);position:absolute;left:14px;top:14px;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;font-size:13px;font-weight:800;color:#fff;background:linear-gradient(135deg,#0a49b6,#1678de 55%,#05ada4)}
.next b{font-size:14.5px;color:#0b2a5a}
.next small{font-size:13px;color:var(--muted);line-height:1.4}
.end-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px}

/* Stran »Račun« */
.aside-note{border-radius:var(--r-card);padding:24px;background:#fff9;box-shadow:inset 0 0 0 1px #0b34731a;display:grid;gap:16px}
.aside-note h2{font-size:15px;font-weight:800;color:#0b2a5a}
.aside-note>p{font-size:13.5px;color:var(--muted);line-height:1.55}
.need{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.need li{display:flex;gap:12px;align-items:flex-start}
.need .ic{width:36px;height:36px;padding:8px;border-radius:10px;background:#e9f1fa;color:#0a5fb0}
.need b{display:block;font-size:14px;color:#0b2a5a}
.need small{display:block;font-size:13px;color:var(--muted)}

/* ---------- Gumbi (kot na predstavitvi) ---------- */
.ob-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:32px;padding-top:24px;border-top:1px solid #dbe5ef}
.ob-actions #ob-next{margin-left:auto}
.ob-actions.is-last{display:none}
.btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:52px;padding:6px 8px 6px 22px;border:0;border-radius:var(--r-btn);font-size:15px;font-weight:750;letter-spacing:-.01em;text-decoration:none;white-space:nowrap;transition:transform .16s var(--ease-out),background-color .2s,box-shadow .3s var(--ease-out),color .2s}
.btn:active{transform:scale(.97)}
.btn-ic{width:40px;height:40px;border-radius:9px;display:grid;place-items:center;transition:transform .3s var(--ease-out)}
.btn-ic .ic{width:18px;height:18px}
.btn-primary{background:var(--grad-btn);color:#fff;box-shadow:0 1px 0 #ffffff33 inset,0 14px 30px -10px #0a49b699}
.btn-primary .btn-ic{background:#ffffff26}
.btn-light{background:#fff;color:#07377f;box-shadow:inset 0 0 0 1px #d6e2ee}
.btn-light .btn-ic{background:#eef4fa;color:#0a5fb0}
#ob-prev{padding:6px 18px 6px 8px}
.end-actions .btn-light{padding:6px 22px}

@media (hover:hover) and (pointer:fine){
  .ob-back-site:hover{background:#eef4fb;color:#06478f}
  .ob-back-site:hover .ic{transform:translateX(-3px)}
  .wordmark:hover .wordmark-mark{transform:rotate(-6deg) scale(1.04)}
  .btn::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,#ffffff40 50%,transparent 70%);transform:translateX(-120%);transition:transform .7s var(--ease-soft);pointer-events:none}
  .btn{transition:transform .25s var(--ease-soft),box-shadow .25s,background-color .25s,color .25s}
  .btn:hover{transform:translateY(-2px)}
  .btn:hover::after{transform:translateX(120%)}
  .btn:active{transform:translateY(0) scale(.98)}
  .btn-primary:hover{box-shadow:0 1px 0 #ffffff33 inset,0 18px 38px -10px #0a49b6b3}
  .btn-light:hover{box-shadow:inset 0 0 0 1px #b6cbe0,0 16px 32px -14px #061b4266}
  .btn:hover .btn-ic{transform:translateX(3px)}
  #ob-prev:hover .btn-ic{transform:translateX(-3px)}
  .ob-steps button:not(:disabled):hover{background:#ffffff14;color:#fff}
  .ob-steps button:not(:disabled):hover .sn{transform:scale(1.06)}
  .ch:hover:not(.is-on){box-shadow:inset 0 0 0 1px #9fb4cb;background:#fbfdff}
  .plan:hover:not(.is-on){transform:translateY(-3px);box-shadow:var(--sh-2),inset 0 0 0 1px #b6cbe0}
  .th:hover{transform:translateY(-3px)}
  .th:hover:not(.is-on){box-shadow:inset 0 0 0 1px #9fb4cb,0 16px 32px -20px #0a2a5a66}
  .th:hover .th-img img{transform:scale(1.04)}
  .chip:hover:not(.is-on){box-shadow:inset 0 0 0 1px #9fb4cb;color:#0b2a5a}
  .cb:hover:not(.is-on):not(.is-fixed){box-shadow:inset 0 0 0 1px #9fb4cb}
  .in-btn:hover{background:#e2ecf7}
}

/* ---------- Odzivnost ---------- */
@media (max-width:1279px){
  .plans{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pv{grid-template-columns:1fr;gap:16px}
  .pv-info{padding:0 6px 6px}
}
@media (max-width:1079px){
  .ob-shell{grid-template-columns:minmax(0,1fr);padding-top:20px}
  .ob-rail{display:none}
  .ob-dots{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:4px;margin:0 0 14px}
  .ob-dots button{min-height:44px;border:0;background:none;padding:0;display:grid;align-items:center}
  .ob-dots i{display:block;height:5px;border-radius:3px;background:#cfdae6;transition:background-color .3s}
  .ob-dots .done i{background:#0a8f8a}
  .ob-dots .cur i{background:var(--grad-btn)}
  .ob-dots button:disabled{cursor:default}
  .ob-note-m{display:flex;justify-content:center;margin-top:18px}
  .split{grid-template-columns:minmax(0,1fr)}
  .split-rv .tot,.split-addr .addr-pv{order:-1}
}
@media (max-width:759px){
  :root{--top:58px}
  .ob-top-sep,.ob-top-title{display:none}
  .ob-back-site span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .ob-back-site{width:44px;padding:0;justify-content:center}
  .wordmark{font-size:19px}
  .ob-shell{padding:14px 16px 0}
  .sh{margin-bottom:20px}
  .sh h1{font-size:clamp(28px,8vw,34px)}
  .sh-p{font-size:15px}
  .grid2,.chs-2,.next{grid-template-columns:minmax(0,1fr)}
  .cardx{padding:18px}
  .plans{grid-template-columns:minmax(0,1fr);gap:10px}
  .plan{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;row-gap:6px;padding:16px}
  .plan.is-feat{margin-top:8px}
  .plan-top{grid-column:1/-1}
  .plan-price{grid-column:1/-1}
  .plan-save{margin-top:-4px;grid-column:1/-1}
  .plan-lead{grid-column:1/-1}
  .plan-meta{grid-column:1/-1;grid-template-columns:repeat(2,minmax(0,1fr));padding-top:10px}
  .plan-meta span:last-child{grid-column:1/-1}
  .plan.is-on{transform:none}
  .bill{justify-self:stretch}
  .ths{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .th-tx{padding:8px 6px 10px}
  .th-tx small{display:none}
  .th-check{top:10px;right:10px;width:24px;height:24px}
  .pv{padding:10px;border-radius:16px}
  .pv-name{font-size:24px}
  .chips{flex-wrap:nowrap;overflow-x:auto;margin:0 -16px;padding:2px 16px 6px;scrollbar-width:none;scroll-snap-type:x proximity}
  .chips::-webkit-scrollbar{display:none}
  .chip{flex:none;scroll-snap-align:start}
  .rv-row{grid-template-columns:minmax(0,1fr) auto}
  .rv dt{grid-column:1/-1}
  .tot-p strong{font-size:38px}
  .pc{max-width:none}
  .ob-actions{position:sticky;bottom:0;z-index:30;margin:24px -16px 0;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:#fffffff2;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:0;box-shadow:0 -1px 0 #0b34731a,0 -12px 24px -18px #0b2a5a59}
  .ob-actions .btn{min-height:48px}
  #ob-next{flex:1;justify-content:space-between}
  .ob-note-m{margin-bottom:18px}
  .end-actions .btn{flex:1 1 100%}
  .end-actions .tbtn{justify-self:center;margin:0 auto}
}
@media (min-width:1800px){
  .ob-shell,.ob-top-in{max-width:1440px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;scroll-behavior:auto!important}
  .btn::after{display:none}
}

/* 3. 10. 2026: znak vrečke po razmerjih ikone aplikacije (enako kot assets/style.css v9) */
.wordmark-mark{width:34px;height:34px;border-radius:10px}
.wordmark-mark::before{display:none}
.wordmark-mark::after{left:0;right:0;top:0;bottom:0;height:auto;border:0;border-radius:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 11V8.6a3 3 0 0 1 6 0V11'/%3E%3Cpath d='M6.6 11h10.8v3.3a3.7 3.7 0 0 1-3.7 3.7h-3.4a3.7 3.7 0 0 1-3.7-3.7z'/%3E%3C/svg%3E") center/100% 100% no-repeat}

/* ---------- app: pravi obrazec /zacetek ---------- */
.ob-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.chs-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.lbl{font-size:14px;font-weight:700;color:#0b2a5a}
.up{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.up-btn{min-height:46px;padding:6px 18px;gap:10px;cursor:pointer}
.up-btn .ic{width:19px;height:19px}
.fl:has(#f-pImage:focus-visible) .up-btn,.up-btn:focus-within{outline:2px solid #0a8f8a;outline-offset:2px}
.pc-img img{width:100%;height:100%;object-fit:cover}
.addr-pv.is-bad .addr-bar{box-shadow:inset 0 0 0 1.5px #ff9aa8}
.addr-pv.is-bad .addr-st{color:#ffc2cb}
@keyframes ob-spin{to{transform:rotate(360deg)}}
.addr-st svg path[d^="M12 3a9"]{transform-origin:12px 12px;animation:ob-spin .9s linear infinite}
#ob-next[aria-busy="true"]{opacity:.85;cursor:progress}
#ob-next[aria-busy="true"] .btn-ic{animation:ob-spin 1s linear infinite}
.ob-actions.is-final #ob-next{min-width:min(100%,260px)}
@media (max-width:759px){.ob-actions.is-final #ob-next{min-width:0}}
@media (max-width:379px){#ob-prev{flex:none;padding:6px 8px}#ob-prev>span:last-child{display:none}}
/* Potrditev in zaprt vpis */
.ob-solo{min-height:calc(100dvh - var(--top));display:grid;place-items:start center;padding:clamp(28px,6vw,72px) var(--gut) 64px}
.ob-solo-card{max-width:680px;width:100%;gap:16px}
.ob-solo-card h1{font-size:clamp(28px,4vw,38px);letter-spacing:-.03em;color:#0b2a5a;line-height:1.1}
.ob-solo-card>p{font-size:15.5px;color:#3f5673;line-height:1.6}
.ob-solo-card>p.sh-n{font-size:13px;color:#07747b;margin:0}
.ob-solo-ic{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#0a49b6,#1678de 55%,#05ada4);box-shadow:0 14px 30px -12px #0a49b699}
.ob-solo-ic .ic{width:26px;height:26px}
.ob-solo-card .next{grid-template-columns:minmax(0,1fr)}
.ob-solo-card .next li{background:#f6f9fc}
/* Brez JS: navaden obrazec */
.ob-plain{display:grid;grid-template-columns:minmax(0,1fr);min-width:0;gap:18px}
.ob-plain fieldset{min-width:0;border:0;margin:0;padding:22px;background:#fff;border-radius:var(--r-card);box-shadow:var(--sh-1);display:grid;gap:12px}
.ob-plain legend{font-weight:800;color:#0b2a5a;padding:0;margin-bottom:6px}
.ob-plain label{display:grid;gap:6px;font-size:14px;font-weight:600}
.ob-plain input:not([type=checkbox]),.ob-plain select{width:100%;min-width:0;min-height:46px;padding:10px 12px;border-radius:var(--r-in);border:1px solid #c9d6e4;background:#fff}
.ob-plain .ob-plain-check{display:flex;gap:10px;align-items:flex-start;font-weight:500}
.ob-plain-check input{flex:none;margin-top:4px}
.ob-plain-check span{min-width:0;overflow-wrap:anywhere}
.ob-plain .err{color:var(--bad);font-weight:600}
@media (max-width:899px){.chs-3{grid-template-columns:minmax(0,1fr)}}
.is-static .ob-top-title{display:inline}
.up-meta{display:flex;align-items:center;gap:4px 12px;flex-wrap:wrap;min-width:0}
.up-meta .help{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.up-meta .tbtn{min-height:32px;font-size:13px}
.ob-solo-card>p.ob-solo-fine{font-size:14px;color:var(--muted)}
.ob-solo-fine a{font-weight:700}
/* Zaščita oddaje (PoW, časovna past, omejitev prijav) */
.ob-protect{display:flex;align-items:flex-start;gap:12px;margin:18px 0 0;padding:14px 16px;border-radius:12px;font-size:14px;line-height:1.5;font-weight:600;outline:none}
.ob-protect-ic{width:28px;height:28px;flex:none;display:grid;place-items:center;border-radius:8px}
.ob-protect-ic .ic{width:17px;height:17px}
.ob-protect.is-wait{background:#eef5fd;color:#0b3a6e;box-shadow:inset 0 0 0 1px #cfe0f3}
.ob-protect.is-wait .ob-protect-ic{background:#dbeafb;color:#0a64bd}
.ob-protect.is-wait .ob-protect-ic path{transform-origin:12px 12px;animation:ob-spin .9s linear infinite}
.ob-protect.is-error{background:var(--bad-bg);color:#7d1726;box-shadow:inset 0 0 0 1px #f2c4cc}
.ob-protect.is-error .ob-protect-ic{background:#f9d9de;color:var(--bad)}
.ob-protect:focus-visible{box-shadow:inset 0 0 0 1px #f2c4cc,0 0 0 3px #0a8f8a}
@media (prefers-reduced-motion:reduce){.ob-protect.is-wait .ob-protect-ic path{animation:none}}
.ob-stage+.ob-protect,.ob-protect+.ob-stage{margin-bottom:18px}