/* BKH stranica kategorije — ucitava se samo tamo gdje treba. */
/* ============================================================ STRANICA PODKATEGORIJE — po uzoru na myfrenchie kolekcijsku stranicu. Sve je ogradjeno u .bkh-cat da ne dira stil clanka ispod. ============================================================ */ .bkh-cat{font-family:'Hanken Grotesk',system-ui,sans-serif;letter-spacing:-.006em;color:#1C1C21}
/* --- vrh stranice --- */ .bkh-cat .cathero{padding:44px 0 8px}
.bkh-cat .cat-kicker{font-size:12px;font-weight:700;text-transform:uppercase;color:#A6A6AD;margin:0 0 12px}
.bkh-cat .cathero h1{font-weight:800;letter-spacing:-.02em;margin:0 0 14px;color:#1C1C21}
.bkh-cat .ctag{font-family:'Archivo','Hanken Grotesk',sans-serif;font-size:clamp(21px,2.8vw,31px);font-weight:900;letter-spacing:.006em;line-height:1.3;color:#242A30;margin:6px 0 14px}
.bkh-cat .cathero p{font-size:17px;line-height:1.7;color:#4C525A}
.bkh-cat .cat-accent{width:54px;height:3px;background:#363C42;border-radius:2px}
.bkh-cat .cbenefits{list-style:none;display:flex;flex-wrap:wrap;gap:16px 26px;max-width:760px;margin:26px 0 0;padding:0;text-align:left}
.bkh-cat .cbenefits li{display:flex;gap:11px;align-items:flex-start;font-size:14.5px;color:#6B6B72;line-height:1.55;margin:0}
.bkh-cat .cbenefits .ck{width:22px;height:22px;border-radius:50%;background:#363C42;color:#fff;display:grid;place-items:center;flex:none;margin-top:1px}
.bkh-cat .cbenefits .ck svg{width:13px;height:13px}
.bkh-cat .cbenefits b{color:#1C1C21;font-weight:700}
.bkh-cat .cathero-img{width:100%;border-radius:18px;border:1px solid #E6E6E9;margin:4px 0 24px;aspect-ratio:16/7;object-fit:cover;display:block}
/* --- mreza proizvoda --- */ .bkh-cat .csec{padding:34px 0}
.bkh-cat .csec-h{font-size:24px;font-weight:800;letter-spacing:-.02em;margin:0 0 14px;color:#1C1C21}
.bkh-cat .csec-p{font-size:15px;color:#6B6B72;margin:0 0 22px;max-width:62ch}
.bkh-cat .cprods{display:grid;gap:16px;grid-template-columns:1fr}
.bkh-cat .cprod{border:1px solid #E6E6E9;border-radius:14px;overflow:hidden;background:#fff;transition:.16s;display:flex;flex-direction:column}
.bkh-cat .cprod:hover{box-shadow:0 22px 44px -32px rgba(28,28,33,.4)}
.bkh-cat .cprod .cim{aspect-ratio:1;background:#F7F7F8;position:relative;overflow:hidden}
.bkh-cat .cprod .cim img{width:100%;height:100%;object-fit:cover;display:block}
.bkh-cat .cprod .cbadge{position:absolute;top:10px;left:10px;background:#fff;border:1px solid #E6E6E9;border-radius:999px;font-size:10.5px;font-weight:700;padding:4px 9px;color:#6B6B72}
.bkh-cat .cprod .cbd{padding:14px 15px 16px;display:flex;flex-direction:column;flex:1}
.bkh-cat .cprod .ceyebrow{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#363C42;margin-bottom:7px}
.bkh-cat .cprod h3{font-size:16px;font-weight:800;line-height:1.3;margin:0 0 8px;letter-spacing:-.01em}
.bkh-cat .cprod .cdesc{font-size:13.5px;color:#6B6B72;line-height:1.55;margin:0 0 12px}
.bkh-cat .cprod ul{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:6px}
.bkh-cat .cprod ul li{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:#4C525A;margin:0}
.bkh-cat .cprod ul li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:#363C42;margin-top:6px}
.bkh-cat .cprod form{margin-top:auto}
.bkh-cat .cprod button{width:100%;border:0;border-radius:11px;background:#1C1C21;color:#fff;font-family:inherit;font-weight:600;font-size:14px;padding:12px 16px;cursor:pointer;transition:.16s}
.bkh-cat .cprod button:hover{background:#363C42}
/* --- FAQ na dnu --- */ .bkh-cat .cfaq{max-width:760px}
.bkh-cat .cfaq details{border:1px solid #E6E6E9;border-radius:12px;padding:2px 16px;margin-bottom:10px;background:#fff}
.bkh-cat .cfaq summary{font-weight:600;font-size:15px;padding:15px 0;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px}
.bkh-cat .cfaq summary::-webkit-details-marker{display:none}
.bkh-cat .cfaq summary::after{content:"+";color:#6B6B72;font-size:20px;font-weight:400}
.bkh-cat .cfaq details[open] summary::after{content:"–"}
.bkh-cat .cfaq p{color:#6B6B72;font-size:14.5px;padding:0 0 15px;margin:0;line-height:1.65}
/* naslovi u Archivu, kao na myfrenchie stranicama clanaka */ .tbk-article-header h1,.tbk-article-content h2,.tbk-article-content h3, .bkh-cat .csec-h,.bkh-cat .cathero h1{font-family:'Archivo','Hanken Grotesk',system-ui,sans-serif}
/* ---------- vrh stranice: centriran, kao kod myfrenchie ---------- */ .bkh-cat .cathero{padding:40px 0 6px;text-align:center}
.bkh-cat .cathero .bkh-wrap{display:flex;flex-direction:column;align-items:center}
.bkh-cat .cat-kicker{letter-spacing:.14em}
.bkh-cat .cathero h1{font-size:clamp(34px,5.6vw,62px);line-height:1.06}
.bkh-cat .ctag{max-width:22ch}
.bkh-cat .cathero p{text-align:center;max-width:58ch;margin:0 auto 4px}
.bkh-cat .cat-accent{margin:24px auto}
.bkh-cat .cbenefits{justify-content:center}
.bkh-cat .cbenefits li{flex:0 1 320px}
.bkh-cat .cbrd{font-size:13px;color:#6E6E78;padding:14px 0 0}
.bkh-cat .cbrd a{color:#6B6B72;text-decoration:none}
.bkh-cat .cbrd a:hover{color:#1C1C21}
/* ---------- kartica: slika, pilula, ime, tamno dugme ---------- */ /* telefon: jedna kartica po redu — u dvije kolone je bilo nepregledno */ .bkh-cat .cgrid{display:grid;gap:18px;grid-template-columns:1fr}
@media (min-width:640px){.bkh-cat .cgrid{grid-template-columns:repeat(2,1fr)}}
.bkh-cat .ccat{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid #E6E6E9;border-radius:16px;overflow:hidden;text-decoration:none;color:inherit;transition:transform .22s cubic-bezier(.22,1,.36,1),box-shadow .22s,border-color .22s}
.bkh-cat .ccat:hover{transform:translateY(-4px);border-color:#D5D5DA;box-shadow:0 30px 56px -34px rgba(28,28,33,.45)}
.bkh-cat .ccat-im{position:relative;aspect-ratio:4/3;overflow:hidden;background:linear-gradient(140deg,#F1F1F3,#F8F8F9)}
.bkh-cat .ccat-im img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s cubic-bezier(.22,1,.36,1)}
.bkh-cat .ccat:hover .ccat-im img{transform:scale(1.05)}
.bkh-cat .ccat-tag{position:absolute;top:11px;left:11px;z-index:2;background:#fff;border:1px solid #E6E6E9;border-radius:999px;font-size:10.5px;font-weight:700;letter-spacing:.02em;padding:4px 10px;color:#6B6B72}
.bkh-cat .ccat-bd{padding:14px 15px 15px;display:flex;flex-direction:column;flex:1;gap:10px}
.bkh-cat .ccat-bd h3{margin:0;font-size:15px;font-weight:600;line-height:1.35;color:#1C1C21;letter-spacing:-.004em}
.bkh-cat .ccat-bd .cdesc{margin:0;font-size:13px;color:#6B6B72;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bkh-cat .ccat-go{margin-top:auto;display:inline-flex;align-items:center;justify-content:center;gap:7px;background:#1C1C21;color:#fff;border-radius:11px;padding:11px 16px;font-size:13.5px;font-weight:600;transition:background .16s}
.bkh-cat .ccat-go svg{width:15px;height:15px;transition:transform .2s}
.bkh-cat .ccat:hover .ccat-go{background:#363C42}
.bkh-cat .ccat:hover .ccat-go svg{transform:translateX(3px)}
@media (min-width:640px){.bkh-cat .cprods{grid-template-columns:repeat(2,1fr)}}
@media (min-width:760px){.bkh-cat .cgrid{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1000px){.bkh-cat .cprods{grid-template-columns:repeat(3,1fr)}}
@media (prefers-reduced-motion:reduce){.bkh-cat .ccat,.bkh-cat .ccat-im img,.bkh-cat .ccat-go svg{transition:none}.bkh-cat .ccat:hover,.bkh-cat .ccat:hover .ccat-im img{transform:none}}

/* ---- mobilna popravka: oznake ispod 12 px su na telefonu presitne ---- */
@media (max-width: 900px) {
  .bkh-cat .ccat-tag, .bkh-cat .cprod .cbadge { font-size: 12px; }
  .bkh-cat .cprod .ceyebrow { font-size: 12px; }
}

/* ---------- tekstualne sekcije: jedna kolona za citanje ----------
   Bilo je: pasusi preko cijele sirine (1180 px, oko 150 znakova u redu),
   a tabela centrirana na 880 px — dakle uvucena 149 px u odnosu na tekst.
   Sada sve pocinje na istoj lijevoj ivici i ne razvlaci se preko mjere. */
.bkh-cat .csec > .bkh-wrap > p,
.bkh-cat .csec > .bkh-wrap > ul,
.bkh-cat .csec > .bkh-wrap > ol{max-width:68ch;margin-left:0;margin-right:auto}
.bkh-cat .csec > .bkh-wrap > .csec-h{max-width:820px;margin-left:0;margin-right:auto}
/* tabela ide preko pune sirine da se treca kolona ne sijece, ali pocinje
   na istoj lijevoj ivici kao tekst */
.bkh-cat .csec > .bkh-wrap > .tbk-tabwrap{max-width:none;margin-left:0;margin-right:0}

/* podnaslov u vrhu: dvije linije umjesto tri */
.bkh-cat .cathero .ctag{max-width:28ch}
