/* ==========================================================================
   KUĆA ZDRAVLJA, prikaz pojedinačnog teksta
   Duge stručne tekstove treba da bude lako čitati; sve ovde služi tome.
   ========================================================================== */

.kz-clanak { padding-block: var(--kz-r-8) var(--kz-sekcija); }

.kz-clanak__zaglavlje {
  max-width: var(--kz-sirina-tekst);
  margin: 0 auto var(--kz-r-7);
}
.kz-clanak__naslov {
  font-size: var(--kz-t-2xl);
  margin-bottom: var(--kz-r-4);
}
.kz-clanak__uvod {
  font-size: var(--kz-t-md);
  line-height: var(--kz-visina-citak);
  color: var(--kz-tekst-blazi);
  margin-bottom: var(--kz-r-5);
}
.kz-clanak__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--kz-r-2) var(--kz-r-4);
  font-size: var(--kz-t-xs);
  color: var(--kz-tekst-tih);
  padding-top: var(--kz-r-4);
  border-top: 1px solid var(--kz-linija-blaga);
}
.kz-clanak__meta a { color: var(--kz-tekst-blazi); }

.kz-clanak__slika {
  max-width: var(--kz-sirina-srednja);
  margin: 0 auto var(--kz-r-8);
  border-radius: var(--kz-zaob-md);
  overflow: hidden;
  background: var(--kz-krem-tamniji);
}
.kz-clanak__slika figcaption {
  font-size: var(--kz-t-xs);
  color: var(--kz-tekst-tih);
  padding: var(--kz-r-3) var(--kz-r-4);
  text-align: center;
}

/* --- Sam tekst ------------------------------------------------------------ */
.kz-tekst {
  max-width: var(--kz-sirina-tekst);
  margin-inline: auto;
  font-size: var(--kz-t-baza);
  line-height: var(--kz-visina-citak);
  color: var(--kz-tekst);
}
.kz-tekst > * { margin-bottom: var(--kz-r-5); }
.kz-tekst > *:last-child { margin-bottom: 0; }

.kz-tekst h2 {
  font-size: var(--kz-t-xl);
  margin-top: var(--kz-r-8);
  margin-bottom: var(--kz-r-4);
  padding-top: var(--kz-r-2);
}
.kz-tekst h3 {
  font-size: var(--kz-t-lg);
  margin-top: var(--kz-r-7);
  margin-bottom: var(--kz-r-3);
}
.kz-tekst h4 {
  font-size: var(--kz-t-md);
  margin-top: var(--kz-r-6);
  margin-bottom: var(--kz-r-3);
}
.kz-tekst h2:first-child,
.kz-tekst h3:first-child { margin-top: 0; }

.kz-tekst ul, .kz-tekst ol { padding-left: 1.3em; }
.kz-tekst li { margin-bottom: var(--kz-r-3); }
.kz-tekst li::marker { color: var(--kz-zelena-srednja); }

.kz-tekst a {
  font-weight: 500;
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--kz-zelena-srednja) 40%, transparent);
}

.kz-tekst img { border-radius: var(--kz-zaob-md); }

.kz-tekst figure { margin-block: var(--kz-r-7); }
.kz-tekst figcaption {
  font-size: var(--kz-t-xs);
  color: var(--kz-tekst-tih);
  text-align: center;
  margin-top: var(--kz-r-3);
  line-height: 1.55;
}

.kz-tekst blockquote {
  margin: var(--kz-r-7) 0;
  padding: var(--kz-r-5) var(--kz-r-6);
  background: var(--kz-zelena-najbleda);
  border-left: 3px solid var(--kz-zlatna);
  border-radius: 0 var(--kz-zaob) var(--kz-zaob) 0;
  font-family: var(--kz-font-naslov);
  font-size: var(--kz-t-md);
  font-style: italic;
  line-height: 1.62;
  color: var(--kz-zelena-najdublja);
}
.kz-tekst blockquote p:last-child { margin-bottom: 0; }
.kz-tekst blockquote cite {
  display: block;
  margin-top: var(--kz-r-3);
  font-family: var(--kz-font-telo);
  font-size: var(--kz-t-sm);
  font-style: normal;
  font-weight: 600;
  color: var(--kz-tekst-blazi);
}

