nosi `.kb a.` prefiks — goli `.kb a{color:inherit}` bi inače obojio sve
u bijelo naslijeđeno iz plavog zaglavlja. */
.kb-trazi{position:relative}
.kb-predlozi{position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:95;
background:#fff;color:var(--tekst);text-align:left;border-radius:16px;padding:.4rem;
box-shadow:0 18px 44px rgba(0,20,40,.28),0 0 0 1px rgba(0,20,40,.06);
max-height:min(72vh,620px);overflow-y:auto;overscroll-behavior:contain}
.kb-predlozi[hidden]{display:none}
.kb-predlozi--radi{opacity:.72;transition:opacity .15s}
.kb-predlozi__grupa{display:flex;flex-direction:column;padding-bottom:.35rem;margin-bottom:.35rem;
border-bottom:1px solid var(--ivica)}
.kb a.kb-predlozi__kat{display:flex;align-items:center;gap:.6rem;padding:.55rem .7rem;
border-radius:10px;text-decoration:none;color:var(--ponoc);font-size:.92rem}
.kb-predlozi__kat i{margin-left:auto;font-style:normal;font-family:var(--uski);font-size:.8rem;color:var(--tih)}
.kb-predlozi__vrsta{font-family:var(--uski);font-size:.66rem;font-weight:700;letter-spacing:.06em;
text-transform:uppercase;color:var(--plava);background:var(--nebo);padding:.14rem .42rem;border-radius:4px}
.kb a.kb-predlozi__art{display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;
gap:.7rem;padding:.5rem .6rem;border-radius:10px;text-decoration:none;color:var(--tekst)}
.kb-predlozi__slika{width:48px;height:48px;background:#fff;display:grid;place-items:center;overflow:hidden}
.kb-predlozi__slika img{width:100%;height:100%;object-fit:contain}
.kb-predlozi__tekst{min-width:0;display:flex;flex-direction:column;gap:.12rem}
.kb-predlozi__tekst b{font-weight:600;font-size:.88rem;line-height:1.3;color:var(--ponoc);
display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.kb-predlozi__tekst small{font-family:var(--uski);font-size:.76rem;color:var(--tih)}
.kb-predlozi__tekst em{font-style:normal;color:#B3261E}
.kb-predlozi__cijena{display:flex;flex-direction:column;align-items:flex-end;font-weight:800;
font-size:.9rem;color:var(--ponoc);white-space:nowrap;font-variant-numeric:tabular-nums}
.kb-predlozi__cijena s{font-weight:500;font-size:.74rem;color:var(--tih)}
.kb .kb-predlozi a[aria-selected="true"],.kb .kb-predlozi a:hover{background:var(--nebo)}
.kb a.kb-predlozi__sve{display:block;margin-top:.3rem;padding:.75rem .8rem;border-top:1px solid var(--ivica);
font-weight:700;font-size:.9rem;color:var(--plava);text-decoration:none;border-radius:0 0 10px 10px}
.kb-predlozi__sve i{font-style:normal;font-family:var(--uski);color:var(--tih);font-weight:600}
.kb p.kb-predlozi__napomena,.kb p.kb-predlozi__nista{font-size:.86rem;color:var(--tih);padding:.6rem .7rem;margin:0}
/* alati desno: korpa UVIJEK, lupa i hamburger samo na telefonu */
.kb-alati{display:flex;gap:.4rem;align-items:center;flex:none}
.kb-ikona{background:none;border:0;color:#fff;padding:.45rem;cursor:pointer;display:grid;place-items:center;
border-radius:999px;min-width:42px;min-height:42px}
.kb-ikona[aria-expanded="true"]{background:rgba(255,255,255,.18)}
.kb-ikona--mob{display:none}
/* korpa: bijeli krug, plava ikona, broj u tamnoj znački */
.kb .kb-alati a.kb-korpica{position:relative;width:46px;height:46px;border-radius:999px;
background:#fff;color:var(--plava);display:grid;place-items:center;flex:none;
box-shadow:0 4px 14px rgba(0,20,40,.2);transition:transform .18s ease,box-shadow .18s ease}
.kb .kb-alati a.kb-korpica:hover{transform:translateY(-1px) scale(1.05);
box-shadow:0 7px 20px rgba(0,20,40,.3);color:var(--more)}
.kb-korpica svg{width:24px;height:24px}
.kb-korpica__br{position:absolute;top:-5px;right:-5px;min-width:21px;height:21px;
border-radius:999px;background:var(--ponoc);color:#fff;border:2px solid #fff;
font-family:var(--uski);font-weight:700;font-size:.72rem;line-height:1;
display:grid;place-items:center;padding-inline:4px}
.kb-korpica__br--nula{display:none}
/* ── traka povjerenja: POKRETNA (marquee) ────────────────────────────────
Dvije identične kopije sadržaja + translateX(-50%) = besprijekorna petlja.
Pauza na hover; uz prefers-reduced-motion stoji mirno (pravilo dolje). */
.kb-dokazi{background:var(--more);color:#fff;overflow:hidden}
.kb-dokazi__traka{display:flex;width:max-content;animation:kb-marq 38s linear infinite}
.kb-dokazi__traka:hover{animation-play-state:paused}
.kb-dokazi__grupa{display:flex;align-items:center;gap:1.15rem;white-space:nowrap;
padding:.62rem 1.15rem .62rem 0;font-size:.85rem}
.kb-dokaz{display:flex;align-items:center;gap:.4rem}
.kb-dokazi b{font-family:var(--uski);font-weight:700;letter-spacing:.02em}
.kb-dokazi__zvijezda{font-style:normal;color:#7FD0F5;opacity:.65;font-size:.8rem}
@keyframes kb-marq{to{transform:translateX(-50%)}}
/* ── HERO s Bekovom fotografijom ────────────────────────────────────────
Slika je Bekova vlastita (beko.co.uk) i vec nosi tamnoplavi gradijent
napravljen ZA tekst — lijevo na desktopu, dolje na telefonu.
⚠ Tekst NIKAD ne ovisi samo o toj slici: preko nje ide i nas gradijent,
pa naslov ostaje citljiv i ako se kadar drukcije isjece ili slika ne
stigne. Bez toga bijeli naslov zna pasti na svijetli dio kadra.
⚠ Visina se NE fiksira. Sadrzaj gura hero, a `padding-top` na telefonu
drzi tekst ispod aparata — fiksna visina bi na duzem tekstu presjekla. */
.kb-hero{position:relative;background:#092C50;color:#fff;overflow:hidden;isolation:isolate}
.kb-hero__slika{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
object-position:50% 50%;z-index:-2}
/* Kampanjska slika VEĆ ima praznu tamnu trećinu lijevo, pa je naš preljev
blag — samo osigurava tekst ako se kadar drukčije isječe. */
.kb-hero::after{content:"";position:absolute;inset:0;z-index:-1;
background:linear-gradient(90deg,rgba(4,26,48,.72) 0%,rgba(4,26,48,.45) 26%,rgba(4,26,48,0) 48%)}
/* ⚠ Gornja granica visine je bila 520 px: na 1920 px je slika (1920×706)
gubila ~26% kadra, a na 2560 px je hero izgledao kao tanka traka. Sada
raste do 660 px — kampanjska fotografija ostaje skoro cijela. */
.kb-hero__mreza{display:block;padding-block:clamp(3rem,7vw,5.5rem);min-height:clamp(340px,34vw,660px);
display:flex;flex-direction:column;justify-content:center}
.kb-hero__tekst{max-width:44ch}
.kb-hero h1{color:#fff;font-size:clamp(1.95rem,1.1rem + 3.4vw,4rem);
text-shadow:0 2px 18px rgba(0,20,40,.45)}
.kb-hero h1 em{font-style:normal;color:#7FD0F5}
.kb-hero__uvod{margin-top:1rem;max-width:40ch;font-size:clamp(.95rem,.9rem + .2vw,1.05rem);color:#D3E5F1}
.kb-hero__brendovi span{white-space:nowrap}
.kb-hero__akcije{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.6rem}
/* ── traka energetske ljestvice — sad ima svoju sekciju, ne stoji na slici ──
Radial „dah" u uglu + tanka donja ivica: sekcija dobije dubinu i jasan kraj,
umjesto da ravna kost-pozadina samo iscuri u sljedeću (Eldin: „bačeno"). */
.kb-skala{position:relative;background:var(--kost);padding-block:clamp(2.5rem,5vw,4rem);
isolation:isolate;border-bottom:1px solid var(--ivica)}
.kb-skala::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
background:radial-gradient(640px 320px at 8% -10%,rgba(1,128,201,.10),transparent 62%),
radial-gradient(520px 300px at 96% 108%,rgba(127,208,245,.14),transparent 60%)}
/* ── razdjelnik sekcija: tanka gradient linija sa ✦ potpisom ─────────────── */
.kb-razdjel{max-width:min(560px,72%);margin:0 auto;display:flex;align-items:center;gap:1rem;
padding-block:.35rem}
.kb-razdjel::before,.kb-razdjel::after{content:"";flex:1;height:1px;
background:linear-gradient(90deg,transparent,rgba(1,128,201,.35))}
.kb-razdjel::after{background:linear-gradient(90deg,rgba(1,128,201,.35),transparent)}
.kb-razdjel i{font-style:normal;color:var(--plava);opacity:.55;font-size:.85rem;line-height:1}
/* ── scroll-reveal (klasu dodaje JS na naslovnoj — bez JS-a sve stoji vidljivo) ── */
.kb-otkrij{opacity:0;transform:translateY(18px);
transition:opacity .55s ease,transform .55s ease}
.kb-otkrij--vidljiv{opacity:1;transform:none}
/* ⚠ Kolona mora biti FIKSNA, ne `auto` — s `auto` se kolona stisne na sadržaj
pa `width:min(340px,100%)` na kartici razriješi u ~247 px i naljepnica
ispadne uža nego što je zamišljena. */
.kb-skala__mreza{display:grid;grid-template-columns:minmax(0,1fr) 340px;
gap:clamp(1.5rem,4vw,3.5rem);align-items:center}
.kb-skala h2{font-size:clamp(1.35rem,1.05rem + 1.1vw,1.9rem);max-width:20ch}
.kb p.kb-skala__uvod{margin-top:.75rem;color:var(--tih);max-width:46ch;font-size:.95rem;line-height:1.6}
/* ── vodiči: kutija na kategoriji, veza na PDP-u, dugi opis na dnu ────── */
.kb a.kb-vodic-kutija{display:inline-flex;align-items:center;gap:.6rem;margin-top:.4rem;
padding:.55rem .9rem;background:var(--nebo);border:1px solid #BCE0F2;color:var(--more);
font-size:.9rem;font-weight:600;text-decoration:none;align-self:flex-start}
.kb a.kb-vodic-kutija:hover{background:#D5EDFA}
.kb-vodic-kutija__oznaka{font-family:var(--uski);font-weight:800;font-size:.7rem;
letter-spacing:.12em;text-transform:uppercase;color:var(--plava)}
.kb a.kb-vodic-veza{color:var(--plava);font-weight:600;font-size:.92rem;text-decoration:none}
.kb a.kb-vodic-veza:hover{text-decoration:underline}
.kb-dno-opis{margin-top:2.5rem;padding-top:1.8rem;border-top:1px solid var(--ivica);
max-width:70ch}
.kb-dno-opis h2{font-size:1.15rem;margin-bottom:.8rem}
/* ⚠ namjerno usko: globalni `.kb p + p` bi dirao sve stranice */
.kb-dno-opis p + p{margin-top:.6rem}
.kb-dno-opis p{color:var(--tih);font-size:.94rem;line-height:1.65}
.kb-dno-opis a{color:var(--plava)}
/* ── energetska ljestvica = potpis stranice ─────────────────────────────
Prije je bila gola lista prečki, a B–G na `opacity:.32` — izgledale su
izblijedjelo i slova se nisu čitala. Sada je NALJEPNICA: bijela kartica s
okvirom, sve klase u punoj boji, i svaka prečka je LINK na filter.
⚠ Boja slova ide po prečki: na tamnozelenoj i crvenoj bijelo, na žutoj
crno. Jedna boja za sve pada na kontrastu — provjereno okom. */
.kb-naljepnica{background:#fff;border:1px solid var(--ivica);padding:1.1rem 1.2rem 1rem;
width:min(340px,100%)}
.kb-naljepnica__vrh{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;
padding-bottom:.75rem;border-bottom:1px solid var(--ivica);margin-bottom:.9rem}
.kb-naljepnica__vrh b{font-family:var(--uski);font-weight:800;font-size:.78rem;
letter-spacing:.13em;text-transform:uppercase;color:var(--ponoc)}
.kb-naljepnica__vrh span{font-family:var(--uski);font-weight:700;font-size:.78rem;color:var(--tih)}
.kb p.kb-naljepnica__noga{margin-top:.9rem;font-size:.78rem;color:var(--tih);line-height:1.45}
.kb-ljestvica{display:flex;flex-direction:column;gap:4px;list-style:none;margin:0;padding:0}
/* ⚠ Prečka je postotak RODITELJA, pa `.kb-precka` mora biti pune širine —
inače se postotak računa od skupljenog flex reda i sve ispadne sitno. */
.kb-precka{display:flex;align-items:center;gap:.6rem;width:100%}
.kb-precka__most{flex:1 1 auto;min-width:0}
.kb a.kb-precka__traka{height:30px;width:var(--w);flex:none;display:flex;align-items:center;
padding-left:.6rem;color:var(--fg);font-family:var(--uski);font-weight:800;font-size:.95rem;
letter-spacing:.02em;text-decoration:none;transition:transform .16s ease,filter .16s ease;
clip-path:polygon(0 0,calc(100% - 13px) 0,100% 50%,calc(100% - 13px) 100%,0 100%)}
.kb a.kb-precka__traka:hover{transform:translateX(4px);filter:saturate(1.15)}
/* Natpisi skale idu IZNAD i ISPOD ljestvice, ne pored prečki — prečka ide
punom širinom pa pored nje nema mjesta. Ovako se i čita kao prava
naljepnica: gore najštedljivije, dolje najskuplje. */
.kb p.kb-precka__oznaka{font-size:.73rem;color:var(--tih);font-family:var(--uski);
font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.kb p.kb-precka__oznaka--vrh{margin-bottom:.45rem}
.kb p.kb-precka__oznaka--dno{margin-top:.45rem}
/* ── lifestyle plocice ──────────────────────────────────────────────────
Slika nosi kategoriju, tekst stoji ISPOD nje na bijelom — natpis preko
fotografije bi ovisio o kadru, a kadar nije nas. */
.kb-price{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:clamp(1rem,2vw,1.6rem)}
.kb-prica{display:block;text-decoration:none;color:inherit;background:#fff;
border:1px solid var(--ivica);overflow:hidden;transition:border-color .18s ease,transform .18s ease}
.kb-prica:hover{border-color:var(--plava);transform:translateY(-2px)}
.kb-prica img{display:block;width:100%;height:auto;aspect-ratio:585/378;object-fit:cover}
.kb-prica__tekst{padding:1.15rem 1.25rem 1.35rem}
.kb-prica h3{font-size:1.15rem;margin-top:.35rem}
.kb-prica__uvod{margin-top:.5rem;color:var(--tih);font-size:.92rem}
.kb-prica__vise{display:inline-flex;align-items:center;gap:.4rem;margin-top:.9rem;
font-family:var(--uski);font-weight:700;font-size:.86rem;color:var(--plava)}
.kb-prica:hover .kb-prica__vise{text-decoration:underline}
/* ── brendovi Beko grupe ────────────────────────────────────────────────
Ime nosi uski rez jer stoji umjesto logotipa — tudje logotipe ne kacimo
dok nemamo pisanu dozvolu za njih. */
.kb-brendovi{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
gap:1px;background:var(--ivica);border:1px solid var(--ivica);margin-top:.4rem}
.kb-brendovi__stavka{background:#fff;padding:1.35rem 1.4rem}
.kb-brendovi__ime{font-family:var(--uski);font-weight:800;font-size:1.15rem;
letter-spacing:.01em;color:var(--ponoc)}
.kb-brendovi__opis{margin-top:.55rem;color:var(--tih);font-size:.89rem;line-height:1.6}
.kb-grupa{background:var(--ponoc);color:#fff}
.kb-grupa .kb-brendovi{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.14)}
.kb-grupa .kb-brendovi__stavka{background:#0A2E45}
.kb-grupa .kb-brendovi__ime{color:#fff}
.kb-grupa .kb-brendovi__opis{color:#B7CBD8}
.kb-grupa h2{color:#fff}
.kb-grupa__uvod{margin-top:.7rem;color:#C9DEEC;max-width:62ch;font-size:.97rem}
/* brend koji nije iz grupe — svoj natpis i svoj blok, bez isprike u tekstu */
.kb-brendovi--van{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.kb-grupa .kb-brendovi--van .kb-brendovi__stavka{background:#0A2E45}
/* ⚠⚠ `.kb p{margin:0}` je (0,1,1) i TIHO ruši svako pravilo s jednom klasom
(0,1,0). Isti obrazac kao `.kb a{color:inherit}` koji je bijelo dugme
ostavio bijelim na bijelom. Ništa ne pukne — razmak jednostavno nestane i
blok izgleda „stisnuto". Zato svaki koji traži razmak nosi `p` u
selektoru. Provjereno na živoj stranici, ne u kodu. */
.kb p.kb-hero__uvod{margin-top:1rem}
.kb p.kb-grupa__uvod{margin-top:.7rem}
.kb p.kb-grupa__jos{margin-top:2.75rem;margin-bottom:.9rem}
.kb p.kb-brendovi__opis{margin-top:.55rem}
.kb p.kb-prica__uvod{margin-top:.5rem}
/* ── garancija duza od zakonskog minimuma ───────────────────────────────
Znacka se prikazuje SAMO kad artikal stvarno nosi duzi rok — nikad kao
globalna tvrdnja ([[feedback-garancija-24-mjeseca]]). */
.kb-garancija{display:inline-flex;align-items:center;gap:.35rem;
font-family:var(--uski);font-weight:700;font-size:.76rem;letter-spacing:.02em;
padding:.2rem .55rem;background:#E6F4FB;color:var(--more);border:1px solid #BCE0F2}
.kb-garancija svg{flex:none}
/* sekcije */
.kb-sekcija{padding-block:clamp(2.5rem,5vw,4rem)}
.kb-sekcija--kost{background:var(--kost)}
.kb-zs{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1.8rem}
.kb-zs h2{font-size:clamp(1.5rem,1.15rem + 1.2vw,2rem)}
.kb-zs p{color:var(--tih);font-size:.93rem;margin-top:.45rem;max-width:52ch}
/* pastelni krugovi + harmonika */
.kb-krugovi{display:grid;gap:1.5rem 1rem;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
list-style:none;margin:0;padding:0}
.kb-krug{display:flex;flex-direction:column;align-items:center;gap:.7rem;text-align:center;width:100%;
background:none;border:0;padding:0;cursor:pointer;font:inherit;color:inherit}
.kb-krug__disk{width:min(150px,100%);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;
padding:20%;transition:transform .22s ease,box-shadow .22s ease}
.kb-krug:hover .kb-krug__disk{transform:translateY(-5px);
box-shadow:0 14px 28px rgba(0,33,53,.16),0 0 0 3px rgba(1,128,201,.22)}
/* disk s PRAVOM fotografijom artikla (kb_grupe v3): fotke dobavljača su na
bijeloj pozadini pa je i disk bijel; pastel ostaje samo fallback crtežima */
.kb-krug__disk--foto{background:#fff;border:1px solid var(--ivica);padding:12%;
box-shadow:0 4px 14px rgba(0,33,53,.07)}
.kb-krug__disk--foto img{width:100%;height:100%;object-fit:contain;display:block;
transition:transform .22s ease}
.kb-krug:hover .kb-krug__disk--foto img{transform:scale(1.07)}
.kb-krug__disk--tamni svg [stroke]{stroke:#fff}
.kb-krug__disk--tamni svg [fill="#fff"]{fill:transparent}
.kb-krug__disk--tamni svg [fill="#F5F6F1"]{fill:rgba(255,255,255,.16)}
.kb-krug__disk--tamni svg [fill="#E6F4FB"]{fill:rgba(255,255,255,.24)}
.kb-krug__disk--tamni svg [fill="#002135"],.kb-krug__disk--tamni svg [fill="#00416B"]{fill:#fff}
.kb-krug__disk--tamni svg [fill="#B9D3E2"]{fill:rgba(255,255,255,.4)}
.kb-krug__ime{font-weight:600;font-size:.95rem;color:var(--ponoc);line-height:1.3}
.kb-krug__broj{font-family:var(--uski);font-size:.78rem;color:var(--tih)}
.kb-krug__strelica{color:var(--plava);transition:transform .2s ease;display:block}
.kb-krug[aria-expanded="true"] .kb-krug__strelica{transform:rotate(180deg)}
.kb-krug[aria-expanded="true"] .kb-krug__ime{color:var(--plava)}
.kb-cipovi{display:flex;flex-wrap:wrap;gap:.55rem;justify-content:center;margin-top:2rem;padding:1.4rem;
background:var(--kost);border-top:3px solid var(--plava)}
.kb-cipovi[hidden]{display:none}
.kb-cip{border-radius:999px;border:1px solid var(--ivica);background:#fff;color:var(--plava);
padding:.5rem 1.15rem;font-size:.87rem;font-weight:500;text-decoration:none}
.kb-cip:hover{background:var(--nebo)}
.kb-cip u{font-family:var(--uski);text-decoration:none;color:var(--tih);font-size:.8rem;margin-left:.35rem}
/* kartica proizvoda — Bekov obrazac: sifra + energetska strelica u istom redu */
.kb-mreza{display:grid;gap:1px;background:var(--ivica);border:1px solid var(--ivica);
grid-template-columns:repeat(auto-fill,minmax(232px,1fr))}
.kb-kartica{background:var(--papir);padding:1.2rem;display:flex;flex-direction:column;gap:.65rem;position:relative}
.kb-kartica__slika{background:var(--kost);aspect-ratio:1;display:grid;place-items:center;padding:1.1rem;overflow:hidden}
.kb-kartica__slika svg{height:100%;width:auto}
.kb-kartica__slika img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.kb-kartica__sifra{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;min-height:19px}
.kb-kartica__sifra b{font-family:var(--uski);font-weight:700;font-size:.88rem;color:var(--plava);letter-spacing:.02em}
.kb-kartica h3{font-size:.95rem;font-weight:600;line-height:1.35}
.kb-kartica h3 a{text-decoration:none}
.kb-kartica h3 a:hover{color:var(--plava)}
.kb-kartica__spec{font-family:var(--uski);font-size:.83rem;color:var(--tih);font-weight:500}
.kb-kartica__dno{margin-top:auto;display:flex;align-items:center;justify-content:space-between;
gap:.7rem;flex-wrap:wrap;padding-top:.35rem}
/* Snizena cijena: NOVA prva i krupna, stara sitno iza nje, pa „Usteda X KM".
Redoslijed okrece CSS (order), WooCommerceov HTML se NE dira — inace pucaju
varijabilni proizvodi i rasponi cijena.
⚠ `line-through` ide na TACNO JEDAN nivo: stoji li i na `del` i na `bdi`
unutar njega, preglednik crta dvije linije jednu preko druge. */
.kb-cijena{font-weight:800;font-size:1.15rem;color:var(--ponoc);letter-spacing:-.02em;font-variant-numeric:tabular-nums;
display:flex;flex-wrap:wrap;align-items:baseline;gap:.4em}
.kb-cijena ins{order:1;text-decoration:none;background:none;color:inherit}
.kb-cijena del{order:2;font-size:.45em;font-weight:500;color:var(--tih);text-decoration:none;opacity:.85}
/* Linija ide na `.amount`, a NE na `del` i ne na `bdi` unutar njega — WooCommerce 11
ovdje uopste ne ispisuje `bdi`, pa je pravilo pisano na njega crtalo nista.
`bdi` se izricito gasi da linija ostane jedna i kad ga WC vrati. */
.kb-cijena del .amount{text-decoration:line-through;text-decoration-thickness:1px}
.kb-cijena del .amount bdi{text-decoration:none}
.kb-usteda{order:3;flex-basis:100%;font-family:var(--uski);font-weight:700;font-size:.8rem;
letter-spacing:.01em;color:var(--e-g);margin-top:.15rem}
.kb-usteda bdi{font-size:inherit;font-weight:inherit}
.kb-cijena--velika .kb-usteda{font-size:.95rem;margin-top:.3rem}
.kb-znacka{position:absolute;top:1.2rem;left:1.2rem;z-index:1;background:var(--plava);color:#fff;
font-family:var(--uski);font-weight:700;font-size:.72rem;letter-spacing:.08em;padding:.28rem .6rem;text-transform:uppercase}
.kb-znacka--akcija{background:var(--e-g)}
/* energetska znacka: mala A/G skala + strelica s klasom */
.kb-enz{display:inline-flex;align-items:stretch;height:19px;font-family:var(--uski);font-weight:700}
.kb-enz__skala{background:var(--ponoc);color:#fff;font-size:.52rem;line-height:.95;padding:.15rem .25rem;
display:flex;flex-direction:column;justify-content:center;align-items:center}
.kb-enz__strelica{display:flex;align-items:center;padding:0 .45rem 0 .35rem;font-size:.82rem;color:#0B1A12;
clip-path:polygon(0 0,calc(100% - 8px) 0,100% 50%,calc(100% - 8px) 100%,0 100%)}
/* arhiva: filter sa strane + mreza */
.kb-plp{display:grid;grid-template-columns:1fr;gap:2rem}
@media (min-width:900px){.kb-plp{grid-template-columns:258px 1fr;gap:2.5rem}}
.kb-strana{border:1px solid var(--ivica);background:#fff;padding:1.25rem;align-self:start}
.kb-strana h2{font-size:1.02rem;margin-bottom:1rem}
/* mobilni dijelovi filtera (red s dugmetom, vrh/dno sheeta, zastor) su na
desktopu nevidljivi — sidebar tamo stoji normalno u koloni */
.kb-filter-red,.kb-strana__vrh,.kb-strana__dno{display:none}
.kb-strana-zastor{display:none}
/* ── telefon: filteri su BOTTOM-SHEET, ne zid iznad robe ─────────────────
(Eldin: proizvodi su počinjali ekran i po ispod vrha). Panel je ISTI
sidebar — fiksiran uz dno, klizi gore, unutra skroluje; zastor + scroll
lock + ESC nosi mali JS u KB · 06. Prag 899px prati .kb-plp kolone. */
@media (max-width:899px){
.kb-filter-red{display:flex;align-items:center;justify-content:space-between;
gap:1rem;margin-bottom:1.2rem}
.kb-filter-dugme{display:inline-flex;align-items:center;gap:.5rem;border:0;cursor:pointer;
font:inherit;font-size:.95rem;font-weight:700;color:#fff;background:var(--plava);
border-radius:999px;padding:.65rem 1.25rem;box-shadow:0 4px 14px rgba(1,128,201,.35)}
.kb-filter-dugme svg{width:19px;height:19px}
.kb-filter-broj{min-width:21px;height:21px;border-radius:999px;background:#fff;color:var(--plava);
font-family:var(--uski);font-weight:700;font-size:.74rem;display:grid;place-items:center;
padding-inline:4px}
.kb-filter-uk{color:var(--tih);font-size:.88rem;white-space:nowrap}
/* ⚠ Visina je EKSPLICITNA (ne top+bottom rastezanje): uz top/bottom je
panel znao dobiti visinu cijelog sadržaja pa „nema šta da skroluje".
dvh prati stvarno vidljiv viewport na telefonu (adresna traka!),
vh je fallback za starije browsere. */
.kb-strana{position:fixed;left:0;right:0;bottom:0;top:auto;z-index:85;
height:88vh;height:88dvh;
border:0;border-radius:20px 20px 0 0;box-shadow:0 -14px 44px rgba(0,20,40,.32);
overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
touch-action:pan-y;
padding:0 1.15rem calc(1rem + env(safe-area-inset-bottom));
transform:translateY(106%);transition:transform .32s cubic-bezier(.22,.9,.3,1);
visibility:hidden}
.kb-strana--otvorena{transform:none;visibility:visible}
.kb-strana > h2{display:none} /* desktop naslov — sheet ima svoj vrh */
.kb-strana__vrh{display:flex;align-items:center;justify-content:space-between;
position:sticky;top:0;z-index:2;background:#fff;
padding:1.05rem 0 .8rem;margin-bottom:1rem;border-bottom:1px solid var(--ivica)}
.kb-strana__vrh b{font-size:1.08rem;color:var(--ponoc)}
.kb-strana__x{border:0;background:var(--nebo);color:var(--more);cursor:pointer;
width:40px;height:40px;border-radius:999px;display:grid;place-items:center}
.kb-strana__dno{display:block;position:sticky;bottom:0;z-index:2;background:#fff;
padding:.9rem 0 calc(.35rem + env(safe-area-inset-bottom));
margin-top:1.3rem;border-top:1px solid var(--ivica)}
.kb-strana__dno .kb-pilula{width:100%;justify-content:center}
.kb-strana-zastor{display:block;position:fixed;inset:0;z-index:80;
background:rgba(0,20,40,.52);animation:kb-zastor .25s ease}
.kb-strana-zastor[hidden]{display:none}
}
@keyframes kb-zastor{from{opacity:0}}
.kb-strana__grupa{border-top:1px solid var(--ivica);padding-top:1rem;margin-top:1rem}
.kb-strana__grupa > p{font-weight:600;font-size:.88rem;color:var(--ponoc);margin-bottom:.6rem}
.kb-kvaka{display:flex;align-items:center;gap:.55rem;font-size:.88rem;padding:.22rem 0;color:var(--tekst);text-decoration:none}
.kb-kvaka:hover{color:var(--plava)}
.kb-kvaka span{width:15px;height:15px;border:1px solid var(--ivica);flex:none;display:grid;place-items:center}
.kb-kvaka--on span{background:var(--plava);border-color:var(--plava);color:#fff}
.kb-kvaka i{margin-left:auto;font-style:normal;font-family:var(--uski);font-size:.8rem;color:var(--tih)}
.kb-ljestve{display:flex;flex-direction:column;gap:3px;margin:0;padding:0;list-style:none}
.kb-rung{display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:.55rem;width:100%;
padding:.24rem .3rem;font-family:var(--uski);color:var(--tekst);text-decoration:none}
.kb-rung:hover .kb-rung__traka{transform:translateX(3px)}
.kb-rung__slovo{display:grid;place-items:center;height:26px;font-weight:700;font-size:.92rem;color:#0B1A12}
.kb-rung__traka{height:26px;transition:transform .18s ease;
clip-path:polygon(0 0,calc(100% - 12px) 0,100% 50%,calc(100% - 12px) 100%,0 100%)}
.kb-rung__broj{font-size:.79rem;font-weight:600;color:var(--tih);font-variant-numeric:tabular-nums}
.kb-rung--on{background:var(--nebo)}
.kb-rung--on .kb-rung__broj{color:var(--plava)}
.kb-rung--prazna{opacity:.32;pointer-events:none}
.kb-plp__vrh{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:1rem}
/* prva grupa odmah ispod naslova nema crtu — iznad je već naslov (desktop)
odnosno vrh panela s vlastitom crtom (telefon) */
.kb-strana > h2 + .kb-strana__grupa{border-top:0;padding-top:0;margin-top:0}
/* ── poredak (11.09.2026) ────────────────────────────────────────────────
Pravi