@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(../assets/fonts/inter-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(../assets/fonts/inter-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url(../assets/fonts/inter-latin-ext-500-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url(../assets/fonts/inter-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(../assets/fonts/inter-latin-ext-600-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(../assets/fonts/inter-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url(../assets/fonts/space-grotesk-latin-ext-500-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url(../assets/fonts/space-grotesk-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:700;font-display:swap;src:url(../assets/fonts/space-grotesk-latin-ext-700-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:700;font-display:swap;src:url(../assets/fonts/space-grotesk-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--bg:#f4f4f4;--bg2:#fff;--tx:#0a0a0a;--mu:#666;--bd:#dcdcdc;--ac:#111;--ac2:#8a8a8a;--on:#fff;--card:rgba(255,255,255,.72);--inv:0;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#050505;--bg2:#0e0e0e;--tx:#f5f5f5;--mu:#a0a0a0;--bd:#2a2a2a;--ac:#fff;--ac2:#7a7a7a;--on:#0a0a0a;--card:rgba(24,24,24,.7);--inv:1}}
:root[data-theme="dark"]{--bg:#050505;--bg2:#0e0e0e;--tx:#f5f5f5;--mu:#a0a0a0;--bd:#2a2a2a;--ac:#fff;--ac2:#7a7a7a;--on:#0a0a0a;--card:rgba(24,24,24,.7);--inv:1}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{background:var(--bg);color:var(--tx);font-family:Inter,system-ui,sans-serif;line-height:1.6;overflow-x:hidden;transition:background .4s,color .4s}
h1,h2,h3,.logo{font-family:'Space Grotesk',Inter,sans-serif;line-height:1.1}
a{color:inherit;text-decoration:none}
svg.i{width:1em;height:1em;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.wrap{max-width:1100px;margin:0 auto;padding:0 22px}
section{padding:96px 0;position:relative}
.grad{background:linear-gradient(110deg,var(--ac),var(--ac2),var(--ac));background-size:200%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:flow 6s linear infinite}
@keyframes flow{to{background-position:200% 0}}
.btn{display:inline-flex;align-items:center;gap:8px;padding:14px 26px;border-radius:99px;font-weight:600;border:1px solid var(--bd);transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .45s ease,background .3s,color .3s,border-color .3s;cursor:pointer;font-size:1rem;font-family:inherit;color:var(--tx);background:transparent}
.btn:hover{transform:translateY(-3px)}
.btn.p{background:var(--ac);color:var(--on);border:0;box-shadow:0 4px 12px -6px var(--ac);animation:pulse 2.6s infinite}
@keyframes pulse{50%{box-shadow:0 6px 16px -6px var(--ac2)}}
.btn.k{background:#0a0a0a;color:#fff;border:1px solid #3a3a3a;box-shadow:0 0 0 0 rgba(0,0,0,0)}
.btn.w{background:#fff;color:#0a0a0a;border:1px solid #d2d2d2;box-shadow:0 0 0 0 rgba(0,0,0,0)}
.btn.k:hover,.btn.w:hover{box-shadow:0 10px 22px -10px rgba(0,0,0,.45)}
/* hero: konsultacija bijela, ostala dva prozirna (samo tekst i okvir) */
.hero .row .btn.k{background:#fff;color:#0a0a0a;border-color:#d2d2d2}
.hero .row .btn.w{background:transparent;color:var(--tx);border-color:var(--tx)}
.btn.sm{padding:9px 18px;font-size:.9rem}
nav{position:fixed;top:env(safe-area-inset-top,0px);left:0;right:0;z-index:50;backdrop-filter:blur(14px);background:var(--card);border-bottom:1px solid var(--bd)}
nav .wrap{display:flex;align-items:center;justify-content:space-between;height:66px;gap:12px}
.logo{font-weight:700;font-size:1.25rem;display:flex;align-items:center;gap:10px}
.lg{filter:invert(var(--inv));transition:.4s}
.logo .lg{height:38px;width:auto}
.hero-logo{height:90px;width:auto;margin-bottom:22px}
.links{display:flex;gap:20px;font-size:.93rem;color:var(--mu)}
.links a.on{color:var(--tx);font-weight:600}
.links a:hover{color:var(--tx)}
.ib.menu-btn,.links a.mcta,.links .mth{display:none}
.m-close{display:none}
@media(max-width:1060px){
  .ib.menu-btn{display:grid}
  .links{position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:0;padding:6px 22px 20px;background:var(--bg2);border-bottom:1px solid var(--bd);
    font-size:1.05rem;max-height:calc(100vh - 66px);overflow-y:auto;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .25s,transform .25s,visibility .25s}
  nav.open .links{opacity:1;visibility:visible;transform:none}
  .links a{padding:15px 0;border-bottom:1px solid var(--bd)}
  nav.open .m-open{display:none}nav.open .m-close{display:block}
}
@media(max-width:560px){
  .links a.mcta{display:flex;justify-content:center;margin-top:16px;padding:14px 26px;border:0;color:var(--on)}
  .links a.mcta:hover{color:var(--on)}
}
@media(max-width:430px){
  nav .wrap{padding:0 20px;gap:8px}
  nav .wrap{height:54px}
  .logo{font-size:.92rem;gap:5px}.logo .lg{height:26px}
  nav .tools{gap:5px}nav .lang button{padding:4px 7px;font-size:.66rem}nav .tools .ib{width:28px;height:28px}nav .tools .ib .i{width:14px;height:14px}
  .links{max-height:calc(100vh - 54px);font-size:.95rem;padding:2px 22px 16px}.links a{padding:12px 0}
  .links a.mcta{padding:12px 24px;margin-top:12px;font-size:.92rem}
}
.tools{display:flex;align-items:center;gap:8px}
.ib{width:38px;height:38px;border-radius:50%;border:1px solid var(--bd);background:transparent;color:var(--tx);display:grid;place-items:center;cursor:pointer;font-size:1.1rem;transition:.3s}
.ib:hover{transform:rotate(15deg);border-color:var(--ac)}
.lang{display:flex;border:1px solid var(--bd);border-radius:99px;overflow:hidden}
.lang button{border:0;background:transparent;color:var(--mu);padding:8px 12px;font:600 .78rem Inter;cursor:pointer;transition:.3s}
.lang button.on{background:var(--ac);color:var(--on)}
.sun{display:none}
:root[data-theme="dark"] .sun{display:block}:root[data-theme="dark"] .moon{display:none}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .sun{display:block}:root:not([data-theme="light"]) .moon{display:none}}
@media(max-width:560px){nav .btn.sm,nav .tools #th{display:none}.links .mth{display:grid;margin:14px auto 0;width:34px;height:34px}}
.bar{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,var(--ac2),var(--ac));width:0;z-index:60}
.hero{min-height:100vh;display:flex;align-items:center;padding:110px 0 70px;margin-bottom:40px;overflow:hidden;position:relative}
.hero>.wrap{width:100%}
.blob{position:absolute;border-radius:50%;filter:blur(90px);opacity:.22;animation:float 12s ease-in-out infinite}
.b1{width:420px;height:420px;background:var(--ac);top:-80px;right:-80px}
.b2{width:340px;height:340px;background:var(--ac2);bottom:-60px;left:-80px;animation-delay:-5s}
@keyframes float{50%{transform:translate(40px,-30px) scale(1.1)}}
.tag{display:inline-block;padding:6px 14px;border:1px solid var(--bd);border-radius:99px;font-size:.82rem;color:var(--mu);background:var(--card);margin-bottom:22px}
.tag.live:before{content:"";display:inline-block;width:8px;height:8px;margin-right:10px;border-radius:50%;background:#22c55e;vertical-align:1px;box-shadow:0 0 0 0 rgba(34,197,94,.55);animation:ping 2s infinite}
@keyframes ping{70%{box-shadow:0 0 0 8px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
.hero h1{font-size:clamp(2.5rem,7vw,5.2rem);letter-spacing:-.03em;max-width:900px}
.hero p.lead{font-size:1.2rem;color:var(--mu);max-width:560px;margin:24px 0 34px}
.row{display:flex;gap:14px;flex-wrap:wrap}
.stats{display:flex;gap:40px;margin-top:56px;flex-wrap:wrap}
.stats b{font-family:'Space Grotesk';font-size:2rem;display:block}
.stats span{color:var(--mu);font-size:.9rem}
.sec-h{margin-bottom:48px}
.sec-h small{color:var(--mu);font-weight:600;letter-spacing:.12em;text-transform:uppercase;font-size:.78rem}
.sec-h h2{font-size:clamp(1.9rem,4.5vw,3rem);margin:10px 0;letter-spacing:-.02em}
.sec-h p{color:var(--mu);max-width:560px}
.grid{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.card{background:var(--card);border:1px solid var(--bd);border-radius:22px;padding:30px;backdrop-filter:blur(8px);transition:transform .4s cubic-bezier(.2,.7,.2,1),border-color .4s ease,box-shadow .5s ease;position:relative;overflow:hidden}
.card:hover{transform:translateY(-8px);border-color:var(--ac);box-shadow:0 8px 20px -14px var(--ac)}
.card .ic{font-size:1.7rem;width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:var(--ac);color:var(--on);margin-bottom:18px;transition:.4s}
.card:hover .ic{transform:rotate(-8deg) scale(1.1)}
.card h3{margin-bottom:8px;font-size:1.25rem}
.card p{color:var(--mu);font-size:.95rem}
.card .lnk{display:inline-block;margin-top:16px;font-weight:600;font-size:.92rem;border-bottom:1px solid var(--ac2)}
.alt{background:var(--bg2)}
.steps{grid-template-columns:repeat(2,1fr);grid-auto-rows:1fr;align-items:stretch}

.steps .card{padding:30px}
.step .sub{color:var(--mu);margin:0 0 16px;font-size:1rem}
.sl{list-style:none;padding:0;margin:0}
.sl li{padding:13px 0;border-top:1px dashed var(--bd)}
.sl b{display:block;font-weight:600;font-size:.98rem;margin-bottom:2px}
.sl span{display:block;color:var(--mu);font-size:.9rem;line-height:1.5}
.step .lnk{margin-top:20px}
.step .n{font-family:'Space Grotesk';font-size:3rem;font-weight:700}
.about{display:grid;gap:40px;grid-template-columns:1fr 1fr;align-items:center}
@media(max-width:820px){.about,.price-note,.ct{grid-template-columns:1fr!important}}
.about p{color:var(--mu);margin-bottom:22px;font-size:1.05rem}
.ticks{padding:0;margin:0}
.about .card:has(.ticks){display:flex;justify-content:center}
.about .card .ticks{width:fit-content;max-width:100%}
.ticks li{list-style:none;padding:8px 0;display:flex;gap:12px;align-items:flex-start}
.ticks li:before{content:"";flex:none;width:20px;height:20px;margin-top:3px;background:var(--ac);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat}
.shot{aspect-ratio:2/1;border-radius:14px;margin-bottom:18px;overflow:hidden;border:1px solid var(--bd);background:var(--bg2)}
.shot img{width:100%;height:100%;object-fit:cover;object-position:top left;display:block;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.card:hover .shot img{transform:scale(1.06)}
.mq{overflow:hidden;margin:-18px 0;padding:18px 0;-webkit-mask:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.mq-track{display:flex;width:max-content;animation:mq var(--dur,40s) linear infinite;will-change:transform}
.mq:hover .mq-track{animation-play-state:paused}
.mq-g{display:flex;gap:20px;padding-right:20px}
@keyframes mq{to{transform:translateX(-50%)}}
.mq .card{width:340px;flex:none;padding:22px;display:flex;flex-direction:column}
.mq .card:hover{transform:translateY(-6px)}
.mq .card h3{margin-bottom:12px}
.mq .card .btn{margin:auto 0 0;align-self:flex-start;padding:7px 14px;font-size:.82rem}
.mq .card p{margin-bottom:16px}
.mq .card .shot{margin-bottom:16px}
.consult{text-align:center;border-radius:32px;padding:64px 28px;background:linear-gradient(135deg,#0a0a0a,#3a3a3a 60%,#8a8a8a);border:1px solid var(--bd);color:#fff}
.consult h2{font-size:clamp(1.9rem,4.5vw,3.2rem);margin-bottom:14px}
.consult p{max-width:640px;margin:0 auto 30px;opacity:.9}
.consult .btn{background:#fff;color:#0a0a0a;border:0}
.consult .btn.o{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.6)}
.consult .row{justify-content:center}
.price-note{display:grid;gap:30px;grid-template-columns:1.1fr 1fr;align-items:center}
form{display:grid;gap:14px}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:560px){.f2{grid-template-columns:1fr}}
input,textarea,select{width:100%;padding:15px 18px;border-radius:14px;border:1px solid var(--bd);background:var(--card);color:var(--tx);font:inherit}
select option{background:var(--bg2);color:var(--tx)}
input:focus,textarea:focus,select:focus{outline:2px solid var(--ac);border-color:transparent}
.ct{display:grid;gap:40px;grid-template-columns:1fr 1.1fr}
.ct a.c{display:flex;align-items:center;gap:12px;padding:8px 0;color:var(--mu);transition:.3s}
.ct a.c:hover{color:var(--tx);transform:translateX(6px)}
.ct a.c svg{font-size:1.2rem}
footer{padding:64px 0 100px;border-top:1px solid var(--bd);color:var(--mu);font-size:.93rem}
footer .fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:40px}
footer h3{line-height:1.6;font-family:'Space Grotesk',Inter,sans-serif;color:var(--tx);font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:14px}
footer .fbrand p{max-width:340px}
footer .slogan{font-family:'Space Grotesk',Inter,sans-serif;font-weight:700;font-size:1.15rem;color:var(--tx);margin:12px 0 20px}
footer .btn{padding:14px 26px;font-size:1rem;animation:none}
footer .fk{display:flex;align-items:center;gap:10px;padding:6px 0;color:var(--mu);transition:color .3s,transform .35s cubic-bezier(.2,.7,.2,1)}
footer .fk:hover{color:var(--tx);transform:translateX(5px)}
footer .fk svg{font-size:1.1rem}
footer .fbot{grid-column:1/-1;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-top:24px;border-top:1px solid var(--bd);font-size:.85rem}
@media(max-width:820px){footer .fgrid{grid-template-columns:1fr 1fr}footer .fbrand{grid-column:1/-1}}
@media(max-width:520px){footer .fgrid{grid-template-columns:1fr}}
.float{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:55;transform:translateY(120px);transition:.5s}
.float.show{transform:none}
.float.fm{display:none}
@media(max-width:560px){.float.fd{display:none}.float.fm{display:inline-flex}}
.rv{opacity:0;transform:translateY(36px);transition:opacity .8s,transform .8s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}
.rv.done{transition-delay:0s}
.card.rv.done{transition:transform .4s cubic-bezier(.2,.7,.2,1),border-color .4s ease,box-shadow .5s ease}
.card.rv.done:hover{transform:translateY(-8px)}
.ok{display:none;padding:14px;border-radius:14px;background:rgba(128,128,128,.15);border:1px solid var(--ac2)}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}.mq{overflow-x:auto}}

/* custom dropdown */
.dd{position:relative}
.dd-native{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;border:0!important;margin:0!important;opacity:0;pointer-events:none;overflow:hidden;clip:rect(0 0 0 0)}
.dd-btn{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:15px 18px;border-radius:14px;border:1px solid var(--bd);background:var(--card);color:var(--tx);font:inherit;text-align:left;cursor:pointer;transition:border-color .2s,box-shadow .2s}
.dd-btn:hover{border-color:var(--ac2)}
.dd-btn:focus-visible,.dd.open .dd-btn{outline:2px solid var(--ac);border-color:transparent}
.dd-val{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dd-ch{font-size:1.1rem;color:var(--mu);transition:transform .25s}
.dd.open .dd-ch{transform:rotate(180deg)}
.dd-list{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:60;margin:0;padding:6px;list-style:none;max-height:min(280px,50vh);overflow-y:auto;overscroll-behavior:contain;
  background:var(--bg2);border:1px solid var(--bd);border-radius:16px;box-shadow:0 22px 44px -18px rgba(0,0,0,.5);
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .18s,transform .18s,visibility 0s linear .18s;scrollbar-width:thin;scrollbar-color:var(--bd) transparent}
.dd.up .dd-list{top:auto;bottom:calc(100% + 6px);transform:translateY(6px)}
.dd.open .dd-list{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.dd-list li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border-radius:10px;cursor:pointer;color:var(--tx);outline:0;line-height:1.35}
.dd-list li:hover,.dd-list li:focus{background:rgba(128,128,128,.16)}
.dd-list li.on{font-weight:600}
.dd-list li.on:after{content:"";flex:none;width:16px;height:16px;background:var(--ac);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat}
.dd-list li[aria-disabled="true"]{opacity:.45;cursor:not-allowed}
form#f{overflow:visible}

.ok.err{border-color:#c0392b}

/* ---- dodaci ---- */
.fin{color:inherit;text-decoration:none;cursor:pointer;transition:color .3s}
.fin:hover{color:var(--tx)}
.fline{margin:-6px 0 22px!important;font-size:.95rem!important}

/* autofill bez plave pozadine */
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill{
  -webkit-box-shadow:0 0 0 1000px var(--bg2) inset!important;box-shadow:0 0 0 1000px var(--bg2) inset!important;
  -webkit-text-fill-color:var(--tx)!important;caret-color:var(--tx);transition:background-color 99999s ease-in-out 0s}

/* scrollbar */
::-webkit-scrollbar{width:12px;height:12px}
::-webkit-scrollbar-track{background:var(--bg2);border-left:1px solid var(--bd)}
::-webkit-scrollbar-thumb{background-color:var(--mu);border-radius:99px;border:3px solid var(--bg2);background-clip:padding-box;min-height:48px;transition:background-color .35s ease}
::-webkit-scrollbar-thumb:hover{background-color:var(--tx)}
@supports not selector(::-webkit-scrollbar){html{scrollbar-width:thin;scrollbar-color:var(--tx) var(--bg2)}}

/* svici */
#ff{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
body>header,body>main,body>section,body>footer{position:relative;z-index:1}

/* kursor */
.cur,.cur-dot{position:fixed;left:0;top:0;pointer-events:none;z-index:9998;opacity:0;border-radius:50%;will-change:transform}
.cur{width:38px;height:38px;margin:-19px 0 0 -19px;border:1.5px solid var(--tx);transition:opacity .3s,width .25s,height .25s,margin .25s,background .25s}
.cur-dot{width:6px;height:6px;margin:-3px 0 0 -3px;background:var(--tx)}
.cur.on,.cur-dot.on{opacity:1}
.cur.hv{width:64px;height:64px;margin:-32px 0 0 -32px;background:rgba(128,128,128,.14)}
@media(pointer:coarse){.cur,.cur-dot{display:none}}

/* loader */
.ld{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;background:var(--bg);transition:opacity .6s ease,visibility .6s}
.ld.out{opacity:0;visibility:hidden}
.ld-in{text-align:center}
.ld-logo{position:relative;width:110px;height:110px;margin:0 auto 18px}
.ld-logo i{position:absolute;inset:0;background:center/contain no-repeat url(../assets/logo.webp);filter:invert(var(--inv))}
.ld-base{opacity:.14;filter:grayscale(1)}
.ld-fill{clip-path:inset(calc(100% - var(--p,0%)) 0 0 0)}
.ld-txt{font-family:'Space Grotesk',Inter,sans-serif;font-weight:700;font-size:1.4rem;letter-spacing:-.02em}
.ld-txt span{color:var(--mu);font-weight:500}
.ld-pct{margin-top:6px;font-size:.8rem;color:var(--mu);font-variant-numeric:tabular-nums}
@media(prefers-reduced-motion:reduce){.cur,.cur-dot,#ff{display:none}}

/* mobilni prikaz: kompaktnije, po dvije kartice u redu */
@media(max-width:600px){
  html{font-size:14px}
  .wrap{padding:0 22px}
  section{padding:52px 0}
  .hero{padding:90px 0 40px;margin-bottom:16px;min-height:auto}
  .hero-logo{height:64px;margin-bottom:14px}
  .card{padding:16px;border-radius:18px}
  .card h3{font-size:1.02rem}.card p{font-size:.84rem}
  .card .ic{width:42px;height:42px;font-size:1.3rem;margin-bottom:12px;border-radius:12px}
  .grid,.steps{grid-template-columns:1fr;gap:12px}
  .steps{grid-auto-rows:auto}
  .steps .card{padding:16px}
  .step .n{font-size:2rem}
  .sl li{padding:9px 0}.sl span{font-size:.78rem}
  .btn{padding:11px 20px;font-size:.92rem}
  .btn.sm{padding:8px 14px;font-size:.82rem}
  .mq .card{width:240px;padding:14px}
  .consult{padding:36px 18px;border-radius:22px}
  input,textarea,select,.dd-btn{padding:11px 13px;font-size:.9rem}
  .f2{grid-template-columns:1fr 1fr;gap:10px}.home .f2{grid-template-columns:1fr}.price-note .row{justify-content:center}
  footer{padding:40px 0 90px}
  footer .fgrid{grid-template-columns:1fr 1fr;gap:24px}footer .fgrid{grid-template-columns:1fr;gap:26px}footer .fbot{justify-content:center;text-align:center}
  footer .fbrand{grid-column:1/-1}
  .ticks li{padding:6px 0;font-size:.9rem}
  .about{gap:20px}
  .tag{font-size:.74rem;padding:5px 11px}
  .stats{gap:18px;justify-content:center}
  .home section:not(.hero) .wrap,footer .wrap,.home .consult{text-align:center}.home .sec-h,.home .sec-h *{text-align:left}
  footer .fk{justify-content:center}.home .ticks{text-align:left}.home .card .ic{margin-left:auto;margin-right:auto}
  .hero .wrap{text-align:center}.hero h1,.hero p.lead{margin-left:auto;margin-right:auto}.hero .row{flex-direction:column;align-items:center}.hero .row .btn{width:100%;max-width:340px;justify-content:center}
  .stats>div{text-align:center}
  /* veći navigacijski bar na mobitelu */
  html{scroll-padding-top:90px}
  nav .wrap{height:74px;gap:10px}
  .logo{font-size:1.3rem;gap:8px}.logo .lg{height:40px}
  nav .tools{gap:9px}nav .lang button{padding:9px 13px;font-size:.86rem}nav .tools .ib{width:44px;height:44px}nav .tools .ib .i{width:21px;height:21px}
  .links{max-height:calc(100vh - 74px);font-size:1.12rem}.links a{padding:16px 0}
  .links a.mcta{padding:11px 24px;font-size:1rem}
  /* O nama i Cijena: sav tekst poravnat lijevo */
  .home #about .wrap,.home #cijena .wrap{text-align:left}
  .home #about .card:has(.ticks){justify-content:flex-start}.price-note .row{justify-content:flex-start}
}
@media(max-width:360px){
  nav .wrap{padding:0 16px;gap:6px}
  .logo{font-size:1.15rem}.logo .lg{height:34px}
  nav .tools{gap:6px}nav .lang button{padding:8px 10px}nav .tools .ib{width:40px;height:40px}
}