.kz-tekst table {
  font-size: var(--kz-t-sm);
  margin-block: var(--kz-r-6);
}
.kz-tekst :is(th, td) {
  padding: var(--kz-r-3) var(--kz-r-4);
  border-bottom: 1px solid var(--kz-linija-blaga);
  text-align: left;
  vertical-align: top;
}
.kz-tekst th {
  font-weight: 650;
  color: var(--kz-mastilo);
  background: var(--kz-krem-topliji);
}
/* Široke tabele skroluju u svom okviru, stranica nikad vodoravno. */
.kz-tabela-omot { overflow-x: auto; margin-block: var(--kz-r-6); }
.kz-tabela-omot table { margin-block: 0; }

.kz-tekst hr {
  margin-block: var(--kz-r-8);
  background: var(--kz-linija-blaga);
}

/* Prvi pasus malo krupniji, uvlači u tekst. */
.kz-tekst > p:first-of-type {
  font-size: var(--kz-t-md);
  color: var(--kz-tekst);
  line-height: 1.74;
}

/* --- Sadržaj teksta (automatski) ------------------------------------------ */
.kz-sadrzaj {
  margin-bottom: var(--kz-r-7);
  padding: var(--kz-r-5);
  background: var(--kz-krem-topliji);
  border-radius: var(--kz-zaob-md);
  border: 1px solid var(--kz-linija-blaga);
}
.kz-sadrzaj > summary {
  font-family: var(--kz-font-telo);
  font-size: var(--kz-t-xs);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--kz-tekst-blazi);
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--kz-r-3);
}
.kz-sadrzaj > summary::-webkit-details-marker { display: none; }
.kz-sadrzaj > summary::after {
  content: '＋';
  font-size: 1rem;
  color: var(--kz-tekst-tih);
  transition: transform var(--kz-lako);
}
.kz-sadrzaj[open] > summary::after { content: '−'; }
.kz-sadrzaj ol {
  margin: var(--kz-r-4) 0 0;
  padding-left: 1.2em;
  font-size: var(--kz-t-sm);
}
.kz-sadrzaj li { margin-bottom: var(--kz-r-2); }
.kz-sadrzaj a { color: var(--kz-tekst); text-decoration: none; }
.kz-sadrzaj a:hover { color: var(--kz-zelena-duboka); text-decoration: underline; }

/* --- Kraj teksta: povezani sadržaj ---------------------------------------- */
.kz-clanak__podnozje {
  max-width: var(--kz-sirina-tekst);
  margin: var(--kz-r-8) auto 0;
  padding-top: var(--kz-r-6);
  border-top: 1px solid var(--kz-linija-blaga);
}

.kz-oznake { display: flex; flex-wrap: wrap; gap: var(--kz-r-2); }
.kz-oznaka {
  display: inline-block;
  padding: 0.32rem 0.75rem;
  border-radius: var(--kz-zaob-pun);
  background: var(--kz-krem-topliji);
  border: 1px solid var(--kz-linija-blaga);
  font-size: var(--kz-t-xs);
  color: var(--kz-tekst-blazi);
  text-decoration: none;
  transition: background var(--kz-brzo), color var(--kz-brzo);
}
.kz-oznaka:hover {
  background: var(--kz-zelena-najbleda);
  color: var(--kz-zelena-duboka);
  border-color: var(--kz-zelena-bleda);
}

