/* O nama i Kontakt. Okvir je u alati-v2.css i naslovna-v2.css. */
body.ziher-onama-v2 #masthead,
body.ziher-onama-v2 #colophon,
body.ziher-onama-v2 .entry-header,
body.ziher-onama-v2 #ziher-brko-fab,
body.ziher-onama-v2 #ast-scroll-top{display:none!important}
body.ziher-onama-v2,
body.ziher-onama-v2 #page,
body.ziher-onama-v2 .site-content,
body.ziher-onama-v2 .ast-container,
body.ziher-onama-v2 #primary,
body.ziher-onama-v2 #main{margin:0!important;padding:0!important;max-width:none!important;width:100%!important;background:#060a15!important}

#app .on-main{gap:40px}
#app .on-hero{align-items:center}
#app .on-hero .strip{margin-top:4px}
#app .on-brko{margin:0;align-items:center}
#app .on-brko .bub{margin-bottom:0;font-size:15px}
#app .ic{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:10px;flex:none}
#app .ic.g{background:var(--gsoft);color:var(--green)}
#app .ic.o{background:var(--osoft);color:var(--orange)}
#app .on-two{display:grid;gap:14px}
@container app (min-width:761px){#app .on-two{grid-template-columns:1fr 1fr}}
#app .on-two h3{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:800;margin:0 0 12px}
#app .on-list{margin:0;padding:0;list-style:none;display:grid;gap:10px}
#app .on-list li{position:relative;padding-left:20px;color:#c3cce0;font-size:15px;line-height:1.5}
#app .on-list li::before{content:"";position:absolute;left:2px;top:.6em;width:7px;height:7px;border-radius:50%;background:var(--green)}
#app .on-no .on-list li::before{background:var(--orange)}
#app .on-steps{margin:0;padding:0;list-style:none;display:grid;gap:12px}
@container app (min-width:900px){#app .on-steps{grid-template-columns:repeat(5,minmax(0,1fr))}}
#app .on-steps li{display:flex;gap:12px;align-items:flex-start;padding:16px;border-radius:var(--r);border:1px solid var(--line2);background:var(--card);min-width:0}
@container app (min-width:900px){#app .on-steps li{flex-direction:column}}
#app .on-steps i{font-style:normal;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--gsoft);color:var(--green);font-weight:800;flex:none}
#app .on-steps b{display:block;font-size:15px;margin-bottom:4px}
#app .on-steps span{display:block;font-size:14px;color:var(--mut);line-height:1.5}
#app .on-steps span b{display:inline;font-size:inherit;color:var(--fg);margin:0}
#app .on-trust-c{display:grid;gap:18px;padding:22px;background:linear-gradient(135deg,rgba(34,192,138,.08),rgba(12,19,39,1) 55%)}
@container app (min-width:900px){#app .on-trust-c{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:center;gap:32px;padding:28px}}
#app .on-trust-t{display:grid;gap:10px}
#app .on-trust-t h2{font-size:24px;font-weight:800;letter-spacing:-.01em}
#app .on-trust-t p{margin:0;color:#c3cce0;max-width:60ch}
#app .on-act{display:flex;flex-wrap:wrap;gap:8px}
#app .on-upd{display:grid;gap:10px;padding:16px;border-radius:16px;background:rgba(6,10,21,.55);border:1px solid rgba(245,163,10,.3)}
#app .on-upd .chip{width:max-content}
#app .on-upd dl{margin:0;display:grid;gap:8px}
#app .on-upd dl div{display:grid;grid-template-columns:70px 1fr;gap:8px;font-size:14px}
#app .on-upd dt{color:var(--mut)}
#app .on-upd dd{margin:0;color:var(--fg)}
#app .on-odg{display:flex;flex-wrap:wrap;align-items:center;gap:16px}
#app .on-odg>div{flex:1 1 320px;min-width:0}
#app .on-odg h2{font-size:18px;font-weight:800;margin:0 0 4px}
#app .on-odg p{margin:0;color:var(--mut);font-size:14px}
#app .r18b{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;border:2px solid var(--orange);color:var(--orange);font-weight:800;flex:none}
#app .on-firma{display:grid;gap:14px}
@container app (min-width:900px){#app .on-firma{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}}
#app .on-dl{margin:0;display:grid;gap:0;padding:6px 18px}
#app .on-dl div{display:grid;grid-template-columns:150px 1fr;gap:12px;padding:12px 0;border-top:1px solid var(--line);font-size:15px}
#app .on-dl div:first-child{border-top:0}
#app .on-dl dt{color:var(--mut)}
#app .on-dl dd{margin:0;min-width:0;overflow-wrap:anywhere}
@container app (max-width:560px){#app .on-dl div{grid-template-columns:1fr;gap:2px}}
#app .on-sto{display:grid;gap:10px;align-content:start}
#app .on-sto h3{font-size:18px;font-weight:800;margin:0}
#app .on-sto p{margin:0;color:#c3cce0;line-height:1.6}
#app .on-sto .pill-nav{width:max-content}
#app .on-kon{display:grid;gap:14px}
@container app (min-width:761px){#app .on-kon{grid-template-columns:1fr 1fr}}
#app .on-k{display:flex;gap:14px;align-items:flex-start;text-decoration:none}
#app .on-k:hover{border-color:rgba(34,192,138,.45)}
#app .on-k b{display:block;font-size:16px;margin:0 0 4px;overflow-wrap:anywhere}
#app .on-k span:not(.ic){display:block;font-size:14px;color:var(--mut);line-height:1.5}
#app .on-cta-c{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding:22px}
#app .on-cta-c h2{font-size:20px;font-weight:800;margin:0 0 4px}
#app .on-cta-c p{margin:0;color:var(--mut)}
#app .sec-h .pill-nav{white-space:nowrap}
body.ziher-kontakt #kontakt{order:-1}
@container app (max-width:560px){
#app .on-main{gap:32px}
#app .sec-h .pill-nav{white-space:normal;min-height:40px;height:auto;padding:8px 14px}
#app .on-brko .brko-ring{--size:72px!important}
#app .on-cta-c .on-act,#app .on-cta-c .btn{width:100%}
}