/* ============================================================
   Zeleni Nar, brend sloj preko Econest teme.
   Minimalne dopune: dimenzije logotipa, sečenje fotografija
   i stil za akordeone. Boje i pozadine ostaju iz teme.
   ============================================================ */

/* Logo dimenzije (PNG iz brenda umesto template SVG-a 165x40) */
.header-section-4 .logo-wrap img { max-height: 54px; width: auto; }
.off-canvas-logo img { max-height: 44px; width: auto; }
.footer-logo img { max-height: 62px; width: auto; }

/* Fotografije u karticama: pun okvir, sečenje po sredini */
.zn-cover { overflow: hidden; }
.zn-cover img { width: 100%; height: 100%; object-fit: cover; }

/* Programi slajder: ujednačena visina fotografija */
.service-card-3 .thumb img { width: 100%; height: 280px; object-fit: cover; }

/* Breadcrumb: prava fotografija desno preko celog polja */
.breadcrumb-thumb { height: 100%; }
.breadcrumb-thumb img { width: 100%; height: 100%; object-fit: cover; }

/* Akordeoni (FAQ, team building programi) u tonu teme */
.accordion-button { font-family: var(--outfit-font); color: var(--title-color); }
.accordion-button:not(.collapsed) { background-color: #f2f7ec; color: var(--title-color); box-shadow: none; }
.accordion-button:focus { box-shadow: none; border-color: #e3ecda; }

/* Završni CTA pojas pred futer */
.zn-cta-pojas { padding: 90px 0; }
.zn-cta-pojas p { max-width: 560px; margin: 0 auto 34px; }
.zn-cta-dugmad { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }

/* ============ Unapređenja (poravnanje, interakcije) ============ */

/* Sve kartice u redu iste visine (bez pretvaranja kolone u flex, to je lomilo sadržaj) */
.services-section .service-card { width: 100%; height: 100%; display: flex; flex-direction: column; }
.services-section .service-card .service-content { flex: 1; }
.service-card-3 { height: 100%; display: flex; flex-direction: column; }
.service-card-3 .content { flex: 1; }
.blog-card-2 { height: 100%; display: flex; flex-direction: column; }
.blog-card-2 .content { flex: 1; display: flex; flex-direction: column; }
.blog-card-2 .content .content-bottom { margin-top: auto; }
.testimonial-card { height: 100%; }
.volunteer-card .thumb img { width: 100%; height: 320px; object-fit: cover; }

/* Blagi lift na hover */
.service-card, .blog-card-2, .volunteer-card, .service-card-3 { transition: transform .25s ease, box-shadow .25s ease; }
.service-card:hover, .blog-card-2:hover, .volunteer-card:hover { transform: translateY(-6px); box-shadow: 0 14px 30px rgba(14, 42, 24, .10); }

/* Klikabilna kartica programa */
.zn-program-kartica { position: relative; }

/* Aktivna stavka u meniju */
.main-menu a.zn-aktivan, .off-canvas-menu a.zn-aktivan { color: var(--theme-color) !important; }

/* Nazad na vrh */
.zn-vrh { position: fixed; right: 22px; bottom: 22px; width: 46px; height: 46px; border: none; border-radius: 50%;
	background: var(--theme-color-3, #004540); color: #fff; font-size: 17px; z-index: 900;
	opacity: 0; visibility: hidden; transform: translateY(8px); transition: all .25s ease; cursor: pointer; }
.zn-vrh.vidljiv { opacity: 1; visibility: visible; transform: none; }
.zn-vrh:hover { background: var(--theme-color); }

/* FAQ pretraga */
.zn-faq-pretraga { border: 1px solid #e3ecda; border-radius: 100px; padding: 12px 22px; width: 100%; margin-bottom: 24px; font-size: 16px; }
.zn-faq-pretraga:focus { outline: none; border-color: var(--theme-color); }

/* Kopiraj dugme */
.zn-kopiraj { border: 1px solid #e3ecda; background: #f2f7ec; border-radius: 100px; padding: 4px 14px; font-size: 14px; cursor: pointer; margin-left: 8px; }
.zn-kopiraj:hover { border-color: var(--theme-color); }

/* Kalkulator donacije */
.zn-kalkulator { background: #f2f7ec; border-radius: 16px; padding: 28px; }
.zn-kalkulator .brzi-iznosi { display: flex; gap: 10px; flex-wrap: wrap; margin: 14px 0; }
.zn-kalkulator .brzi-iznosi button { border: 1px solid #e3ecda; background: #fff; border-radius: 100px; padding: 6px 16px; cursor: pointer; }
.zn-kalkulator .brzi-iznosi button:hover { border-color: var(--theme-color); color: var(--theme-color); }
.zn-kalkulator input[type="number"] { border: 1px solid #e3ecda; border-radius: 12px; padding: 10px 16px; width: 100%; font-size: 18px; }
.zn-kalkulator .rezultat { margin-top: 14px; min-height: 48px; }

/* Traka sa sadnicama na stranici sadnje */
.zn-sadnice-traka { background: #f2f7ec; border-left: 5px solid var(--theme-color); border-radius: 12px; padding: 20px 24px; }

/* ============================================================
   PROLAZ ZA PEGLANJE (QA popis dorada)
   Sve niže su ispravke nađene u punom pregledu svih stranica.
   ============================================================ */

/* --- 1. Kontrast teksta: #868681 je davao 3.66:1, ispod WCAG AA praga 4.5 --- */
:root { --body-color: #68685F; }
.footer-section p, .footer-section .text p, .footer-widget p,
.services-we-offer-section p, .dust-recycling-section p,
.testimonial .review p { color: #C8D6C2; }
.footer-section .footer-logo + p, .footer-section .zn-footer-podaci { color: #C8D6C2; }

/* --- 2. Linkovi u telu strane: podrazumevana Bootstrap plava van palete --- */
main a { color: inherit; }
main p > a, main .service-content a, main li > a:not(.e-primary-btn) {
	color: var(--theme-color-3); text-decoration: underline; text-underline-offset: 3px;
}
main p > a:hover, main .service-content a:hover { color: var(--theme-color); }
.contact-card a, .contact-info-card a { color: inherit; }

/* --- 3. Prelom naslova u karticama: ikona je gurala tekst u kolonu od jedne reči --- */
.service-top, .service-top-2, .contact-card .top, .dust-recycle-top {
	display: flex; align-items: flex-start; justify-content: space-between; gap: 18px;
}
.service-top > h4, .service-top > h3, .service-top > h5,
.service-card h4, .service-card h3, .contact-card h4, .contact-card h3 {
	flex: 1 1 auto; min-width: 0; text-wrap: balance; hyphens: none;
}
.service-top > i, .service-top > .icon, .contact-card .top > i, .service-card > i {
	flex: 0 0 auto;
}
.service-card h4, .service-card h3, .service-card h5 { text-wrap: balance; }
h1, h2, h3, h4, h5 { text-wrap: balance; }

/* --- 4. Mobilni meni: capitalize je pravio „O Nama” i „Postani Član” --- */
.off-canvas-menu ul li a { text-transform: none; }

/* --- 5. Naslov stranice u breadcrumbu je sada h1, zadržava izgled h2 --- */
.breadcrumb-title h1 {
	font-family: var(--outfit-font); font-weight: 600; color: var(--white-color);
	font-size: clamp(34px, 4vw, 60px); line-height: 1.12; margin-bottom: 0;
}
.breadcrumb-nav ul li span[aria-current] { color: var(--white-color); opacity: .85; }

/* --- 6. Dekorativni brojevi kartica: bili h1, sada span bez semantike --- */
.card-number-2 .zn-broj, .card-number-3 .zn-broj, .card-number .zn-broj {
	display: block; font-family: var(--outfit-font); font-weight: 600;
	color: var(--theme-color-3); margin-bottom: 0; user-select: none;
}
.card-number-2 .zn-broj { font-size: clamp(48px, 5vw, 80px); line-height: .95; opacity: .1; }
.card-number-3 .zn-broj { font-size: clamp(64px, 7vw, 120px); line-height: .85; opacity: .06; }
.card-number .zn-broj { font-size: clamp(40px, 4vw, 64px); line-height: 1; }

/* --- 7. Hero: dva dugmeta i napomena umesto pet zvezdica --- */
.zn-hero-dugmad { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 22px; }
.zn-hero-napomena { display: flex; align-items: center; gap: 12px; }
.zn-hero-napomena p { margin: 0; }
.hero-section-4 .thumb img { width: 100%; height: 100%; object-fit: cover; }

/* --- 8. Sekcija obećanja (zamena za izmišljene procente) --- */
.zn-obecanja { display: grid; gap: 22px; margin-top: 30px; }
.zn-obecanje { display: flex; gap: 16px; align-items: flex-start; }
.zn-obecanje i { font-size: 26px; color: var(--theme-color-2); flex: 0 0 auto; margin-top: 4px; }
.zn-obecanje h3 { font-size: 19px; margin-bottom: 6px; color: var(--white-color); }
.zn-obecanje p { margin: 0; font-size: 15px; }
.zn-kartica-naslov { font-size: clamp(24px, 2.4vw, 32px); color: var(--white-color); margin-bottom: 22px; }

/* --- 9. Poziv na saradnju umesto demo logotipa --- */
.zn-partneri-naslov { font-size: clamp(26px, 3vw, 40px); margin: 0; }
.zn-partneri-tekst { max-width: 640px; margin: 0 auto 28px; }

/* --- 10. Oznaka tipa akcije umesto lažne ocene 5.0 --- */
.zn-oznaka {
	display: inline-block; background: #f2f7ec; color: var(--theme-color-3);
	border-radius: 100px; padding: 5px 16px; font-size: 14px; font-weight: 500;
}
/* Ikonice mreža u futeru: pojave se tek kad se linkovi upišu u adminu */
.zn-mreza-ikona {
	display: inline-flex; align-items: center; justify-content: center;
	width: 40px; height: 40px; border-radius: 50%;
	background: rgba(255, 255, 255, .12); color: #fff; font-size: 17px;
	transition: background .2s, transform .2s;
}
.zn-mreza-ikona:hover { background: var(--theme-color); color: #fff; transform: translateY(-2px); }

/* Filter rubrika na strani Vesti: iste pilule, aktivna obojena */
a.zn-oznaka { text-decoration: none; transition: background .2s, color .2s; }
a.zn-oznaka:hover { background: #e3efd7; color: var(--theme-color-3); }
.zn-oznaka-aktivna, a.zn-oznaka-aktivna:hover { background: var(--theme-color-3); color: #fff; }
.testimonial-card .author-details h5 a { text-decoration: none; }
.testimonial-card .author-details h5 a:hover { color: var(--theme-color); }

/* --- 11. Dugme „Saznaj više” je preklapalo gornju ivicu fotografije --- */
.section-top-5 .right .e-primary-btn { margin-top: 18px; }

/* --- 12. Kartice u istom redu poravnate po dnu --- */
.contact-card, .service-card-2 { height: 100%; display: flex; flex-direction: column; }
.contact-card .content, .service-card-2 .content { flex: 1; }

/* --- 13. Sve što je klikabilno dobija kažiprst --- */
a, button, [role="button"], .accordion-button, label, summary,
input[type="submit"], input[type="button"], .swiper-button-next, .swiper-button-prev,
.zn-kopiraj, .zn-vrh, .brzi-iznosi button { cursor: pointer; }

/* --- 14. Vidljiv fokus za tastaturu --- */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
	outline: 3px solid var(--theme-color); outline-offset: 2px; border-radius: 4px;
}

/* --- 15. Poštovanje prefers-reduced-motion --- */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
	[data-aos] { opacity: 1 !important; transform: none !important; }
	html { scroll-behavior: auto; }
}

/* --- 16. Saglasnost za obradu podataka na formama --- */
.zn-saglasnost { display: flex; gap: 10px; align-items: flex-start; margin: 6px 0 18px; font-size: 14px; }
.zn-saglasnost input[type="checkbox"] { margin-top: 4px; width: 18px; height: 18px; flex: 0 0 auto; accent-color: var(--theme-color); }
.zn-saglasnost label { line-height: 1.5; margin: 0; }
.zn-saglasnost a { text-decoration: underline; text-underline-offset: 3px; }
.contact-form-3 .zn-saglasnost, .contact-form-3 .zn-saglasnost label { color: #E4EDE0; }
.contact-form-3 .zn-saglasnost a { color: var(--theme-color-2); }

/* --- 17. Vidljive labele iznad polja (placeholder nestaje kad se kuca) --- */
.zn-polje { margin-bottom: 16px; }
.zn-polje > label { display: block; font-size: 14px; margin-bottom: 6px; color: var(--title-color); }
.contact-form-3 .zn-polje > label { color: #E4EDE0; }

/* --- 18. Telefon u mobilnom zaglavlju i CTA u mobilnom meniju --- */
.zn-mobilni-poziv { display: none; }
@media (max-width: 1199px) {
	.zn-mobilni-poziv {
		display: inline-flex; align-items: center; justify-content: center; gap: 8px;
		width: 46px; height: 46px; border-radius: 50%; background: var(--theme-color-2);
		color: var(--theme-color-3); font-size: 17px; margin-right: 12px;
	}
	.zn-mobilni-poziv:hover { background: var(--theme-color); color: #fff; }
}
.zn-meni-dno { padding: 26px 0 0; border-top: 1px solid #eef2ea; margin-top: 18px; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.zn-meni-dno > .e-primary-btn { display: inline-flex; align-items: center; gap: 10px; width: auto; }
.zn-meni-kontakt { font-size: 15px; color: var(--body-color); }
.zn-meni-kontakt a { display: block; padding: 3px 0; color: var(--theme-color-3); text-decoration: none; }

/* --- 19. IPS QR kod za donacije --- */
.zn-ips { display: flex; gap: 22px; align-items: center; flex-wrap: wrap; margin-top: 22px; }
.zn-ips img, .zn-ips canvas { width: 190px; height: 190px; background: #fff; border: 1px solid #e3ecda; border-radius: 14px; padding: 10px; }
.zn-ips-tekst { flex: 1 1 240px; min-width: 220px; }
.zn-ips-tekst p { margin-bottom: 6px; }

/* --- 20. Praznina na stranici donacija --- */
.zn-donacije-slika { border-radius: 18px; overflow: hidden; margin-top: 26px; }
.zn-donacije-slika img { width: 100%; height: 320px; object-fit: cover; display: block; }

/* --- 21. Naslovi koraka: bili su dva h4, sada jedan naslov sa namernim prelomom --- */
.zn-prelom { display: block; }

/* --- 22. Broj koraka je dekoracija, ne naslov --- */
.work-process-card .card-top .number .zn-broj-korak {
	display: block; font-weight: 600; font-size: 24px; line-height: 36px;
	color: var(--theme-color-2); margin-bottom: 0; user-select: none;
}
@media (max-width: 991px) { .work-process-card .card-top .number .zn-broj-korak { font-size: 20px; } }
.work-process-card:hover .card-top .number .zn-broj-korak { color: var(--body-color); }

/* --- 23. Pravni tekstovi: naslovi odeljaka su h2, ali u veličini pasusa --- */
.zn-pravni-naslov { font-size: 20px; line-height: 1.4; font-weight: 600; color: var(--title-color); }

/* --- 24. Mapa se otvara na klik, najava umesto praznog okvira --- */
.zn-mapa { background: #f2f7ec; }
.zn-mapa-najava { max-width: 640px; margin: 0 auto; padding: 60px 24px; text-align: center; }

/* --- 25. Hero: dugmad su se lomila u kolonu, a bočne ikone su ulazile preko teksta --- */
.hero-section-4 .hero-rating-wrap { flex-wrap: wrap; row-gap: 18px; }
.hero-section-4 .zn-hero-dugmad { flex: 0 1 auto; min-width: min(100%, 300px); margin-bottom: 0; }
.hero-section-4 .zn-hero-napomena { flex: 0 1 auto; min-width: min(100%, 250px); }
@media (max-width: 1599px) { .hero-slider-social { display: none; } }

/* --- 26. PRAVI uzrok preloma naslova: tema tvrdo zadaje usku max-width na naslove kartica
       (118px je krojeno za kratke engleske naslove, srpski se zbog toga lomi na svaku reč) --- */
.service-card .service-top h4,
.service-card-2 .service-top h4,
.work-process-cards .work-process-card .card-content h4,
.major-partners .partners-title h2,
.major-partners .partners-title h3 {
	max-width: none;
	width: auto;
}
.service-card .service-top h4, .service-card-2 .service-top h4 { flex: 1 1 auto; min-width: 0; }

/* --- 27. Staklena kartica je bila skoro providna (bela 4%), pa je svetao tekst
       na svetloj fotografiji padao ispod praga čitljivosti --- */
.dust-recycle-card { background: rgba(0, 69, 64, .78); }
.dust-recycling-section .dust-recycle-top h2.zn-kartica-naslov { max-width: none; width: auto; }
.dust-recycle-top { gap: 30px; flex-wrap: wrap; }
.dust-recycle-top .services-4 { flex: 1 1 320px; }
.zn-obecanje p { color: #DCE8D6; }
.zn-obecanje h3 { color: #fff; }

/* --- 28. Na mobilnom su se hero dugmad razvlačila po visini (flex stretch) --- */
.zn-hero-dugmad { align-items: center; }
.zn-hero-dugmad > .e-primary-btn { flex: 0 0 auto; align-self: center; }
.zn-hero-napomena { align-items: center; }

/* --- 29. Pilula iznad naslova se na mobilnom lomila sa ogromnim proredom --- */
@media (max-width: 767px) {
	.hero-content-4 .subtitle span { line-height: 1.35; }
	.hero-content-4 .subtitle { padding-top: 12px; padding-bottom: 12px; }
}

/* --- 30. ISPRAVKA: `.zn-cover { overflow: hidden }` je sekao kartice brojača,
       koje su namerno postavljene da vire ispod fotografije (bottom: -210px).
       Slika ima sopstveni border-radius, pa sečenje na kontejneru nije potrebno. --- */
.about-us-section-2 .thumb.zn-cover { overflow: visible; }
.about-us-section-2 .thumb.zn-cover > img { border-radius: 12px; }

/* --- 31. Izbor veličine majice (donacija od 2.000 RSD naviše) --- */
.zn-majica-naslov { display: block; font-size: 14px; margin-bottom: 4px; color: var(--title-color); }
.contact-form-3 .zn-majica-naslov { color: #E4EDE0; }
.zn-majica-opis { font-size: 14px; margin-bottom: 12px; }
.contact-form-3 .zn-majica-opis { color: #C8D6C2; }
.zn-velicine { display: flex; gap: 10px; flex-wrap: wrap; }
.zn-velicina { position: relative; margin: 0; }
.zn-velicina input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.zn-velicina span {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 58px; padding: 10px 16px; border-radius: 100px;
	border: 1px solid rgba(255, 255, 255, .35); color: #fff; font-weight: 500; transition: all .2s ease;
}
.zn-velicina input:checked + span { background: var(--theme-color-2); color: var(--theme-color-3); border-color: var(--theme-color-2); }
.zn-velicina input:focus-visible + span { outline: 3px solid var(--theme-color); outline-offset: 2px; }
.zn-velicina:hover span { border-color: var(--theme-color-2); }

/* ============================================================
   MOBILNI DOŽIVLJAJ KAO U APLIKACIJI
   Nizovi kartica se na telefonu ne slažu jedan ispod drugog nego
   klize prstom, sa hvatanjem kartice (scroll-snap) i skrivenom
   trakom za pomeranje. Na desktopu ostaje mreža kao do sada.
   ⚠ overflow-x se postavlja SAMO na ove kontejnere, nikada na html.
   ============================================================ */
@media (max-width: 991px) {
	.zn-svajp {
		display: flex !important;
		flex-wrap: nowrap !important;
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory;
		scroll-padding-left: 20px;
		gap: 14px;
		margin-left: -12px;
		margin-right: -12px;
		padding: 4px 20px 20px;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}
	.zn-svajp::-webkit-scrollbar { display: none; }
	.zn-svajp > [class*="col-"] {
		flex: 0 0 82%;
		max-width: 82%;
		width: 82%;
		scroll-snap-align: start;
		margin-bottom: 0;
	}
	/* kod četiri uske kartice (brojači, uloge) staje više po ekranu */
	.zn-svajp-usko > [class*="col-"] { flex-basis: 64%; max-width: 64%; width: 64%; }
	.zn-svajp > [class*="col-"] > * { height: 100%; }

	/* traka sa nagoveštajem da ima još sadržaja desno */
	.zn-svajp-okvir { position: relative; }
	.zn-svajp-okvir::after {
		content: ""; position: absolute; top: 0; right: 0; bottom: 20px; width: 28px;
		background: linear-gradient(to left, rgba(255,255,255,.92), rgba(255,255,255,0));
		pointer-events: none;
	}
	.zn-svajp-okvir.na-tamnom::after {
		background: linear-gradient(to left, rgba(0,69,64,.92), rgba(0,69,64,0));
	}

	/* brojači preko fotografije: na telefonu klize umesto da se lome u dva reda */
	.about-us-section-2 .thumb .company-achievements-2 {
		position: static; display: flex; flex-wrap: nowrap; overflow-x: auto;
		scroll-snap-type: x mandatory; gap: 12px; padding: 16px 20px 20px;
		margin: -60px 0 0; scrollbar-width: none;
	}
	.about-us-section-2 .thumb .company-achievements-2::-webkit-scrollbar { display: none; }
	.about-us-section-2 .thumb .company-achievements-2 .achievement {
		flex: 0 0 62%; max-width: 62%; scroll-snap-align: start; margin: 0;
	}
	.about-us-section-2 .thumb.zn-cover > img { height: 320px; }

	/* tačkice ispod niza, kao u aplikaciji */
	.zn-tacke { display: flex; gap: 7px; justify-content: center; margin: 2px 0 6px; }
	.zn-tacke span {
		width: 7px; height: 7px; border-radius: 50%; background: #d3ddcd; transition: all .25s ease;
	}
	.zn-tacke span.aktivna { width: 22px; border-radius: 100px; background: var(--theme-color); }
	.zn-tacke.na-tamnom span { background: rgba(255,255,255,.35); }
	.zn-tacke.na-tamnom span.aktivna { background: var(--theme-color-2); }
}
@media (min-width: 992px) { .zn-tacke { display: none; } }

/* ============================================================
   VESTI, BANERI, PARTNERI, DONATORI
   ============================================================ */

/* Vesti: oznake rubrike i datum */
.zn-vest-oznake { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.zn-vest-datum { font-size: 14px; color: var(--body-color); }

/* Istaknuta vest na vrhu liste */
.zn-istaknuta { display: grid; grid-template-columns: 1.1fr 1fr; gap: 34px; align-items: center; margin-bottom: 50px; }
.zn-istaknuta-slika { display: block; border-radius: 16px; overflow: hidden; aspect-ratio: 16 / 9; background: #f2f7ec; }
.zn-istaknuta-slika img { width: 100%; height: 100%; object-fit: cover; }
.zn-istaknuta-tekst h2 { font-size: clamp(24px, 2.6vw, 36px); margin: 14px 0 12px; }
.zn-istaknuta-tekst h2 a { text-decoration: none; }
.zn-istaknuta-tekst h2 a:hover { color: var(--theme-color); }
@media (max-width: 991px) { .zn-istaknuta { grid-template-columns: 1fr; gap: 20px; } }

/* Prazno stanje kada još nema vesti */
.zn-prazno { padding: 70px 20px; background: #f7faf4; border-radius: 18px; }
.zn-prazno i { font-size: 44px; color: var(--theme-color); margin-bottom: 18px; display: block; }
.zn-prazno h2 { font-size: 24px; margin-bottom: 10px; }
.zn-prazno p { max-width: 460px; margin: 0 auto 24px; }

/* Članak */
.zn-clanak-slika { border-radius: 16px; overflow: hidden; margin: 24px 0 28px; }
.zn-clanak-slika img { width: 100%; height: auto; display: block; }
.zn-clanak-uvod { font-size: 19px; line-height: 1.65; color: var(--title-color); margin-bottom: 24px; }
.zn-clanak-telo { font-size: 17px; line-height: 1.8; }
.zn-clanak-telo h2 { font-size: 26px; margin: 34px 0 14px; }
.zn-clanak-telo h3 { font-size: 21px; margin: 28px 0 12px; }
.zn-clanak-telo p { margin-bottom: 18px; }
.zn-clanak-telo ul, .zn-clanak-telo ol { margin: 0 0 20px 22px; }
.zn-clanak-telo li { margin-bottom: 8px; }
.zn-clanak-telo img { max-width: 100%; height: auto; border-radius: 12px; margin: 16px 0; }
.zn-clanak-telo a { color: var(--theme-color-3); text-decoration: underline; text-underline-offset: 3px; }
.zn-clanak-podnozje { margin-top: 40px; padding-top: 26px; border-top: 1px solid #e3ecda; }
.zn-ostale-vesti { margin-top: 70px; }

/* PR tekst mora biti jasno označen kao plaćeni sadržaj */
.zn-pr-najava {
	display: flex; gap: 12px; align-items: flex-start;
	background: #FFF8DE; border-left: 4px solid var(--theme-color-2);
	border-radius: 10px; padding: 14px 18px; margin-bottom: 24px; font-size: 15px;
}
.zn-pr-najava i { font-size: 18px; color: #8a6d00; margin-top: 2px; }

/* Paginacija */
.zn-paginacija { margin-top: 44px; display: flex; justify-content: center; }
.zn-paginacija .pagination { display: flex; gap: 8px; list-style: none; padding: 0; margin: 0; flex-wrap: wrap; }
.zn-paginacija .page-link {
	display: inline-flex; align-items: center; justify-content: center; min-width: 42px; height: 42px;
	padding: 0 12px; border: 1px solid #e3ecda; border-radius: 100px; color: var(--theme-color-3);
	text-decoration: none; background: #fff;
}
.zn-paginacija .page-item.active .page-link { background: var(--theme-color-3); color: #fff; border-color: var(--theme-color-3); }
.zn-paginacija .page-item.disabled .page-link { opacity: .45; }
.zn-paginacija .page-link:hover { border-color: var(--theme-color); }

/* Oglasni prostori */
.zn-baneri { display: grid; gap: 16px; margin: 30px 0; }
.zn-baner { position: relative; text-align: center; background: #f7faf4; border-radius: 14px; padding: 14px; overflow: hidden; }
.zn-baner img { max-width: 100%; height: auto; display: block; margin: 0 auto; border-radius: 8px; }
.zn-baner-oznaka {
	position: absolute; top: 8px; right: 10px; font-size: 11px; letter-spacing: .04em;
	text-transform: uppercase; color: var(--body-color); background: rgba(255,255,255,.85);
	border-radius: 100px; padding: 2px 9px;
}

/* Traka partnera, sa imenom kada logotip još nije stigao */
.zn-traka-partnera .zn-partner { display: flex; align-items: center; justify-content: center; min-height: 78px; }
.zn-partner-ime {
	font-family: var(--outfit-font); font-weight: 600; font-size: 19px; color: #fff;
	white-space: nowrap; padding: 0 10px;
}
.zn-traka-partnera a { text-decoration: none; }
.zn-traka-partnera a:hover .zn-partner-ime { color: var(--theme-color-2); }

/* Donatori */
.zn-donatori-podnaslov { font-size: 21px; margin-bottom: 18px; }
.zn-donatori-napomena { font-size: 15px; margin-bottom: 20px; }
.zn-donator-kartica {
	height: 100%; background: #f7faf4; border: 1px solid #eaf1e4; border-radius: 16px;
	padding: 26px 22px; text-align: center; transition: transform .25s ease, box-shadow .25s ease;
}
.zn-donator-kartica:hover { transform: translateY(-5px); box-shadow: 0 14px 30px rgba(14, 42, 24, .08); }
.zn-donator-logo { height: 60px; margin-bottom: 14px; display: flex; align-items: center; justify-content: center; }
.zn-donator-logo img { max-height: 60px; width: auto; object-fit: contain; }
.zn-donator-inicijal {
	width: 60px; height: 60px; margin: 0 auto 14px; border-radius: 50%;
	background: var(--theme-color-2); color: var(--theme-color-3);
	display: flex; align-items: center; justify-content: center;
	font-family: var(--outfit-font); font-weight: 600; font-size: 26px;
}
.zn-donator-kartica h4 { font-size: 18px; margin-bottom: 6px; }
.zn-donator-kartica h4 a { text-decoration: none; }
.zn-donator-kartica h4 a:hover { color: var(--theme-color); }
.zn-donator-kartica p { font-size: 14px; margin: 0; }
.zn-donatori-imena { display: flex; flex-wrap: wrap; gap: 10px; min-width: 0; }
.zn-donator-ime {
	background: #f2f7ec; border: 1px solid #e3ecda; border-radius: 100px;
	padding: 8px 18px; font-size: 15px; color: var(--theme-color-3);
}

/* Izbor javno ili privatno na formi donatora */
.zn-velicina-siroka span { min-width: auto; }
.m-t-16 { margin-top: 16px; }

/* ============================================================
   ZELENI MONITOR (/uzivo): vreme, vazduh, požari, uslovi za sadnju
   ============================================================ */
.zn-uvod-monitor { max-width: 680px; margin-bottom: 34px; }

.zn-sadnja-danas { border-radius: 20px; padding: 30px 32px; margin-bottom: 34px; border: 1px solid #e3ecda; background: #f7faf4; }
.zn-sadnja-danas.povoljno { background: #EEF7E4; border-color: #cfe4b8; }
.zn-sadnja-danas.umereno { background: #FFF8DE; border-color: #f0e3b0; }
.zn-sadnja-danas.nepovoljno { background: #F6F3EF; border-color: #e6ded4; }
.zn-sadnja-glava { display: flex; gap: 18px; align-items: center; }
.zn-sadnja-glava i { font-size: 38px; color: var(--theme-color); }
.zn-sadnja-glava h2 { font-size: clamp(22px, 2.4vw, 30px); margin-bottom: 4px; }
.zn-sadnja-razlozi { margin: 20px 0 0; padding-left: 20px; }
.zn-sadnja-razlozi li { margin-bottom: 8px; }

.zn-monitor-kartica {
	height: 100%; background: #fff; border: 1px solid #eaf1e4; border-radius: 18px;
	padding: 28px 26px; display: flex; flex-direction: column;
}
.zn-monitor-glava { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.zn-monitor-glava h3 { font-size: 19px; margin: 0; }
.zn-monitor-glava i { font-size: 24px; color: var(--theme-color); flex: 0 0 auto; }
.zn-monitor-broj { font-family: var(--outfit-font); font-weight: 600; font-size: 46px; line-height: 1; color: var(--theme-color-3); }
.zn-monitor-broj span { font-size: 15px; font-weight: 400; color: var(--body-color); margin-left: 8px; }
.zn-monitor-opis { margin: 8px 0 18px; font-size: 16px; }
.zn-monitor-stavke { list-style: none; padding: 0; margin: 0 0 16px; }
.zn-monitor-stavke li { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid #f0f4ec; font-size: 15px; }
.zn-monitor-stavke li:last-child { border-bottom: none; }
.zn-monitor-napomena { font-size: 14px; margin-bottom: 10px; }
.zn-monitor-izvor { font-size: 13px; color: var(--body-color); margin: auto 0 0; padding-top: 12px; }
.zn-monitor-prazno { font-size: 15px; background: #f7faf4; border-radius: 12px; padding: 18px; margin: 0; }

.zn-prognoza { display: flex; gap: 10px; margin-bottom: 16px; }
.zn-prognoza-dan { flex: 1; background: #f7faf4; border-radius: 12px; padding: 12px 8px; text-align: center; }
.zn-prognoza-dan span { display: block; font-size: 13px; color: var(--body-color); text-transform: capitalize; }
.zn-prognoza-dan b { display: block; font-size: 19px; color: var(--theme-color-3); }
.zn-prognoza-dan small { color: var(--body-color); }

.zn-vazduh-odlican, .zn-vazduh-dobar { color: #3f8b2e; }
.zn-vazduh-osrednji { color: #a07d00; }
.zn-vazduh-los, .zn-vazduh-vrlo-los, .zn-vazduh-izuzetno-los { color: #b3261e; }

.zn-pozari-lista { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
.zn-pozar {
	display: inline-flex; align-items: center; gap: 10px; text-decoration: none;
	background: #FDF0EE; border: 1px solid #f3d6d2; border-radius: 100px; padding: 8px 16px; font-size: 14px;
}
.zn-pozar:hover { border-color: #d9534f; }
.zn-pozar-koord { color: var(--title-color); }
.zn-pozar-snaga { color: #b3261e; font-weight: 500; }

/* --- Kažiprst na SVEMU što se klikće, bez izuzetka --- */
a, a *, button, button *, [role="button"], [role="button"] *,
label, label *, summary, select, option,
input[type="submit"], input[type="button"], input[type="reset"],
input[type="checkbox"], input[type="radio"], input[type="file"], input[type="color"], input[type="range"],
.accordion-button, .accordion-button *, .swiper-button-next, .swiper-button-prev,
.swiper-pagination-bullet, .zn-kopiraj, .zn-vrh, .zn-velicina, .zn-velicina *,
.brzi-iznosi button, .header-bar, .header-bar *, .off-canvas-menubar-close, .off-canvas-menubar-close *,
.open-mobile-menu, .open-mobile-menu *, [data-toggle], [data-close], [data-bs-toggle],
.page-link, .zn-pozar, .zn-pozar *, .zn-donator-kartica a, .service-card a, .blog-card-2 a, .volunteer-card a {
	cursor: pointer;
}
/* tekstualna polja zadržavaju kursor za kucanje */
input[type="text"], input[type="email"], input[type="tel"], input[type="url"],
input[type="number"], input[type="search"], input[type="password"], input[type="date"],
input[type="datetime-local"], textarea { cursor: text; }
[disabled], [aria-disabled="true"] { cursor: not-allowed; }

/* --- Kartice uzimaju punu širinu svoje kolone --- */
.zn-monitor-kartica, .zn-donator-kartica { width: 100%; height: 100%; }

/* ============================================================
   NAJČEŠĆA PITANJA, potpuno novi raspored
   Pre: uska bočna kolona i akordeon stisnut u stubac od 250 px.
   Sad: pretraga i teme na vrhu, pitanja u punoj širini, kontakt na dnu.
   ============================================================ */
.zn-faq-vrh { max-width: 780px; margin: 0 auto 44px; text-align: center; }
.zn-faq-naslov { font-size: clamp(28px, 3.4vw, 44px); margin-bottom: 12px; }
.zn-faq-uvod { font-size: 17px; margin-bottom: 28px; }

.zn-faq-polje { position: relative; display: flex; align-items: center; }
.zn-faq-polje > i {
	position: absolute; left: 22px; font-size: 18px; color: var(--theme-color-3); pointer-events: none;
}
.zn-faq-polje input {
	width: 100%; border: 1px solid #dfe8d7; border-radius: 100px;
	padding: 18px 54px 18px 56px; font-size: 17px; background: #fff;
	transition: border-color .2s ease, box-shadow .2s ease;
}
.zn-faq-polje input:focus {
	outline: none; border-color: var(--theme-color);
	box-shadow: 0 0 0 4px rgba(133, 191, 24, .16);
}
.zn-faq-polje input::-webkit-search-cancel-button { display: none; }
.zn-faq-brisi {
	position: absolute; right: 16px; width: 32px; height: 32px; border: none; border-radius: 50%;
	background: #eef3e8; color: var(--theme-color-3); display: flex; align-items: center; justify-content: center;
}
.zn-faq-brisi:hover { background: var(--theme-color-2); }

.zn-faq-grupe { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; margin: 22px 0 6px; }
.zn-faq-grupa {
	display: inline-flex; align-items: center; gap: 9px;
	border: 1px solid #dfe8d7; background: #fff; border-radius: 100px;
	padding: 10px 18px; font-size: 15px; color: var(--title-color);
	transition: all .2s ease;
}
.zn-faq-grupa i { font-size: 15px; color: var(--theme-color-3); }
.zn-faq-grupa .zn-faq-broj {
	font-style: normal; font-size: 12px; background: #eef3e8; color: var(--theme-color-3);
	border-radius: 100px; padding: 2px 8px; min-width: 24px; text-align: center;
}
.zn-faq-grupa:hover { border-color: var(--theme-color); }
.zn-faq-grupa.aktivna { background: var(--theme-color-3); color: #fff; border-color: var(--theme-color-3); }
.zn-faq-grupa.aktivna i { color: var(--theme-color-2); }
.zn-faq-grupa.aktivna .zn-faq-broj { background: rgba(255,255,255,.18); color: #fff; }

.zn-faq-rezultat { font-size: 14px; color: var(--body-color); margin: 14px 0 0; min-height: 21px; }

/* Pitanja: native details, radi i bez JavaScripta */
.zn-faq-lista { max-width: 880px; margin: 0 auto; display: grid; gap: 12px; }
.zn-faq-stavka {
	border: 1px solid #e6ede0; border-radius: 16px; background: #fff; overflow: hidden;
	transition: border-color .2s ease, box-shadow .2s ease;
}
.zn-faq-stavka:hover { border-color: #cfe0bf; }
.zn-faq-stavka[open] { border-color: var(--theme-color); box-shadow: 0 8px 26px rgba(14, 42, 24, .07); }
.zn-faq-stavka summary {
	display: flex; align-items: center; justify-content: space-between; gap: 18px;
	padding: 20px 24px; font-family: var(--outfit-font); font-weight: 600; font-size: 17px;
	color: var(--title-color); list-style: none;
}
.zn-faq-stavka summary::-webkit-details-marker { display: none; }
.zn-faq-stavka summary:focus-visible { outline: 3px solid var(--theme-color); outline-offset: -3px; }
.zn-faq-pitanje { flex: 1; min-width: 0; text-wrap: balance; }
.zn-faq-znak {
	flex: 0 0 auto; width: 32px; height: 32px; border-radius: 50%; background: #eef3e8;
	display: flex; align-items: center; justify-content: center; font-size: 14px;
	color: var(--theme-color-3); transition: transform .25s ease, background .25s ease;
}
.zn-faq-stavka[open] .zn-faq-znak { transform: rotate(45deg); background: var(--theme-color-2); }
.zn-faq-odgovor { padding: 0 24px 22px; }
.zn-faq-odgovor p { margin-bottom: 14px; }
.zn-faq-odgovor p:last-child { margin-bottom: 0; }
.zn-faq-odgovor ul { margin: 0 0 14px 20px; }
.zn-faq-odgovor li { margin-bottom: 7px; }

.zn-faq-prazno { max-width: 520px; margin: 40px auto 0; text-align: center; background: #f7faf4; border-radius: 18px; padding: 44px 26px; }
.zn-faq-prazno i { font-size: 40px; color: var(--theme-color); display: block; margin-bottom: 14px; }
.zn-faq-prazno h3 { font-size: 21px; margin-bottom: 8px; }
.zn-faq-prazno p { margin-bottom: 22px; }

.zn-faq-kontakt {
	max-width: 880px; margin: 60px auto 0; background: var(--theme-color-3); border-radius: 20px;
	padding: 36px 38px; color: #fff; display: grid; grid-template-columns: 1fr 1.4fr; gap: 30px; align-items: center;
}
.zn-faq-kontakt h3 { color: #fff; font-size: 24px; margin-bottom: 8px; }
.zn-faq-kontakt p { color: #C8D6C2; }
.zn-faq-kontakt-veze { display: grid; gap: 12px; }
.zn-faq-veza {
	display: flex; align-items: center; gap: 14px; text-decoration: none;
	background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14);
	border-radius: 12px; padding: 12px 16px; transition: background .2s ease, border-color .2s ease;
}
.zn-faq-veza:hover { background: rgba(255,255,255,.13); border-color: var(--theme-color-2); }
.zn-faq-veza i { font-size: 19px; color: var(--theme-color-2); flex: 0 0 auto; }
.zn-faq-veza span { display: flex; flex-direction: column; }
.zn-faq-veza b { color: #fff; font-weight: 500; }
.zn-faq-veza small { color: #A9BFA2; font-size: 13px; }

@media (max-width: 767px) {
	.zn-faq-kontakt { grid-template-columns: 1fr; padding: 28px 22px; }
	.zn-faq-stavka summary { padding: 17px 18px; font-size: 16px; }
	.zn-faq-odgovor { padding: 0 18px 18px; }
	/* teme klize prstom umesto da se lome u tri reda */
	.zn-svajp-grupe {
		flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start;
		scroll-snap-type: x proximity; margin: 22px -20px 6px; padding: 2px 20px 10px;
		scrollbar-width: none;
	}
	.zn-svajp-grupe::-webkit-scrollbar { display: none; }
	.zn-faq-grupa { flex: 0 0 auto; scroll-snap-align: start; }
}

/* ============================================================
   ZA OGLAŠIVAČE
   ============================================================ */
.zn-oglasi-uvod { max-width: 760px; margin-bottom: 46px; }
.zn-oglasi-uvod h2 { font-size: clamp(26px, 3vw, 40px); margin-bottom: 14px; }
.zn-oglasi-uvod > p { font-size: 17px; margin-bottom: 26px; }
.zn-oglasi-obecanja { display: grid; gap: 12px; }
.zn-oglasi-obecanja > div { display: flex; align-items: center; gap: 12px; font-size: 15px; }
.zn-oglasi-obecanja i { font-size: 18px; color: var(--theme-color); flex: 0 0 auto; }

.zn-oglasi-podnaslov { font-size: 22px; margin-bottom: 22px; }

.zn-oglas-kartica {
	height: 100%; width: 100%; background: #fff; border: 1px solid #e6ede0; border-radius: 18px;
	padding: 26px 24px; display: flex; flex-direction: column;
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.zn-oglas-kartica:hover { transform: translateY(-5px); border-color: var(--theme-color); box-shadow: 0 14px 30px rgba(14, 42, 24, .08); }
.zn-oglas-glava { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 16px; }
.zn-oglas-glava i { font-size: 24px; color: var(--theme-color-3); }
.zn-oglas-format {
	font-size: 12px; letter-spacing: .03em; background: #f2f7ec; color: var(--theme-color-3);
	border-radius: 100px; padding: 4px 12px;
}
.zn-oglas-kartica h4 { font-size: 18px; margin-bottom: 10px; text-wrap: balance; }
.zn-oglas-kartica p { font-size: 15px; flex: 1; margin-bottom: 18px; }
.zn-oglas-cena { border-top: 1px solid #f0f4ec; padding-top: 16px; }
.zn-oglas-cena b { display: block; font-family: var(--outfit-font); font-size: 24px; color: var(--theme-color-3); }
.zn-oglas-cena small { color: var(--body-color); font-size: 13px; }
.zn-oglas-pr { background: #f7faf4; }

.zn-oglasi-pravila { margin-top: 60px; background: #f7faf4; border-left: 4px solid var(--theme-color-2); border-radius: 14px; padding: 30px 32px; }
.zn-oglasi-pravila h3 { font-size: 20px; margin-bottom: 10px; }
.zn-oglasi-pravila ul { margin: 12px 0 0 20px; }
.zn-oglasi-pravila li { margin-bottom: 7px; }

/* ============================================================
   PRIJAVA ZAGAĐENJA
   Forma je pravljena prvo za telefon, pa onda za veći ekran.
   ============================================================ */
.zn-prijava-uvod p { font-size: 17px; max-width: 640px; }

.zn-prijava-oprez {
	display: flex; gap: 14px; align-items: flex-start;
	background: #FFF6E5; border-left: 4px solid #E9A700; border-radius: 12px;
	padding: 16px 20px; margin: 24px 0 34px; font-size: 15px;
}
.zn-prijava-oprez i { font-size: 20px; color: #B98200; flex: 0 0 auto; margin-top: 2px; }
.zn-prijava-oprez a { color: var(--theme-color-3); font-weight: 600; text-decoration: underline; }

.zn-prijava-uspeh {
	display: flex; gap: 16px; align-items: flex-start;
	background: #EEF7E4; border: 1px solid #cfe4b8; border-radius: 16px; padding: 24px 26px; margin-bottom: 30px;
}
.zn-prijava-uspeh i { font-size: 28px; color: var(--theme-color); flex: 0 0 auto; }
.zn-prijava-uspeh h2 { font-size: 20px; margin-bottom: 6px; }

.zn-prijava-greska {
	display: flex; gap: 12px; align-items: center;
	background: #FDEDEC; border: 1px solid #f3c9c5; color: #922B21;
	border-radius: 12px; padding: 14px 18px; margin-bottom: 22px;
}

.zn-korak { border: 1px solid #e6ede0; border-radius: 18px; padding: 26px 26px 22px; margin-bottom: 18px; background: #fff; }
.zn-korak-glava { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.zn-korak-broj {
	width: 32px; height: 32px; flex: 0 0 auto; border-radius: 50%;
	background: var(--theme-color-3); color: #fff;
	display: flex; align-items: center; justify-content: center;
	font-family: var(--outfit-font); font-weight: 600; font-size: 15px;
}
.zn-korak-glava h3 { font-size: 19px; margin: 0; }
.zn-korak-opis { font-size: 15px; margin-bottom: 18px; }

.zn-vrste { display: flex; flex-wrap: wrap; gap: 10px; }
.zn-vrsta { position: relative; margin: 0; }
.zn-vrsta input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; }
.zn-vrsta span {
	display: inline-flex; align-items: center; padding: 11px 18px; border-radius: 100px;
	border: 1px solid #dfe8d7; font-size: 15px; transition: all .2s ease; background: #fff;
}
.zn-vrsta input:checked + span { background: var(--theme-color-3); color: #fff; border-color: var(--theme-color-3); }
.zn-vrsta input:focus-visible + span { outline: 3px solid var(--theme-color); outline-offset: 2px; }
.zn-vrsta:hover span { border-color: var(--theme-color); }

.zn-foto-dugme {
	display: flex; align-items: center; gap: 16px; width: 100%;
	border: 2px dashed #cfe0bf; border-radius: 16px; padding: 22px 24px; background: #f7faf4;
	transition: border-color .2s ease, background .2s ease; margin: 0;
}
.zn-foto-dugme:hover { border-color: var(--theme-color); background: #f2f7ec; }
.zn-foto-dugme i { font-size: 30px; color: var(--theme-color-3); flex: 0 0 auto; }
.zn-foto-dugme span { display: flex; flex-direction: column; }
.zn-foto-dugme small { color: var(--body-color); font-size: 13px; }

.zn-foto-pregled { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 16px; }
.zn-foto-stavka { margin: 0; width: 104px; }
.zn-foto-stavka img { width: 104px; height: 104px; object-fit: cover; border-radius: 12px; display: block; }
.zn-foto-stavka figcaption { font-size: 12px; color: var(--body-color); text-align: center; margin-top: 5px; }

.zn-lokacija-dugme {
	display: inline-flex; align-items: center; gap: 10px;
	border: 1px solid #dfe8d7; background: #fff; border-radius: 100px;
	padding: 12px 20px; font-size: 15px; transition: all .2s ease;
}
.zn-lokacija-dugme:hover { border-color: var(--theme-color); }
.zn-lokacija-dugme.uzeta { background: #EEF7E4; border-color: var(--theme-color); }
.zn-lokacija-dugme i { color: var(--theme-color-3); }
.zn-lokacija-stanje { font-size: 14px; margin: 10px 0 16px; min-height: 20px; }
.zn-lokacija-stanje.uspeh { color: #3f8b2e; }
.zn-lokacija-stanje.greska { color: #b3261e; }
.zn-polje-napomena { display: block; font-size: 13px; color: var(--body-color); margin-top: 5px; }

.zn-prijava-posalji { margin-top: 8px; }

@media (max-width: 767px) {
	.zn-korak { padding: 20px 18px 18px; border-radius: 16px; }
	.zn-vrsta span { width: 100%; justify-content: center; }
	.zn-vrste { display: grid; grid-template-columns: 1fr 1fr; }
	.zn-foto-dugme { padding: 26px 20px; }
	.zn-prijava-posalji { width: 100%; justify-content: center; }
}

/* ============================================================
   PLUTAJUĆA DONJA NAVIGACIJA, SAMO TELEFON I TABLET
   Desktop izgled ostaje netaknut, sve je unutar media upita.
   ============================================================ */
.zn-mobilna-traka { display: none; }

@media (max-width: 991px) {
	.zn-mobilna-traka {
		display: flex; position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 950;
		background: rgba(0, 69, 64, .92);
		backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
		border: 1px solid rgba(255, 255, 255, .1);
		border-radius: 22px; padding: 8px 6px;
		box-shadow: 0 10px 30px rgba(0, 30, 25, .28);
		justify-content: space-around; align-items: center;
		padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px));
	}

	.zn-traka-stavka {
		display: flex; flex-direction: column; align-items: center; gap: 3px;
		flex: 1; padding: 6px 2px; text-decoration: none; color: rgba(255, 255, 255, .72);
		min-width: 0;
	}
	.zn-traka-ikona {
		display: flex; align-items: center; justify-content: center;
		width: 34px; height: 34px; border-radius: 50%; font-size: 16px;
		transition: background .22s ease, color .22s ease, transform .22s ease;
	}
	.zn-traka-naziv {
		font-size: 11px; line-height: 1.2; white-space: nowrap;
		overflow: hidden; text-overflow: ellipsis; max-width: 100%;
	}

	.zn-traka-stavka.aktivna { color: #fff; }
	.zn-traka-stavka.aktivna .zn-traka-ikona { background: var(--theme-color-2); color: var(--theme-color-3); }

	/* Prijava je razlog zbog kog traka postoji, pa je istaknuta */
	.zn-traka-stavka.glavna .zn-traka-ikona {
		background: var(--theme-color); color: #fff; width: 44px; height: 44px;
		font-size: 18px; margin-top: -14px;
		box-shadow: 0 6px 16px rgba(133, 191, 24, .4);
	}
	.zn-traka-stavka.glavna.aktivna .zn-traka-ikona { background: var(--theme-color-2); color: var(--theme-color-3); }
	.zn-traka-stavka:active .zn-traka-ikona { transform: scale(.92); }

	/* Sadržaj ne sme da završi ispod trake */
	body { padding-bottom: 86px; }
	.zn-vrh { bottom: 100px; }

	/* Traka se sklanja dok se kuca u formu, da ne pokriva tastaturu */
	body.zn-kuca .zn-mobilna-traka { transform: translateY(140%); transition: transform .2s ease; }
}

/* Žarišta požara: mesto, udaljenost i snaga umesto golih koordinata */
.zn-pozari-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(210px, 100%), 1fr)); gap: 10px; margin-bottom: 16px; min-width: 0; }
.zn-pozar {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	text-decoration: none; background: #FDF0EE; border: 1px solid #f3d6d2;
	border-radius: 12px; padding: 11px 15px; font-size: 14px; transition: border-color .2s ease;
}
.zn-pozar:hover { border-color: #d9534f; }
.zn-pozar-mesto { display: flex; flex-direction: column; min-width: 0; }
.zn-pozar-mesto b { color: var(--title-color); font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.zn-pozar-mesto small { color: var(--body-color); font-size: 12.5px; }
.zn-pozar-snaga { flex: 0 0 auto; font-weight: 500; color: #8a6d00; background: #FFF6E5; border-radius: 100px; padding: 3px 10px; font-size: 13px; }
.zn-pozar-snaga.srednje { color: #A9500B; background: #FFEEDD; }
.zn-pozar-snaga.jako { color: #fff; background: #C0392B; }

/* Javni pregled prijava zagađenja, bez fotografija i imena */
.zn-prijave-javno { background: var(--zn-podloga, #f7faf4); }
.zn-prijave-brojevi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; max-width: 760px; margin: 0 auto 40px; }
.zn-prijave-broj { background: #fff; border: 1px solid #e6ede0; border-radius: 16px; padding: 22px 18px; text-align: center; }
.zn-prijave-broj b { display: block; font-family: var(--outfit-font); font-size: clamp(28px, 3.5vw, 40px); color: var(--theme-color-3); line-height: 1; }
.zn-prijave-broj span { font-size: 14px; color: var(--body-color); }

.zn-prijave-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr)); gap: 14px; }
.zn-prijava-stavka { background: #fff; border: 1px solid #e6ede0; border-left: 4px solid #cfe0bf; border-radius: 14px; padding: 18px 20px; }
.zn-prijava-stavka.zn-status-prosledjena { border-left-color: var(--theme-color-2); }
.zn-prijava-stavka.zn-status-resena { border-left-color: var(--theme-color); }
.zn-prijava-glava { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
.zn-prijava-status { font-size: 13px; color: var(--body-color); }
.zn-prijava-mesto { font-size: 15px; margin-bottom: 12px; }
.zn-prijava-dno { display: flex; align-items: center; justify-content: space-between; font-size: 13px; color: var(--body-color); }
.zn-prijave-napomena { font-size: 14px; text-align: center; margin-top: 24px; }

@media (max-width: 575px) {
	.zn-prijave-brojevi { grid-template-columns: 1fr; }
}

/* Mapa žarišta, crtamo je sami iz granice Srbije, bez pločica sa tuđih servera */
.zn-pozari-prikaz { display: grid; grid-template-columns: minmax(0, 420px) minmax(0, 1fr); gap: 32px; align-items: start; margin-bottom: 16px; }
.zn-mapa-srbije { background: var(--zn-krem, #FAFBF7); border: 1px solid var(--zn-ivica-meka, #E8EFE1); border-radius: 20px; padding: 12px; }
/* Prava geografska mapa žarišta (Leaflet + OpenStreetMap) */
.zn-mapa-prava { height: 440px; border-radius: 20px; border: 1px solid var(--zn-ivica-meka, #E8EFE1); overflow: hidden; z-index: 0; }
.zn-mapa-prava .leaflet-popup-content { font-size: 14px; line-height: 1.45; }
.zn-mapa-prava .leaflet-popup-content b { display: block; margin-bottom: 2px; }
.zn-pozari-bok { min-width: 0; }
.zn-mapa-grad circle { fill: #9FB396; }
.zn-mapa-grad text { font-size: 11px; fill: #6E7A68; font-family: var(--dm-sans-font), sans-serif; }
.zn-mapa-srbije svg { width: 100%; height: auto; display: block; }
.zn-mapa-obris { fill: #E7F0DF; stroke: #C3D8B4; stroke-width: 1.5; stroke-linejoin: round; }
.zn-mapa-oreol { fill: #E9A700; opacity: .28; }
.zn-mapa-jezgro { fill: #E9A700; }
.zn-mapa-tacka.srednje .zn-mapa-oreol { fill: #E07B39; opacity: .3; }
.zn-mapa-tacka.srednje .zn-mapa-jezgro { fill: #E07B39; }
.zn-mapa-tacka.jako .zn-mapa-oreol { fill: #C0392B; opacity: .32; }
.zn-mapa-tacka.jako .zn-mapa-jezgro { fill: #C0392B; }
.zn-mapa-tacka { cursor: help; }
.zn-mapa-legenda { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; font-size: 12.5px; color: var(--body-color); margin: 0 0 14px; }
.zn-legenda-tacka { width: 10px; height: 10px; border-radius: 50%; background: #E9A700; display: inline-block; }
.zn-legenda-tacka.srednje { background: #E07B39; }
.zn-legenda-tacka.jako { background: #C0392B; }

/* Nivoi peluda */
.zn-pelud-zanemarljiv { color: #3f8b2e; }
.zn-pelud-nizak { color: #3f8b2e; }
.zn-pelud-umeren { color: #a07d00; }
.zn-pelud-visok { color: #b3261e; }
.zn-monitor-stavke b small { font-weight: 400; font-size: 12.5px; color: var(--body-color); }

@media (max-width: 991px) {
	.zn-pozari-prikaz { grid-template-columns: minmax(0, 1fr); gap: 22px; }
	.zn-mapa-srbije { max-width: 330px; margin: 0 auto; width: 100%; }
	.zn-pozar { padding: 10px 13px; }
}

/* Istorija žarišta po danima */
.zn-istorija { background: #fff; border: 1px solid #eaf1e4; border-radius: 18px; padding: 28px 26px; margin-top: 24px; }
.zn-istorija-glava { margin-bottom: 22px; }
.zn-istorija-glava h3 { font-size: 19px; margin-bottom: 6px; }
.zn-istorija-glava p { font-size: 14.5px; }
.zn-grafikon { display: flex; align-items: flex-end; gap: 5px; height: 150px; }
.zn-grafikon-stubac { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; min-width: 0; cursor: help; }
.zn-stubac { width: 100%; max-width: 26px; background: linear-gradient(to top, var(--theme-color-3), var(--theme-color)); border-radius: 5px 5px 0 0; transition: opacity .2s ease; }
.zn-grafikon-stubac:hover .zn-stubac { opacity: .75; }
.zn-grafikon-stubac small { font-size: 10.5px; color: var(--body-color); margin-top: 6px; white-space: nowrap; }
@media (max-width: 767px) {
	.zn-grafikon { height: 110px; gap: 3px; }
	.zn-grafikon-stubac small { display: none; }
}

/* Prijava na obaveštenja o požaru */
.zn-pretplata {
	background: var(--theme-color-3); border-radius: 20px; padding: 28px 30px; margin-top: 24px; color: #fff;
}
.zn-pretplata-glava { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 18px; }
.zn-pretplata-glava > i { font-size: 26px; color: var(--theme-color-2); margin-top: 4px; }
.zn-pretplata h3 { color: #fff; font-size: 20px; margin-bottom: 4px; }
.zn-pretplata p { color: #C8D6C2; font-size: 14px; line-height: 1.5; }
.zn-pretplata-red { display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: 12px; }
.zn-pretplata-red .zn-polje { margin-bottom: 12px; }
.zn-pretplata-dno { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; margin-top: 6px; }
.zn-pretplata-dno .zn-saglasnost { flex: 1 1 320px; margin: 0; }
.zn-pretplata-dugme { flex: 0 0 auto; }
@media (max-width: 767px) {
	.zn-pretplata { padding: 22px 18px; }
	.zn-pretplata-red { grid-template-columns: 1fr; gap: 0; }
	.zn-pretplata-dugme { width: 100%; justify-content: center; }
}
.zn-pretplata .zn-polje > label { color: #E4EDE0; }
.zn-pretplata .form-control {
	width: 100%; border: 1px solid rgba(255,255,255,.2); background: rgba(255,255,255,.08);
	color: #fff; border-radius: 10px; padding: 11px 14px;
}
.zn-pretplata .form-control::placeholder { color: rgba(255,255,255,.45); }
.zn-pretplata select.form-control option { color: var(--title-color); }
.zn-pretplata .zn-lokacija-dugme { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.2); color: #fff; margin-bottom: 4px; }
.zn-pretplata .zn-lokacija-dugme i { color: var(--theme-color-2); }
.zn-pretplata .zn-lokacija-stanje { color: #C8D6C2; }
.zn-pretplata .zn-saglasnost, .zn-pretplata .zn-saglasnost label { color: #E4EDE0; }
.zn-pretplata .zn-saglasnost a { color: var(--theme-color-2); }
@media (max-width: 991px) {
}

/* ============================================================
   NAČINI UKLJUČIVANJA (stranica O nama)
   Ranije: kartice sa plavim linkovima u rasporedu tri plus dva.
   Sada: uredan niz, svaka stavka ima jasnu radnju na kraju.
   ============================================================ */
.zn-nacini-uvod { max-width: 620px; margin: 0 auto; }
.zn-nacini { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }

.zn-nacin {
	display: grid;
	grid-template-columns: auto 1fr;
	grid-template-areas: "ikona telo" "ikona dugme";
	gap: 4px 20px;
	align-items: start;
	background: #fff;
	border: 1px solid var(--zn-ivica-meka, #E8EFE1);
	border-radius: var(--zn-radius, 22px);
	padding: 26px 28px;
	text-decoration: none;
	box-shadow: var(--zn-senka, 0 4px 24px rgba(20, 45, 25, .06));
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.zn-nacin:hover {
	transform: translateY(-4px);
	border-color: #D6E4CB;
	box-shadow: var(--zn-senka-jaka, 0 18px 44px rgba(20, 45, 25, .10));
}

.zn-nacin-ikona {
	grid-area: ikona;
	display: flex; align-items: center; justify-content: center;
	width: 56px; height: 56px; flex: 0 0 auto;
	border-radius: 50%;
	background: var(--zn-krem-2, #F3F7EE);
	border: 1px solid var(--zn-ivica-meka, #E8EFE1);
	color: var(--theme-color-3);
	font-size: 22px;
	transition: background .25s ease, border-color .25s ease;
}
.zn-nacin:hover .zn-nacin-ikona { background: var(--theme-color-2); border-color: var(--theme-color-2); }

.zn-nacin-telo { grid-area: telo; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.zn-nacin-telo b {
	font-family: var(--outfit-font); font-weight: 600; font-size: 18px;
	color: var(--title-color); line-height: 1.3; text-wrap: balance;
}
.zn-nacin-telo span { font-size: 15px; line-height: 1.6; color: var(--body-color); }

.zn-nacin-dugme {
	grid-area: dugme;
	display: inline-flex; align-items: center; gap: 8px;
	margin-top: 12px;
	font-size: 14.5px; font-weight: 500; color: var(--theme-color-3);
}
.zn-nacin-dugme i { transition: transform .25s ease; font-size: 13px; }
.zn-nacin:hover .zn-nacin-dugme { color: var(--theme-color); }
.zn-nacin:hover .zn-nacin-dugme i { transform: translateX(4px); }

@media (max-width: 991px) {
	.zn-nacini { grid-template-columns: 1fr; }
}
@media (max-width: 575px) {
	.zn-nacin { padding: 20px 18px; gap: 4px 16px; }
	.zn-nacin-ikona { width: 48px; height: 48px; font-size: 19px; }
	.zn-nacin-telo b { font-size: 17px; }
}

/* ============================================================
   UPLATA (stranica Donacije)
   Iznos, značenje donacije, podaci računa i QR na jednom mestu.
   ============================================================ */
.zn-uplata {
	display: grid;
	grid-template-columns: 1fr 300px;
	gap: 40px;
	align-items: start;
	background: #fff;
	border: 1px solid var(--zn-ivica-meka, #E8EFE1);
	border-radius: var(--zn-radius-veliki, 32px);
	padding: clamp(26px, 3.2vw, 44px);
	box-shadow: var(--zn-senka, 0 4px 24px rgba(20, 45, 25, .06));
}

.zn-uplata-pitanje { font-family: var(--outfit-font); font-weight: 600; font-size: 18px; color: var(--title-color); margin-bottom: 14px; }
.zn-uplata .brzi-iznosi { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.zn-uplata .brzi-iznosi button {
	border: 1px solid var(--zn-ivica-meka, #E8EFE1); background: #fff; border-radius: 100px;
	padding: 11px 22px; font-size: 16px; font-weight: 500; color: var(--title-color);
	transition: all .2s ease;
}
.zn-uplata .brzi-iznosi button:hover { border-color: var(--theme-color); }
.zn-uplata .brzi-iznosi button.izabran { background: var(--theme-color-3); color: #fff; border-color: var(--theme-color-3); }

.zn-uplata-polje { position: relative; display: flex; align-items: center; margin-bottom: 16px; }
.zn-uplata-polje input {
	width: 100%; border: 1px solid var(--zn-ivica-meka, #E8EFE1); border-radius: 14px;
	padding: 14px 62px 14px 18px; font-size: 17px; background: var(--zn-krem, #FAFBF7);
}
.zn-uplata-polje input:focus { outline: none; border-color: var(--theme-color); background: #fff; }
.zn-uplata-polje span { position: absolute; right: 18px; color: var(--body-color); font-size: 15px; pointer-events: none; }

.zn-uplata .rezultat { min-height: 52px; font-size: 15.5px; line-height: 1.6; color: var(--theme-color-3); margin-bottom: 22px; }
.zn-uplata .rezultat b { color: var(--title-color); }

.zn-uplata-racun { border-top: 1px solid var(--zn-ivica-meka, #E8EFE1); padding-top: 18px; display: grid; gap: 10px; }
.zn-racun-red { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 15px; }
.zn-racun-red > span { color: var(--body-color); min-width: 108px; }
.zn-racun-red > b { color: var(--title-color); font-weight: 500; }

.zn-uplata-desno { text-align: center; }
.zn-qr-okvir {
	background: #fff; border: 1px solid var(--zn-ivica-meka, #E8EFE1);
	border-radius: 20px; padding: 14px; display: inline-block; line-height: 0;
	box-shadow: var(--zn-senka, 0 4px 24px rgba(20, 45, 25, .06));
}
.zn-qr-okvir img { width: 220px; height: 220px; display: block; }
.zn-qr-naslov { font-family: var(--outfit-font); font-weight: 600; font-size: 17px; margin: 16px 0 4px; color: var(--title-color); }
.zn-qr-opis { font-size: 14px; color: var(--body-color); margin: 0; }

/* Uplata iz inostranstva se otvara na klik, retko je potrebna */
.zn-inostranstvo {
	margin-top: 18px; background: #fff; border: 1px solid var(--zn-ivica-meka, #E8EFE1);
	border-radius: var(--zn-radius, 22px); overflow: hidden;
}
.zn-inostranstvo summary {
	display: flex; align-items: center; justify-content: space-between; gap: 16px;
	padding: 20px 26px; font-family: var(--outfit-font); font-weight: 500; font-size: 16.5px;
	color: var(--title-color); list-style: none;
}
.zn-inostranstvo summary::-webkit-details-marker { display: none; }
.zn-inostranstvo summary i:first-child { color: var(--theme-color-3); margin-right: 8px; }
.zn-inostranstvo[open] .zn-faq-znak { transform: rotate(45deg); background: var(--theme-color-2); }
.zn-inostranstvo-telo { padding: 0 26px 24px; display: grid; gap: 10px; }

@media (max-width: 991px) {
	.zn-uplata { grid-template-columns: 1fr; gap: 28px; }
	.zn-uplata-desno { order: -1; }
	.zn-qr-okvir img { width: 190px; height: 190px; }
}
@media (max-width: 575px) {
	.zn-uplata .brzi-iznosi button { flex: 1 1 calc(50% - 5px); }
	.zn-racun-red > span { min-width: 100%; }
}

/* ============================================================
   POČETNA: živa traka i poziv na prijavu zagađenja
   ============================================================ */
.zn-traka-uzivo-sekcija { padding: 18px 0 0; }
.zn-traka-uzivo {
	display: flex; align-items: center; gap: 16px;
	background: var(--theme-color-3); color: #fff;
	border-radius: 100px; padding: 12px 22px; text-decoration: none;
	box-shadow: 0 8px 26px rgba(0, 45, 40, .18);
	overflow: hidden;
}
.zn-uzivo-pulsira {
	width: 9px; height: 9px; border-radius: 50%; background: #7ED957; flex: 0 0 auto;
	animation: znPuls 2s ease-in-out infinite;
}
@keyframes znPuls { 0%,100% { box-shadow: 0 0 0 0 rgba(126,217,87,.5); } 50% { box-shadow: 0 0 0 7px rgba(126,217,87,0); } }
.zn-uzivo-stavke { display: flex; align-items: center; gap: 22px; flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; }
.zn-uzivo-stavka { display: inline-flex; align-items: center; gap: 7px; font-size: 14.5px; color: #DCE8D6; }
.zn-uzivo-stavka i { color: var(--theme-color-2); }
.zn-uzivo-stavka.pazi { color: #FFD9A0; }
.zn-uzivo-stavka.pazi i { color: #FFB84D; }
.zn-uzivo-vise { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: #fff; flex: 0 0 auto; }
.zn-traka-uzivo:hover .zn-uzivo-vise { color: var(--theme-color-2); }
@media (max-width: 991px) {
	.zn-traka-uzivo { border-radius: 20px; flex-wrap: wrap; padding: 14px 18px; }
	.zn-uzivo-stavke { flex-wrap: wrap; white-space: normal; gap: 8px 18px; }
	.zn-uzivo-vise { margin-left: auto; }
}

.zn-prijava-poziv-sekcija { padding: 0 0 var(--zn-sekcija-y, 80px); }
.zn-prijava-poziv {
	display: flex; align-items: center; justify-content: space-between; gap: 26px; flex-wrap: wrap;
	background: linear-gradient(120deg, #FFF6E5, #FDEFD2);
	border: 1px solid #F0E0B8; border-radius: var(--zn-radius-veliki, 32px);
	padding: clamp(24px, 3vw, 40px) clamp(22px, 3.4vw, 46px);
}
.zn-prijava-poziv-tekst { display: flex; align-items: center; gap: 20px; flex: 1 1 480px; min-width: 0; }
.zn-prijava-poziv-ikona {
	width: 64px; height: 64px; flex: 0 0 auto; border-radius: 50%;
	background: var(--theme-color-3); color: var(--theme-color-2);
	display: flex; align-items: center; justify-content: center; font-size: 26px;
}
.zn-prijava-poziv h2 { font-size: clamp(21px, 2.4vw, 30px); margin-bottom: 8px; }
.zn-prijava-poziv p { font-size: 15.5px; max-width: 56ch; }
@media (max-width: 767px) {
	.zn-prijava-poziv-tekst { flex-direction: column; align-items: flex-start; gap: 14px; }
	.zn-prijava-poziv > .e-primary-btn { width: 100%; justify-content: center; }
}

/* Mirno stanje monitora požara: nema aktivnih žarišta */
.zn-pozari-mirno {
	display: flex; gap: 16px; align-items: flex-start;
	background: #EFF7E9; border: 1px solid #D6E8C8; border-radius: 16px;
	padding: 18px 20px; margin: 6px 0 10px;
}
.zn-pozari-mirno > i { font-size: 30px; color: var(--theme-color); margin-top: 2px; }
.zn-pozari-mirno b { display: block; font-size: 17px; color: var(--theme-color-3); margin-bottom: 4px; }
.zn-pozari-mirno p { font-size: 14px; color: #5A6B55; line-height: 1.5; }

/* --- 27. Naslovi koraka: tema zadaje line-height 8-20px na dvoredne naslove, pa se redovi preklapaju --- */
.work-process-cards .work-process-card .card-content h4 { line-height: 1.25 !important; }

/* --- 28. Javna galerija prijava: fotke građana, klik za uvećanje --- */
.zn-galerija-naslov { text-align: center; margin: 34px 0 18px; }
.zn-galerija-naslov h3 { margin-bottom: 6px; }
.zn-galerija-naslov p { font-size: 14px; color: #6b7566; margin: 0; }
.zn-galerija {
	display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: 12px; margin-bottom: 26px;
}
.zn-galerija-stavka {
	position: relative; border: 0; padding: 0; background: none;
	border-radius: 14px; overflow: hidden; aspect-ratio: 4 / 3; display: block;
}
.zn-galerija-stavka img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.zn-galerija-stavka:hover img { transform: scale(1.05); }
.zn-galerija-oznaka {
	position: absolute; left: 8px; bottom: 8px;
	background: rgba(14, 42, 24, .78); color: #fff;
	font-size: 11.5px; padding: 3px 10px; border-radius: 100px;
}
.zn-galerija-prozor {
	border: 0; border-radius: 18px; padding: 0; max-width: min(92vw, 900px);
	background: #10281a; color: #fff;
}
.zn-galerija-prozor::backdrop { background: rgba(10, 25, 15, .82); }
.zn-galerija-prozor img { display: block; max-width: 100%; max-height: 74vh; margin: 0 auto; }
.zn-galerija-podaci { padding: 14px 18px; display: flex; flex-direction: column; gap: 2px; }
.zn-galerija-podaci span { font-size: 13.5px; color: #C8D6C2; }
.zn-galerija-zatvori {
	position: absolute; top: 10px; right: 10px; z-index: 2;
	width: 38px; height: 38px; border-radius: 50%; border: 0;
	background: rgba(255,255,255,.14); color: #fff; font-size: 18px;
}
.zn-galerija-zatvori:hover { background: rgba(255,255,255,.3); }
@media (max-width: 767px) {
	.zn-galerija { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
}