/* Prethodni / sledeći tekst u istoj prostoriji */
.kz-susedi {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--kz-r-4);
  margin-top: var(--kz-r-7);
}
@media (max-width: 40rem) { .kz-susedi { grid-template-columns: 1fr; } }
.kz-sused {
  display: flex;
  flex-direction: column;
  gap: var(--kz-r-2);
  padding: var(--kz-r-5);
  border: 1px solid var(--kz-linija-blaga);
  border-radius: var(--kz-zaob-md);
  text-decoration: none;
  transition: border-color var(--kz-lako), background var(--kz-lako);
}
.kz-sused:hover { border-color: var(--kz-zelena-bleda); background: var(--kz-zelena-najbleda); }
.kz-sused--sledeci { text-align: right; }
.kz-sused__oznaka {
  font-size: var(--kz-t-xs);
  color: var(--kz-tekst-tih);
  font-weight: 500;
}
.kz-sused__naslov {
  font-family: var(--kz-font-naslov);
  font-size: var(--kz-t-baza);
  font-weight: 600;
  color: var(--kz-mastilo);
  line-height: 1.4;
}

/* --- Traka napretka čitanja ----------------------------------------------- */
.kz-napredak {
  position: fixed;
  top: 0; left: 0;
  height: 2px;
  width: 0;
  background: linear-gradient(90deg, var(--kz-zelena), var(--kz-zlatna));
  z-index: 120;
  transition: width 90ms linear;
}

/* --- Arhiva prostorije ---------------------------------------------------- */
.kz-arhiva__zaglavlje {
  background:
    radial-gradient(110% 80% at 85% 10%, var(--kz-zelena-najbleda) 0%, transparent 60%),
    var(--kz-krem-topliji);
  padding-block: var(--kz-r-8);
  border-bottom: 1px solid var(--kz-linija-blaga);
}
.kz-arhiva__naslov { font-size: var(--kz-t-2xl); margin-bottom: var(--kz-r-4); }
.kz-arhiva__opis {
  max-width: var(--kz-sirina-tekst);
  font-size: var(--kz-t-md);
  line-height: var(--kz-visina-citak);
  color: var(--kz-tekst-blazi);
}
.kz-arhiva__broj {
  font-size: var(--kz-t-xs);
  color: var(--kz-tekst-tih);
  margin-top: var(--kz-r-4);
  font-weight: 500;
}

/* Podkategorije kao filter-čipovi */
.kz-police {
  display: flex;
  flex-wrap: wrap;
  gap: var(--kz-r-2);
  margin-bottom: var(--kz-r-7);
}
.kz-polica {
  display: inline-flex;
  align-items: center;
  gap: var(--kz-r-2);
  padding: 0.45rem 0.9rem;
  border-radius: var(--kz-zaob-pun);
  border: 1px solid var(--kz-linija);
  font-size: var(--kz-t-sm);
  font-weight: 500;
  color: var(--kz-tekst);
  text-decoration: none;
  background: var(--kz-bela);
  transition: background var(--kz-brzo), color var(--kz-brzo), border-color var(--kz-brzo);
}
.kz-polica:hover {
  background: var(--kz-zelena-najbleda);
  border-color: var(--kz-zelena-bleda);
  color: var(--kz-zelena-duboka);
}
.kz-polica.je-aktivna {
  background: var(--kz-zelena-duboka);
  border-color: var(--kz-zelena-duboka);
  color: var(--kz-na-primarnoj);
}
.kz-polica__broj {
  font-size: var(--kz-t-xs);
  color: var(--kz-tekst-tih);
}
.kz-polica.je-aktivna .kz-polica__broj { color: color-mix(in srgb, var(--kz-bela) 62%, transparent); }

