/* Diesel Dijelovi: zajednička osnova (mobile first). Boje, fontovi i karakter dolaze iz skin-a.css / skin-b.css. */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 90px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }
html.bez-pomaka { overflow: hidden; }
html, body { overflow-x: clip; }
.proizvod-str__mreza > *, .proizvod-str__detalji > * { min-width: 0; }
body { margin: 0; background: var(--pozadina); color: var(--tekst); font-family: var(--font-tekst); font-size: 1rem; line-height: 1.55; padding-bottom: 72px; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
@media (min-width: 1024px) { body { padding-bottom: 0; } }
img, svg { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { text-decoration-thickness: 2px; }
button, input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3 { font-family: var(--font-naslov); font-weight: var(--tezina-naslov); line-height: 1.05; margin: 0 0 .5em; letter-spacing: var(--razmak-naslov, 0); text-wrap: balance; }
h1 { font-size: clamp(2.1rem, 6.5vw, 4rem); }
h2 { font-size: clamp(1.6rem, 4vw, 2.4rem); }
h3 { font-size: 1.2rem; }
p { margin: 0 0 1em; }
:focus-visible { outline: 3px solid var(--fokus); outline-offset: 2px; }
.vizualno-skriveno, .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.preskoci { position: absolute; left: 8px; top: -60px; z-index: 100; background: var(--tamna); color: var(--tamna-tekst); padding: 10px 14px; }
.preskoci:focus { top: 8px; }
.okvir { width: 100%; max-width: 1240px; margin-inline: auto; padding-inline: 16px; }
@media (min-width: 768px) { .okvir { padding-inline: 24px; } }
.ikona { width: 22px; height: 22px; flex: none; }
.ikona--mala { width: 16px; height: 16px; }
.ikona--velika { width: 72px; height: 72px; }
.zamka { position: absolute; left: -9999px; }

/* ---------- gumbi ---------- */
.gumb { display: inline-flex; align-items: center; justify-content: center; gap: .55em; min-height: 48px; padding: .7em 1.2em; border: var(--crta-gumb) solid var(--tamna); background: var(--tamna); color: var(--tamna-tekst); font-family: var(--font-gumb); font-weight: 600; font-size: 1rem; text-decoration: none; border-radius: var(--radijus); cursor: pointer; line-height: 1.1; transition: background .15s, color .15s, transform .15s; }
.gumb:hover { text-decoration: none; }
.gumb:active { transform: translateY(1px); }
.gumb--poziv { background: var(--akcent); border-color: var(--akcent-rub); color: var(--akcent-tekst); }
.gumb--poziv:hover { background: var(--akcent-hover); }
.gumb--poziv span { font-family: var(--font-broj); letter-spacing: var(--razmak-broj, 0); }
.gumb--obrub { background: transparent; color: var(--tekst); border-color: var(--tekst); }
.gumb--obrub:hover { background: var(--tekst); color: var(--pozadina); }
.gumb--glavni { background: var(--tamna); color: var(--tamna-tekst); }
.gumb--siroko { width: 100%; }
.gumb--mali { min-height: 40px; padding: .5em .9em; font-size: .92rem; }
.gumb--golemo { min-height: 64px; font-size: clamp(1.3rem, 4vw, 1.8rem); padding-inline: 1.4em; }
.gumb--golemo .ikona { width: 28px; height: 28px; }
.ikona-gumb { display: inline-grid; place-items: center; width: 44px; height: 44px; border: 0; background: transparent; color: inherit; cursor: pointer; position: relative; border-radius: var(--radijus); }
.ikona-gumb:hover { background: var(--ton); }

/* ---------- gornja traka ---------- */
.traka { display: none; background: var(--tamna); color: var(--tamna-tekst); font-size: .86rem; }
@media (min-width: 768px) { .traka { display: block; } }
.traka__unutra { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 36px; }
.traka__obecanja { display: flex; gap: 22px; list-style: none; margin: 0; padding: 0; }
.traka__obecanja li { display: flex; align-items: center; gap: 7px; }
.traka__obecanja .ikona { width: 17px; height: 17px; color: var(--akcent-na-tamnom); }
.traka__skriveno { display: none !important; }
@media (min-width: 1024px) { .traka__skriveno { display: flex !important; } }
.jezici { display: flex; gap: 2px; list-style: none; margin: 0; padding: 0; }
.jezici a { display: inline-block; padding: 4px 8px; text-decoration: none; font-weight: 600; font-size: .82rem; opacity: .75; }
.jezici a[aria-current] { opacity: 1; text-decoration: underline; text-underline-offset: 4px; }

/* ---------- zaglavlje ---------- */
.zaglavlje { position: sticky; top: 0; z-index: 40; background: var(--zaglavlje-pozadina); color: var(--zaglavlje-tekst); border-bottom: var(--crta-zaglavlje) solid var(--zaglavlje-rub); transition: box-shadow .2s; }
.zaglavlje--pomaknuto { box-shadow: var(--sjena-zaglavlje); }
.zaglavlje__unutra { display: flex; align-items: center; gap: 12px; min-height: 64px; }
@media (min-width: 1024px) { .zaglavlje__unutra { min-height: 76px; gap: 28px; } }
.znak { display: inline-flex; align-items: baseline; text-decoration: none; line-height: 1; flex: none; }
.glavni { display: none; flex: 1; }
@media (min-width: 1024px) { .glavni { display: block; } }
.glavni ul { display: flex; gap: 4px; list-style: none; margin: 0; padding: 0; }
.glavni a, .glavni button { display: inline-flex; align-items: center; gap: 6px; padding: 10px 12px; background: none; border: 0; cursor: pointer; text-decoration: none; font-family: var(--font-nav); font-weight: 600; font-size: var(--velicina-nav, 1rem); color: inherit; border-radius: var(--radijus); }
.glavni a:hover, .glavni button:hover, .glavni button[aria-expanded="true"] { background: var(--nav-hover); }
.glavni button[aria-expanded="true"] .ikona { transform: rotate(180deg); }
.zaglavlje__akcije { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.zaglavlje__poziv { display: none; }
@media (min-width: 640px) { .zaglavlje__poziv { display: inline-flex; margin-left: 8px; } }
@media (min-width: 1024px) { .zaglavlje__izbornik { display: none; } }
.kosarica-gumb__broj { position: absolute; top: 4px; right: 2px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--akcent); color: var(--akcent-tekst); font-size: .72rem; font-weight: 700; display: grid; place-items: center; }
.kosarica-gumb__broj[hidden] { display: none; }

/* mega izbornik */
.mega { position: absolute; left: 0; right: 0; top: 100%; background: var(--povrsina); color: var(--tekst); border-bottom: var(--crta-zaglavlje) solid var(--zaglavlje-rub); box-shadow: var(--sjena-zaglavlje); max-height: calc(100vh - 120px); overflow: auto; }
.mega__unutra { max-width: 1240px; margin: 0 auto; padding: 28px 24px 32px; display: grid; grid-template-columns: 1.15fr 1fr 1.1fr; gap: 36px; }
.mega__naslov { font-family: var(--font-naslov); font-weight: var(--tezina-naslov); font-size: 1.15rem; margin-bottom: 12px; }
.mega ul { list-style: none; margin: 0; padding: 0; }
.mega__strojevi { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.mega__strojevi a { display: flex; align-items: center; gap: 10px; padding: 9px 8px; text-decoration: none; border-radius: var(--radijus); }
.mega__strojevi .ikona { width: 30px; height: 30px; color: var(--ikona-boja); }
.mega__strojevi a:hover, .mega__popis a:hover { background: var(--ton); }
.mega__popis a { display: block; padding: 6px 8px; text-decoration: none; border-radius: var(--radijus); }
.mega__marke { display: flex; flex-wrap: wrap; gap: 6px; }
.mega__marke a { display: inline-block; padding: 6px 10px; border: 1px solid var(--crta); text-decoration: none; font-size: .92rem; border-radius: var(--radijus); }
.mega__marke a:hover { background: var(--tamna); color: var(--tamna-tekst); border-color: var(--tamna); }
.mega__sve { display: inline-flex; align-items: center; gap: 6px; margin-top: 16px; font-weight: 600; }

/* tražilica u zaglavlju */
.trazilica { background: var(--povrsina); color: var(--tekst); border-bottom: 1px solid var(--crta); padding: 14px 0; }
.trazilica__forma { display: flex; align-items: center; gap: 10px; }
.trazilica__forma input { flex: 1; min-width: 0; height: 50px; padding: 0 14px; border: var(--crta-polje) solid var(--tekst); border-radius: var(--radijus); background: var(--povrsina); font-size: 1.05rem; }

/* ladica (mobilni izbornik) */
.ladica { position: fixed; z-index: 60; top: 0; right: 0; bottom: 0; width: min(440px, 92vw); background: var(--povrsina); color: var(--tekst); display: flex; flex-direction: column; box-shadow: -10px 0 40px rgba(0,0,0,.25); }
.ladica[hidden] { display: none; }
.ladica__glava { display: flex; align-items: center; justify-content: space-between; padding: 10px 12px 10px 16px; border-bottom: 1px solid var(--crta); }
.ladica__nav { flex: 1; overflow: auto; padding: 8px 16px 16px; }
.ladica details summary { list-style: none; cursor: pointer; font-family: var(--font-naslov); font-weight: var(--tezina-naslov); font-size: 1.4rem; padding: 12px 0; display: flex; justify-content: space-between; }
.ladica details summary::-webkit-details-marker { display: none; }
.ladica__pod { margin: 12px 0 6px; font-weight: 600; color: var(--tekst-2); font-size: .9rem; }
.ladica ul { list-style: none; margin: 0; padding: 0; }
.ladica__strojevi { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.ladica__strojevi a { display: flex; flex-direction: column; gap: 6px; padding: 10px; border: 1px solid var(--crta); border-radius: var(--radijus); text-decoration: none; font-size: .92rem; line-height: 1.2; min-height: 84px; }
.ladica__strojevi .ikona { width: 30px; height: 30px; color: var(--ikona-boja); }
.ladica__popis a, .ladica__glavno a { display: block; padding: 10px 0; border-bottom: 1px solid var(--crta); text-decoration: none; }
.ladica__marke { display: flex; flex-wrap: wrap; gap: 6px; }
.ladica__marke a { display: inline-block; padding: 7px 10px; border: 1px solid var(--crta); border-radius: var(--radijus); text-decoration: none; font-size: .9rem; }
.ladica__glavno { margin-top: 12px !important; }
.ladica__glavno a { font-family: var(--font-naslov); font-weight: var(--tezina-naslov); font-size: 1.3rem; }
.ladica__dno { padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid var(--crta); display: grid; gap: 10px; }
.jezici--ladica { justify-content: center; }
.zastor { position: fixed; inset: 0; z-index: 55; background: rgba(15, 18, 20, .55); }
.zastor[hidden] { display: none; }

/* ---------- mrvice ---------- */
.mrvice ol { display: flex; flex-wrap: wrap; gap: 4px 0; list-style: none; margin: 0 0 18px; padding: 0; font-size: .86rem; color: var(--tekst-2); }
.mrvice li:not(:last-child)::after { content: "/"; margin: 0 8px; opacity: .5; }
.mrvice a { text-decoration: none; }
.mrvice a:hover { text-decoration: underline; }

/* ---------- glava stranice ---------- */
.glava { padding: 22px 0 36px; background: var(--glava-pozadina); color: var(--glava-tekst); border-bottom: var(--glava-rub); }
@media (min-width: 768px) { .glava { padding: 28px 0 56px; } }
.glava__mreza { display: grid; gap: 28px; }
@media (min-width: 900px) { .glava__mreza { grid-template-columns: minmax(0, 1fr) 360px; gap: 56px; align-items: start; } }
.nadnaslov { font-weight: 600; color: var(--nadnaslov-boja); margin: 0 0 10px; font-size: .95rem; }
.uvod { font-size: clamp(1.08rem, 2.2vw, 1.28rem); line-height: 1.5; max-width: 62ch; margin: 0 0 20px; }
.brzi-podaci { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; }
.brzi-podaci div { padding: 10px 14px; border: var(--crta-kartica) solid var(--crta-jaka); background: var(--povrsina); color: var(--tekst); border-radius: var(--radijus); }
.brzi-podaci dt { font-size: .8rem; color: var(--tekst-2); }
.brzi-podaci dd { margin: 0; font-weight: 600; }

.poziv-kartica { background: var(--povrsina); color: var(--tekst); border: var(--crta-kartica) solid var(--crta-jaka); border-radius: var(--radijus); padding: 20px; display: grid; gap: 10px; }
.poziv-kartica__vizual { display: grid; place-items: center; min-height: 120px; background: var(--ton); border-radius: var(--radijus); margin-bottom: 4px; color: var(--ikona-boja); }
.poziv-kartica__vizual img { max-height: 150px; width: auto; mix-blend-mode: multiply; }
.poziv-kartica__naslov { font-family: var(--font-naslov); font-weight: var(--tezina-naslov); font-size: 1.35rem; line-height: 1.1; margin: 0; }
.poziv-kartica__tekst { margin: 0; color: var(--tekst-2); font-size: .95rem; }
.poziv-kartica--vodoravna { margin-top: 32px; grid-template-columns: 1fr; }
@media (min-width: 768px) { .poziv-kartica--vodoravna { grid-template-columns: 1fr auto auto; align-items: center; } }

/* ---------- blokovi ---------- */
.blok { padding: 44px 0; }
@media (min-width: 768px) { .blok { padding: 72px 0; } }
.blok--ton { background: var(--ton); }
.blok__glava { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 22px; }
.blok__glava h2 { margin: 0; }
.blok__sve { font-weight: 600; white-space: nowrap; }

.popis-dijelova__mreza { display: grid; grid-template-columns: 1fr; gap: 0; list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--crta); }
@media (min-width: 640px) { .popis-dijelova__mreza { grid-template-columns: 1fr 1fr; column-gap: 32px; } }
@media (min-width: 1024px) { .popis-dijelova__mreza { grid-template-columns: repeat(3, 1fr); } }
.popis-dijelova__mreza li { display: flex; gap: 10px; align-items: baseline; padding: 11px 0; border-bottom: 1px solid var(--crta); }
.popis-dijelova__mreza .ikona { color: var(--kvacica-boja); transform: translateY(2px); }

.oznake { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.oznake a, .oznake span { display: inline-block; padding: 7px 12px; border: 1px solid var(--crta-jaka); border-radius: var(--radijus); text-decoration: none; background: var(--povrsina); }
.oznake a:hover { background: var(--tamna); color: var(--tamna-tekst); }
.oznake--modeli span { font-family: var(--font-broj); font-size: .92rem; }
.marke-modeli__mreza { display: grid; gap: 32px; }
@media (min-width: 900px) { .marke-modeli__mreza { grid-template-columns: 1fr 1fr; } }
.marke-modeli h2 { font-size: 1.5rem; }

/* tekst */
.tekst-blok__mreza { display: grid; gap: 32px; }
@media (min-width: 1024px) { .tekst-blok--sadrzaj .tekst-blok__mreza { grid-template-columns: 260px minmax(0, 1fr); gap: 56px; } }
.sadrzaj-vodica { align-self: start; }
@media (min-width: 1024px) { .sadrzaj-vodica { position: sticky; top: 100px; } }
.sadrzaj-vodica ol { margin: 0; padding: 14px 16px 14px 34px; border: 1px solid var(--crta); border-radius: var(--radijus); background: var(--povrsina); font-size: .93rem; display: grid; gap: 6px; }
.sadrzaj-vodica a { text-decoration: none; }
.proza { max-width: 72ch; font-size: 1.06rem; }
.proza section + section { margin-top: 36px; }
.proza h2 { font-size: clamp(1.45rem, 3vw, 1.9rem); }
.proza h3 { margin-top: 1.4em; }
.proza ul, .proza ol { padding-left: 1.25em; margin: 0 0 1em; }
.proza li { margin-bottom: .35em; }
.proza li::marker { color: var(--kvacica-boja); }
.proza table { width: 100%; border-collapse: collapse; margin: 1em 0 1.4em; font-size: .95rem; display: block; overflow-x: auto; }
.proza th, .proza td { text-align: left; padding: 9px 12px; border-bottom: 1px solid var(--crta); vertical-align: top; }
.proza thead th { border-bottom: 2px solid var(--crta-jaka); }
.proza a { color: var(--poveznica); }

/* FAQ */
.faq__mreza { display: grid; gap: 24px; }
@media (min-width: 1024px) { .faq__mreza { grid-template-columns: 320px minmax(0, 1fr); gap: 56px; } }
.faq details { border-bottom: 1px solid var(--crta-jaka); }
.faq details:first-child { border-top: 1px solid var(--crta-jaka); }
.faq summary { cursor: pointer; list-style: none; padding: 18px 40px 18px 0; position: relative; font-weight: 600; font-size: 1.08rem; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 6px; top: 12px; font-size: 1.6rem; font-weight: 400; line-height: 1; }
.faq details[open] summary::after { content: "−"; }
.faq details > div { padding: 0 0 18px; max-width: 70ch; color: var(--tekst-2); }

/* kartice */
.mreza-kartica { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 14px; }
.mreza-kartica--dijelovi { grid-template-columns: repeat(2, 1fr); gap: 10px; }
@media (min-width: 640px) { .mreza-kartica--dijelovi { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .mreza-kartica--dijelovi { grid-template-columns: repeat(5, 1fr); gap: 14px; } }
.mreza-kartica--velike { grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.kartica { display: flex; flex-direction: column; background: var(--povrsina); border: var(--crta-kartica) solid var(--crta-kartice); border-radius: var(--radijus); text-decoration: none; overflow: hidden; transition: border-color .15s, transform .15s; }
.kartica:hover { border-color: var(--crta-jaka); }
.kartica__vizual { display: grid; place-items: center; aspect-ratio: 4 / 3; background: var(--kartica-vizual); color: var(--ikona-boja); padding: 14px; }
.kartica__vizual img { max-height: 100%; width: auto; object-fit: contain; mix-blend-mode: multiply; }
.ikona--kartica { width: 56px; height: 56px; }
.kartica__tijelo { display: grid; gap: 6px; padding: 12px 14px 16px; }
.kartica__naslov { font-family: var(--font-naslov); font-weight: var(--tezina-naslov); font-size: 1.12rem; line-height: 1.15; }
.kartica__opis { font-size: .93rem; color: var(--tekst-2); }

/* strojevi (ikone) */
.strojevi { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; list-style: none; margin: 0; padding: 0; }
@media (min-width: 640px) { .strojevi { grid-template-columns: repeat(4, 1fr); } }
.strojevi a { display: flex; flex-direction: column; justify-content: space-between; gap: 18px; min-height: 132px; padding: 16px; background: var(--povrsina); border: var(--crta-kartica) solid var(--crta-kartice); border-radius: var(--radijus); text-decoration: none; font-family: var(--font-naslov); font-weight: var(--tezina-naslov); font-size: 1.12rem; line-height: 1.12; transition: background .15s, color .15s, border-color .15s; }
.strojevi__ikona { width: 52px; height: 52px; color: var(--ikona-boja); }
.strojevi a:hover { background: var(--stroj-hover); color: var(--stroj-hover-tekst); border-color: var(--stroj-hover); }
.strojevi a:hover .strojevi__ikona { color: inherit; }

/* marke */
.traka-marki { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.traka-marki a { display: inline-block; padding: 10px 16px; border: var(--crta-kartica) solid var(--crta-kartice); background: var(--povrsina); text-decoration: none; font-family: var(--font-naslov); font-weight: var(--tezina-naslov); font-size: 1.1rem; border-radius: var(--radijus); }
.traka-marki a:hover { background: var(--tamna); color: var(--tamna-tekst); border-color: var(--tamna); }
.zid-marki { display: grid; gap: 28px; }
@media (min-width: 900px) { .zid-marki { grid-template-columns: repeat(3, 1fr); } }
.zid-marki h3 { color: var(--tekst-2); font-family: var(--font-tekst); font-weight: 600; font-size: .95rem; }
.zid-marki ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--crta-jaka); }
.zid-marki a { display: flex; justify-content: space-between; padding: 12px 0; border-bottom: 1px solid var(--crta); text-decoration: none; font-family: var(--font-naslov); font-weight: var(--tezina-naslov); font-size: 1.25rem; }
.zid-marki a::after { content: "›"; opacity: .4; }
.zid-marki a:hover { color: var(--poveznica); }

/* vodiči */
.mreza-vodica { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.vodic-kartica { display: grid; gap: 8px; align-content: start; padding: 20px; background: var(--povrsina); border: var(--crta-kartica) solid var(--crta-kartice); border-radius: var(--radijus); text-decoration: none; }
.vodic-kartica__oznaka { font-size: .85rem; color: var(--nadnaslov-boja); font-weight: 600; }
.vodic-kartica__naslov { font-family: var(--font-naslov); font-weight: var(--tezina-naslov); font-size: 1.4rem; line-height: 1.1; }
.vodic-kartica__opis { color: var(--tekst-2); font-size: .95rem; }
.vodic-kartica__dalje { font-weight: 600; text-decoration: underline; text-underline-offset: 4px; margin-top: 4px; }
.vodic-kartica:hover { border-color: var(--crta-jaka); }

/* CTA */
.cta-blok__unutra { display: grid; gap: 20px; padding: 28px; background: var(--povrsina); border: var(--crta-kartica) solid var(--crta-jaka); border-radius: var(--radijus); }
@media (min-width: 900px) { .cta-blok__unutra { grid-template-columns: 1fr auto; align-items: center; padding: 36px 40px; } }
.cta-blok__akcije { display: flex; flex-wrap: wrap; gap: 10px; }
.cta-blok p { margin: 0; color: var(--tekst-2); }

/* pozivni pojas */
.pozivni-pojas { background: var(--tamna); color: var(--tamna-tekst); padding: 48px 0; }
@media (min-width: 768px) { .pozivni-pojas { padding: 72px 0; } }
.pozivni-pojas__unutra { display: grid; gap: 28px; }
@media (min-width: 1024px) { .pozivni-pojas__unutra { grid-template-columns: 1fr auto; align-items: center; gap: 56px; } }
.pozivni-pojas h2 { font-size: clamp(2rem, 5vw, 3.2rem); }
.pozivni-pojas p { max-width: 56ch; opacity: .85; margin: 0; }
.pozivni-pojas__akcije { display: grid; gap: 12px; }
.pozivni-pojas__drugo { display: flex; flex-wrap: wrap; gap: 8px; }
.pozivni-pojas .gumb--obrub { color: var(--tamna-tekst); border-color: currentColor; }
.pozivni-pojas .gumb--obrub:hover { background: var(--tamna-tekst); color: var(--tamna); }

/* podnožje */
.podnozje { background: var(--podnozje-pozadina); color: var(--podnozje-tekst); padding: 48px 0 24px; font-size: .95rem; }
.podnozje__mreza { display: grid; gap: 32px; grid-template-columns: 1fr 1fr; }
.podnozje__stup--tvrtka { grid-column: 1 / -1; }
@media (min-width: 900px) { .podnozje__mreza { grid-template-columns: 1.3fr 1fr 1fr 1fr; } .podnozje__stup--tvrtka { grid-column: auto; } }
.podnozje__naslov { font-weight: 700; margin: 0 0 10px; }
.podnozje__naslov:not(:first-child) { margin-top: 22px; }
.podnozje ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; }
.podnozje a { text-decoration: none; opacity: .88; }
.podnozje a:hover { opacity: 1; text-decoration: underline; }
.podnozje address { font-style: normal; display: grid; gap: 10px; margin-top: 18px; }
.podnozje address p { display: flex; gap: 10px; margin: 0; align-items: flex-start; }
.podnozje address .ikona { width: 18px; height: 18px; margin-top: 2px; opacity: .7; }
.podnozje__dno { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; align-items: center; margin-top: 40px; padding-top: 18px; border-top: 1px solid var(--podnozje-crta); font-size: .82rem; opacity: .8; }
.podnozje__dno p { margin: 0; }

/* mobilna akcijska traka: poziv je uvijek na dohvat palca */
.akcijska-traka { position: fixed; z-index: 45; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: 1fr 64px 64px; background: var(--traka-pozadina); color: var(--traka-tekst); border-top: var(--crta-traka) solid var(--traka-rub); padding-bottom: env(safe-area-inset-bottom); box-shadow: 0 -6px 20px rgba(0,0,0,.12); }
@media (min-width: 1024px) { .akcijska-traka { display: none; } }
.akcijska-traka a { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 64px; text-decoration: none; }
.akcijska-traka__poziv { background: var(--akcent); color: var(--akcent-tekst); font-family: var(--font-broj); font-weight: 700; font-size: 1.28rem; letter-spacing: var(--razmak-broj, 0); }
.akcijska-traka__poziv > span { display: grid; line-height: 1.05; text-align: left; }
.akcijska-traka__mali { font-family: var(--font-tekst); font-size: .72rem; font-weight: 600; letter-spacing: 0; opacity: .8; }
.akcijska-traka__poziv .ikona { width: 26px; height: 26px; }
.akcijska-traka__drugo { flex-direction: column; gap: 3px !important; font-size: .68rem; font-weight: 600; border-left: 1px solid var(--traka-crta); }

/* prekidač prijedloga */
.prekidac { position: fixed; z-index: 50; left: 12px; bottom: 76px; display: flex; align-items: center; gap: 2px; padding: 4px; background: #1b1b1b; color: #fff; border-radius: 999px; font: 600 .78rem/1 system-ui, sans-serif; box-shadow: 0 6px 24px rgba(0,0,0,.3); }
@media (min-width: 1024px) { .prekidac { bottom: 16px; } }
.prekidac__oznaka { padding: 0 8px 0 10px; opacity: .65; }
@media (max-width: 420px) { .prekidac__oznaka { display: none; } }
.prekidac a { padding: 8px 12px; border-radius: 999px; text-decoration: none; color: #fff; }
.prekidac a[aria-current] { background: #fff; color: #111; }

/* ---------- naslovnica ---------- */
.hero { padding: 28px 0 40px; background: var(--hero-pozadina); color: var(--hero-tekst); position: relative; overflow: hidden; }
@media (min-width: 768px) { .hero { padding: 56px 0 72px; } }
.hero__mreza { display: grid; gap: 32px; position: relative; }
@media (min-width: 1024px) { .hero__mreza { grid-template-columns: minmax(0, 1.1fr) minmax(380px, .9fr); gap: 56px; align-items: center; } }
.hero h1 { font-size: clamp(2.3rem, 7.5vw, 4.6rem); max-width: 14ch; }
.hero__podnaslov { font-size: clamp(1.05rem, 2.3vw, 1.3rem); max-width: 46ch; margin-bottom: 22px; }
.hero__broj { display: inline-grid; gap: 4px; text-decoration: none; margin-bottom: 18px; }
.hero__broj-oznaka { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; }
.hero__broj-znamenke { font-family: var(--font-broj); font-weight: var(--tezina-broj); font-size: clamp(2.8rem, 11vw, 6.2rem); line-height: .95; letter-spacing: var(--razmak-broj-veliki, 0); white-space: nowrap; }
.hero__drugo { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.hero__tocke { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.hero__tocke li { display: flex; gap: 8px; align-items: baseline; }

/* tražilica dijela */
.tdio { background: var(--povrsina); color: var(--tekst); border: var(--crta-kartica) solid var(--crta-jaka); border-radius: var(--radijus); padding: 18px; box-shadow: var(--sjena-tdio); }
@media (min-width: 768px) { .tdio { padding: 24px; } }
.tdio__naslov { font-family: var(--font-naslov); font-weight: var(--tezina-naslov); font-size: 1.5rem; line-height: 1.1; margin: 0 0 12px; }
.tdio__koraci { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; list-style: none; margin: 0 0 16px; padding: 0; counter-reset: k; }
.tdio__koraci li { counter-increment: k; font-size: .76rem; font-weight: 600; padding-top: 8px; border-top: 4px solid var(--crta); color: var(--tekst-2); line-height: 1.2; }
.tdio__koraci li::before { content: counter(k) ". "; }
.tdio__koraci li.je-aktivan { border-color: var(--akcent-rub-jak); color: var(--tekst); }
.tdio__koraci li.je-gotov { border-color: var(--tekst); color: var(--tekst); }
.tdio__pitanje { font-weight: 700; font-size: 1.08rem; margin: 0 0 10px; }
.tdio__trag { display: block; font-weight: 400; font-size: .88rem; color: var(--tekst-2); }
.tdio__izbor { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 6px; }
.tdio__izbor--strojevi { grid-template-columns: 1fr 1fr; }
.tdio__izbor--marke, .tdio__izbor--dijelovi { display: flex; flex-wrap: wrap; }
.tdio__izbor button { width: 100%; display: flex; align-items: center; gap: 10px; text-align: left; padding: 10px 12px; min-height: 48px; border: 1px solid var(--crta-jaka); background: var(--povrsina); border-radius: var(--radijus); cursor: pointer; font-weight: 600; line-height: 1.15; font-size: .95rem; }
.tdio__izbor--marke button, .tdio__izbor--dijelovi button { width: auto; min-height: 42px; }
.tdio__izbor button .ikona { width: 28px; height: 28px; color: var(--ikona-boja); }
.tdio__izbor button:hover { background: var(--tamna); color: var(--tamna-tekst); border-color: var(--tamna); }
.tdio__izbor button:hover .ikona { color: inherit; }
.tdio__izbor button.je-ostalo { border-style: dashed; }
.tdio__natrag { background: none; border: 0; padding: 6px 0; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; color: var(--tekst-2); }
.tdio__sazetak { display: grid; gap: 10px; }
.tdio__odabrano { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.tdio__odabrano li { padding: 6px 10px; background: var(--ton); border-radius: var(--radijus); font-weight: 600; }
.tdio__savjet { color: var(--tekst-2); margin: 0; font-size: .95rem; }
.tdio__linkovi { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: .92rem; margin: 0; }

.agregati-uvod { display: grid; gap: 14px; }
@media (min-width: 1024px) { .agregati-uvod { grid-template-columns: 280px minmax(0, 1fr); align-items: stretch; } }
.kalk-poziv { display: grid; gap: 8px; align-content: start; padding: 22px; background: var(--kalk-pozadina); color: var(--kalk-tekst); border-radius: var(--radijus); text-decoration: none; border: var(--crta-kartica) solid var(--kalk-rub); }
.kalk-poziv .ikona { width: 56px; height: 56px; }
.kalk-poziv__naslov { font-family: var(--font-naslov); font-weight: var(--tezina-naslov); font-size: 1.5rem; line-height: 1.05; }
.kalk-poziv__tekst { font-size: .95rem; opacity: .9; }
.kalk-poziv--glava { align-self: stretch; }

.zasto__mreza { list-style: none; margin: 0; padding: 0; display: grid; gap: 22px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .zasto__mreza { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .zasto__mreza { grid-template-columns: repeat(4, 1fr); gap: 28px; } }
.zasto__mreza li { display: grid; gap: 8px; align-content: start; padding-top: 16px; border-top: var(--crta-zasto) solid var(--crta-jaka); }
.zasto__mreza .ikona { width: 34px; height: 34px; color: var(--ikona-boja); }
.zasto__mreza h3 { margin: 0; font-size: 1.25rem; }
.zasto__mreza p { margin: 0; color: var(--tekst-2); }

/* ---------- shop ---------- */
.shop { padding-top: 24px; padding-bottom: 56px; }
.vrste ul { display: flex; gap: 6px; list-style: none; margin: 0 -16px 14px; padding: 0 16px 6px; overflow-x: auto; scrollbar-width: thin; }
.vrste a { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; padding: 9px 14px; border: 1px solid var(--crta-jaka); border-radius: var(--radijus); text-decoration: none; font-weight: 600; background: var(--povrsina); }
.vrste a[aria-current] { background: var(--tamna); color: var(--tamna-tekst); border-color: var(--tamna); }
.vrste__broj { font-family: var(--font-broj); font-size: .8rem; opacity: .7; }
.filteri { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 12px; align-items: end; padding: 14px; background: var(--povrsina); border: 1px solid var(--crta); border-radius: var(--radijus); margin-bottom: 18px; }
@media (min-width: 900px) { .filteri { grid-template-columns: 150px 190px auto auto 1fr auto; } }
.filteri__polje { display: grid; gap: 4px; }
.filteri label { font-size: .82rem; font-weight: 600; color: var(--tekst-2); }
.filteri select { height: 44px; padding: 0 10px; border: 1px solid var(--crta-jaka); border-radius: var(--radijus); background: var(--povrsina); }
.filteri__kvacica { display: flex !important; align-items: center; gap: 8px; min-height: 44px; font-size: .95rem !important; color: var(--tekst) !important; }
.filteri__kvacica input { width: 20px; height: 20px; accent-color: var(--tamna); }
.filteri__polje--sort { grid-column: 1 / -1; }
@media (min-width: 900px) { .filteri__polje--sort { grid-column: auto; justify-self: end; } }
.filteri__broj { grid-column: 1 / -1; margin: 0; font-size: .92rem; color: var(--tekst-2); }
@media (min-width: 900px) { .filteri__broj { grid-column: auto; } }
.mreza-proizvoda { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 768px) { .mreza-proizvoda { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } }
@media (min-width: 1100px) { .mreza-proizvoda { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.mreza-proizvoda--klizac { grid-auto-flow: column; grid-auto-columns: minmax(220px, 1fr); grid-template-columns: none; overflow-x: auto; padding-bottom: 8px; scroll-snap-type: x mandatory; }
.mreza-proizvoda--klizac > li { scroll-snap-align: start; }
@media (min-width: 1100px) { .mreza-proizvoda--klizac { grid-auto-columns: calc((100% - 48px) / 4); } }
.proizvod { display: flex; flex-direction: column; background: var(--povrsina); border: var(--crta-kartica) solid var(--crta-kartice); border-radius: var(--radijus); overflow: hidden; }
.proizvod:hover { border-color: var(--crta-jaka); }
.proizvod__slika { position: relative; display: block; aspect-ratio: 1; background: #fff; border-bottom: 1px solid var(--crta); }
.proizvod__slika img { width: 100%; height: 100%; object-fit: contain; padding: 10px; }
.znacka { position: absolute; top: 8px; left: 8px; padding: 3px 8px; background: var(--tamna); color: var(--tamna-tekst); font-family: var(--font-broj); font-size: .76rem; font-weight: 700; border-radius: var(--radijus); }
.proizvod__tijelo { display: flex; flex-direction: column; gap: 6px; padding: 12px; flex: 1; }
.proizvod__vrsta { margin: 0; font-size: .8rem; color: var(--tekst-2); font-weight: 600; }
.proizvod__naziv { margin: 0; font-family: var(--font-naslov); font-weight: var(--tezina-naslov); font-size: 1.2rem; line-height: 1.1; }
.proizvod__naziv a { text-decoration: none; }
.proizvod__spec { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: .84rem; color: var(--tekst-2); font-family: var(--font-broj); }
.proizvod__kw { color: var(--tekst); font-weight: 700; }
.proizvod__dno { margin-top: auto; padding-top: 8px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.proizvod__cijena { font-family: var(--font-broj); font-weight: 700; font-size: 1.15rem; }
.proizvod__cijena del { opacity: .55; font-weight: 400; font-size: .85em; }
.proizvod .gumb--mali span { display: none; }
@media (min-width: 1100px) { .proizvod .gumb--mali span { display: inline; } }
.added_to_cart { display: none !important; }
.add_to_cart_button.loading { opacity: .6; }
.add_to_cart_button.added .ikona { color: var(--akcent); }
.prazno { padding: 40px 20px; text-align: center; border: 1px dashed var(--crta-jaka); border-radius: var(--radijus); display: grid; gap: 14px; justify-items: center; }
.prazno p { max-width: 50ch; margin: 0; }

/* proizvod */
.proizvod-str { padding-top: 20px; padding-bottom: 40px; }
.proizvod-str__mreza { display: grid; gap: 24px; }
@media (min-width: 900px) { .proizvod-str__mreza { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 48px; align-items: start; } }
.proizvod-str__galerija { background: #fff; border: 1px solid var(--crta); border-radius: var(--radijus); padding: 12px; }
.proizvod-str__galerija .woocommerce-product-gallery { width: 100% !important; float: none !important; margin: 0 !important; }
.proizvod-str__galerija .flex-control-thumbs { display: flex; gap: 6px; list-style: none; margin: 10px 0 0; padding: 0; overflow-x: auto; }
.proizvod-str__galerija .flex-control-thumbs li { width: 64px; flex: none; }
.proizvod-str__galerija .flex-control-thumbs img { cursor: pointer; opacity: .6; border: 1px solid var(--crta); }
.proizvod-str__galerija .flex-control-thumbs img.flex-active { opacity: 1; border-color: var(--tekst); }
.woocommerce-product-gallery__trigger { position: absolute; right: 10px; top: 10px; z-index: 2; }
@media (min-width: 900px) { .proizvod-str__kupnja { position: sticky; top: 96px; } }
.proizvod-str__naziv { font-size: clamp(1.9rem, 4.5vw, 3rem); }
.proizvod-str__kljucno { list-style: none; margin: 0 0 18px; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: var(--crta); border: 1px solid var(--crta); border-radius: var(--radijus); overflow: hidden; }
.proizvod-str__kljucno li { background: var(--povrsina); padding: 10px 12px; display: grid; }
.proizvod-str__kljucno span { font-size: .78rem; color: var(--tekst-2); }
.proizvod-str__kljucno strong { font-family: var(--font-broj); font-size: 1.1rem; }
.proizvod-str__cijena { display: grid; gap: 2px; margin-bottom: 14px; }
.proizvod-str__iznos { font-family: var(--font-broj); font-weight: 700; font-size: 2.2rem; line-height: 1; }
.proizvod-str__pdv { font-size: .86rem; color: var(--tekst-2); }
.proizvod-str__forma form.cart { display: flex; gap: 10px; align-items: stretch; margin: 0 0 12px; }
.proizvod-str__forma .quantity input { width: 72px; height: 52px; text-align: center; border: 1px solid var(--crta-jaka); border-radius: var(--radijus); background: var(--povrsina); }
.proizvod-str__forma .single_add_to_cart_button { flex: 1; min-height: 52px; border: var(--crta-gumb) solid var(--tamna); background: var(--tamna); color: var(--tamna-tekst); font-family: var(--font-gumb); font-weight: 700; font-size: 1.05rem; border-radius: var(--radijus); cursor: pointer; }
.proizvod-str__poziv { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border: var(--crta-kartica) solid var(--akcent-rub-jak); background: var(--poziv-slabo); border-radius: var(--radijus); text-decoration: none; margin-bottom: 14px; }
.proizvod-str__poziv .ikona { width: 30px; height: 30px; }
.proizvod-str__poziv > span { display: grid; }
.proizvod-str__poziv-mali { font-size: .85rem; }
.proizvod-str__poziv strong { font-family: var(--font-broj); font-size: 1.5rem; letter-spacing: var(--razmak-broj, 0); }
.proizvod-str__obecanja { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; font-size: .93rem; }
.proizvod-str__obecanja li { display: flex; gap: 10px; align-items: center; }
.proizvod-str__obecanja .ikona { width: 20px; height: 20px; color: var(--ikona-boja); }
.proizvod-str__detalji { display: grid; gap: 32px; margin-top: 44px; }
@media (min-width: 1024px) { .proizvod-str__detalji { grid-template-columns: minmax(0, 1fr) 440px; gap: 56px; } }
.spec h2 { font-size: 1.5rem; }
.spec table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.spec th, .spec td { text-align: left; padding: 10px 0; border-bottom: 1px solid var(--crta); vertical-align: top; }
.spec th { font-weight: 400; color: var(--tekst-2); width: 46%; padding-right: 12px; }
.spec td { font-family: var(--font-broj); font-weight: 500; }
.oj-recenica, .proizvod-str__forma .oj-recenica { font-size: .92rem; }

/* kalkulator */
.kalkulator__mreza { display: grid; gap: 24px; }
@media (min-width: 1024px) { .kalkulator__mreza { grid-template-columns: minmax(0, 1fr) 400px; gap: 48px; align-items: start; } }
.kalkulator__grupa { border: 0; margin: 0 0 18px; padding: 0; }
.kalkulator__grupa legend { font-family: var(--font-naslov); font-weight: var(--tezina-naslov); font-size: 1.25rem; margin-bottom: 8px; }
.kalkulator__uredaj { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 10px; border-bottom: 1px solid var(--crta); border-radius: var(--radijus); }
.kalkulator__uredaj.je-odabran { background: var(--poziv-slabo); }
.kalkulator__naziv { display: grid; line-height: 1.2; }
.kalkulator__naziv small { color: var(--tekst-2); font-family: var(--font-broj); font-size: .8rem; }
.kolicina { display: inline-flex; align-items: center; border: 1px solid var(--crta-jaka); border-radius: var(--radijus); flex: none; }
.kolicina button { width: 42px; height: 42px; border: 0; background: none; font-size: 1.3rem; cursor: pointer; }
.kolicina button:hover { background: var(--ton); }
.kolicina output { min-width: 28px; text-align: center; font-family: var(--font-broj); font-weight: 700; }
.kalkulator__vlastiti { display: grid; gap: 4px; margin: 10px 0 14px; }
.kalkulator__vlastiti input { height: 46px; max-width: 220px; padding: 0 12px; border: 1px solid var(--crta-jaka); border-radius: var(--radijus); background: var(--povrsina); }
.kalkulator__rezultat { position: sticky; top: 96px; display: grid; gap: 14px; padding: 20px; background: var(--povrsina); border: var(--crta-kartica) solid var(--crta-jaka); border-radius: var(--radijus); }
@media (max-width: 1023px) { .kalkulator__rezultat { position: sticky; bottom: 72px; top: auto; z-index: 5; box-shadow: 0 -8px 24px rgba(0,0,0,.12); max-height: 60vh; overflow: auto; } }
.kalkulator__brojke { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.kalkulator__brojke div { display: grid; }
.kalkulator__brojke span { font-size: .8rem; color: var(--tekst-2); }
.kalkulator__brojke strong { font-family: var(--font-broj); font-size: 1.25rem; }
.kalkulator__preporuka { grid-column: 1 / -1; padding: 12px; background: var(--kalk-pozadina); color: var(--kalk-tekst); border-radius: var(--radijus); }
.kalkulator__preporuka span { color: inherit !important; opacity: .85; }
.kalkulator__preporuka strong { font-size: 2rem; }
.kalkulator__prijedlozi ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.kalkulator__prijedlozi a { display: grid; grid-template-columns: 56px 1fr auto; gap: 10px; align-items: center; padding: 6px; border: 1px solid var(--crta); border-radius: var(--radijus); text-decoration: none; }
.kalkulator__prijedlozi a:hover { border-color: var(--crta-jaka); }
.kalkulator__prijedlozi img { width: 56px; height: 56px; object-fit: contain; background: #fff; }
.kalkulator__prijedlozi span { display: grid; }
.kalkulator__prijedlozi small { color: var(--tekst-2); font-size: .8rem; }
.kalkulator__prijedlozi b { font-family: var(--font-broj); }
.kalkulator__naslov { font-weight: 700; margin-bottom: 6px; }
.kalkulator__metoda { margin-top: 24px; font-size: .9rem; color: var(--tekst-2); max-width: 80ch; }

/* obrasci */
.obrazac-blok__mreza { display: grid; gap: 32px; }
@media (min-width: 1024px) { .obrazac-blok__mreza { grid-template-columns: minmax(0, 1fr) 380px; gap: 56px; align-items: start; } }
.obrazac-blok__strana { display: grid; gap: 24px; }
.obrazac-blok__strana .blok { padding: 0; }
.obrazac-blok__strana .okvir { padding: 0; }
.obrazac fieldset { border: 0; margin: 0 0 22px; padding: 0; display: grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 640px) { .obrazac fieldset { grid-template-columns: 1fr 1fr; } }
.obrazac legend { font-family: var(--font-naslov); font-weight: var(--tezina-naslov); font-size: 1.35rem; margin-bottom: 10px; padding: 0; }
.obrazac__polje { display: grid; gap: 5px; }
.obrazac__polje--puno, .obrazac__kvacica, .obrazac__pomoc { grid-column: 1 / -1; }
.obrazac label { font-weight: 600; font-size: .94rem; }
.obrazac small { color: var(--tekst-2); font-size: .84rem; }
.obrazac input:not([type=checkbox]):not([type=file]), .obrazac select, .obrazac textarea { width: 100%; min-height: 50px; padding: 10px 12px; border: var(--crta-polje) solid var(--crta-jaka); border-radius: var(--radijus); background: var(--povrsina); font-size: 1rem; }
.obrazac textarea { min-height: 110px; resize: vertical; }
.obrazac [aria-invalid="true"] { border-color: var(--greska) !important; box-shadow: 0 0 0 2px var(--greska); }
.obrazac__datoteke label { display: flex; align-items: center; gap: 10px; }
.obrazac__datoteke input { padding: 14px; border: 2px dashed var(--crta-jaka); border-radius: var(--radijus); background: var(--povrsina); width: 100%; }
.obrazac__kvacica { display: flex; gap: 10px; align-items: flex-start; font-weight: 400 !important; }
.obrazac__kvacica input { width: 22px; height: 22px; flex: none; accent-color: var(--tamna); margin: 1px 0 0; }
.poruka { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; margin-bottom: 20px; border-radius: var(--radijus); border: 2px solid; }
.poruka p { margin: 0; font-weight: 600; }
.poruka--ok { border-color: var(--uspjeh); background: color-mix(in srgb, var(--uspjeh) 10%, var(--povrsina)); }
.poruka--ok .ikona { color: var(--uspjeh); }
.poruka--greska { border-color: var(--greska); background: color-mix(in srgb, var(--greska) 10%, var(--povrsina)); }

/* kontakt */
.kontakt__mreza { display: grid; gap: 28px; }
@media (min-width: 1024px) { .kontakt__mreza { grid-template-columns: 1fr 1fr; gap: 56px; align-items: start; } }
.kontakt__broj { display: grid; gap: 8px; padding: 24px; background: var(--akcent); color: var(--akcent-tekst); text-decoration: none; border-radius: var(--radijus); }
.kontakt__oznaka { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; }
.kontakt__znamenke { font-family: var(--font-broj); font-weight: var(--tezina-broj); font-size: clamp(2.4rem, 9vw, 4.4rem); line-height: 1; letter-spacing: var(--razmak-broj-veliki, 0); }
.kontakt__kanali { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--crta-jaka); }
.kontakt__kanali a { display: grid; grid-template-columns: 28px 1fr; column-gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--crta); text-decoration: none; }
.kontakt__kanali .ikona { grid-row: span 2; width: 26px; height: 26px; color: var(--ikona-boja); }
.kontakt__kanali span { font-weight: 700; font-size: 1.1rem; }
.kontakt__kanali small { color: var(--tekst-2); }
.pravni__popis { display: grid; grid-template-columns: 1fr; gap: 0; margin: 0; border-top: 1px solid var(--crta-jaka); }
@media (min-width: 768px) { .pravni__popis { grid-template-columns: 1fr 1fr; column-gap: 40px; } }
.pravni__popis div { padding: 12px 0; border-bottom: 1px solid var(--crta); }
.pravni__popis dt { font-size: .82rem; color: var(--tekst-2); }
.pravni__popis dd { margin: 0; font-weight: 600; }

/* obične stranice: košarica, blagajna, pretraga */
.obicna { padding-top: 24px; padding-bottom: 56px; }
.rezultati { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--crta-jaka); }
.rezultati a { display: grid; gap: 4px; padding: 14px 0; border-bottom: 1px solid var(--crta); text-decoration: none; }
.rezultati span { color: var(--tekst-2); font-size: .95rem; }
.woocommerce table.shop_table { border-collapse: collapse; width: 100%; background: var(--povrsina); border: 1px solid var(--crta); border-radius: var(--radijus); }
.woocommerce table.shop_table th, .woocommerce table.shop_table td { padding: 12px; border-top: 1px solid var(--crta); text-align: left; }
.woocommerce table.shop_table img { width: 64px; background: #fff; }
.woocommerce .button, .woocommerce button.button, .woocommerce a.button, .woocommerce #place_order { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: .7em 1.2em; border: var(--crta-gumb) solid var(--tamna); background: var(--tamna); color: var(--tamna-tekst); font-family: var(--font-gumb); font-weight: 700; border-radius: var(--radijus); cursor: pointer; text-decoration: none; }
.woocommerce .checkout-button, .woocommerce #place_order { width: 100%; min-height: 56px; font-size: 1.1rem; background: var(--akcent); color: var(--akcent-tekst); border-color: var(--akcent-rub); }
.woocommerce form .form-row { display: grid; gap: 4px; margin: 0 0 12px; }
.woocommerce form .form-row label { font-weight: 600; font-size: .92rem; }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .woocommerce form .form-row select, .woocommerce .quantity input, .woocommerce #coupon_code { min-height: 48px; padding: 8px 12px; border: 1px solid var(--crta-jaka); border-radius: var(--radijus); background: var(--povrsina); width: 100%; }
.woocommerce .quantity input { width: 80px; }
.woocommerce-message, .woocommerce-info, .woocommerce-error { list-style: none; padding: 14px 16px; margin: 0 0 18px; border: 2px solid var(--crta-jaka); border-radius: var(--radijus); background: var(--povrsina); display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between; align-items: center; }
.woocommerce-error { border-color: var(--greska); }
.woocommerce-checkout-review-order, #order_review { background: var(--povrsina); border: 1px solid var(--crta); padding: 16px; border-radius: var(--radijus); }
#payment ul.payment_methods { list-style: none; padding: 0; margin: 0 0 14px; display: grid; gap: 8px; }
#payment .payment_box { font-size: .92rem; color: var(--tekst-2); padding: 8px 0 0 26px; }
.woocommerce-cart .cart-collaterals .cart_totals { margin-top: 24px; }
@media (min-width: 900px) { .woocommerce-checkout form.checkout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 40px; } .woocommerce-checkout form.checkout > * { min-width: 0; } #customer_details .col-1, #customer_details .col-2 { width: 100% !important; float: none !important; } }
.woocommerce-checkout #order_review_heading { display: none; }
.woocommerce-checkout .col2-set .col-1, .woocommerce-checkout .col2-set .col-2 { width: 100%; float: none; }
@media (max-width: 640px) {
  .prekidac { left: auto; right: 8px; bottom: 74px; font-size: .72rem; padding: 3px; }
  .prekidac a { padding: 6px 9px; }
  .prekidac__ime { display: none; }
}
/* međunarodni zapis broja (SL, EN) je dulji */
.jezik-sl .hero__broj-znamenke, .jezik-en .hero__broj-znamenke { font-size: clamp(2.1rem, 8.6vw, 5rem); }
.jezik-sl .kontakt__znamenke, .jezik-en .kontakt__znamenke { font-size: clamp(2rem, 7.8vw, 3.8rem); }
.jezik-sl .akcijska-traka__poziv, .jezik-en .akcijska-traka__poziv { font-size: 1.12rem; }
/* CookieYes (dolazi iz GTM-a): gumb postavki iznad trake za poziv */
@media (max-width: 1023px) { .cky-btn-revisit-wrapper { bottom: 84px !important; } }