/* --- Pretraga ------------------------------------------------------------- */
.kz-pretraga { position: relative; }
.kz-pretraga__polje {
  width: 100%;
  padding: 0.85rem 1.1rem 0.85rem 2.8rem;
  border: 1px solid var(--kz-linija);
  border-radius: var(--kz-zaob-pun);
  background: var(--kz-bela);
  font-family: var(--kz-font-telo);
  font-size: var(--kz-t-baza);
  color: var(--kz-tekst);
  transition: border-color var(--kz-brzo), box-shadow var(--kz-brzo);
}
.kz-pretraga__polje::placeholder { color: var(--kz-tekst-tih); }
.kz-pretraga__polje:focus {
  outline: none;
  border-color: var(--kz-zelena-srednja);
  box-shadow: 0 0 0 3px var(--kz-zelena-najbleda);
}
.kz-pretraga__ikona {
  position: absolute;
  left: 1rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--kz-tekst-tih);
  pointer-events: none;
}

/* Panel pretrage u zaglavlju */
.kz-panel-pretrage {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows var(--kz-lako);
  border-top: 1px solid transparent;
}
.kz-panel-pretrage.je-otvoren {
  grid-template-rows: 1fr;
  border-top-color: var(--kz-linija-blaga);
}
.kz-panel-pretrage__unutra { overflow: hidden; }
.kz-panel-pretrage form { padding-block: var(--kz-r-4); }

/* --- Prazno stanje -------------------------------------------------------- */
.kz-prazno {
  text-align: center;
  padding: var(--kz-r-9) var(--kz-r-4);
  max-width: 34rem;
  margin-inline: auto;
}
.kz-prazno__ikona { color: var(--kz-linija); margin: 0 auto var(--kz-r-5); }
.kz-prazno h2 { font-size: var(--kz-t-lg); margin-bottom: var(--kz-r-3); }
.kz-prazno p { color: var(--kz-tekst-blazi); font-size: var(--kz-t-sm); }

/* Automatska veza ka drugom tekstu u kući, vidljiva, ali nenametljiva. */
.kz-tekst .kz-veza-pojma {
  font-weight: 500;
  text-decoration: none;
  background-image: linear-gradient(
    to right,
    color-mix(in srgb, var(--kz-zlatna) 45%, transparent),
    color-mix(in srgb, var(--kz-zlatna) 45%, transparent)
  );
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 100% 2px;
  padding-bottom: 1px;
  transition: background-size var(--kz-lako), color var(--kz-brzo);
}
.kz-tekst .kz-veza-pojma:hover {
  color: var(--kz-zelena-najdublja);
  background-size: 100% 100%;
  background-image: linear-gradient(
    to right,
    var(--kz-zlatna-bleda),
    var(--kz-zlatna-bleda)
  );
}

/* --- „Nastavite kroz kuću“ ------------------------------------------------
   Veze koje je autorka tražila u samom dokumentu, razrešene u prave adrese. */
.kz-dalje {
  margin-bottom: var(--kz-r-6);
  padding: var(--kz-r-5);
  background: var(--kz-zelena-najbleda);
  border-radius: var(--kz-zaob-md);
}
.kz-dalje__naslov {
  font-family: var(--kz-font-telo);
  font-size: var(--kz-t-xs);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--kz-zelena-duboka);
  margin-bottom: var(--kz-r-4);
}
.kz-dalje__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--kz-r-1); }
.kz-dalje__lista li { margin: 0; }
.kz-dalje__lista a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--kz-r-4);
  padding: var(--kz-r-3) var(--kz-r-3) var(--kz-r-3) 0;
  border-bottom: 1px solid color-mix(in srgb, var(--kz-zelena-srednja) 20%, transparent);
  font-family: var(--kz-font-naslov);
  font-size: var(--kz-t-baza);
  font-weight: 600;
  color: var(--kz-zelena-najdublja);
  text-decoration: none;
  transition: padding-left var(--kz-lako), color var(--kz-brzo);
}
.kz-dalje__lista li:last-child a { border-bottom: 0; }
.kz-dalje__lista a:hover { padding-left: var(--kz-r-3); color: var(--kz-terakota); }
.kz-dalje__lista a svg { flex-shrink: 0; opacity: 0.5; transition: opacity var(--kz-brzo), transform var(--kz-lako); }
.kz-dalje__lista a:hover svg { opacity: 1; transform: translateX(3px); }