/* Kulturni centar Travno – glavni stil. Boje i fontovi preuzeti sa stare stranice (SPEC.md). */

:root {
	--crvena: #e52428;
	--crvena-tamna: #bf171a;
	--crvena-nad: #c4262a;        /* stara #dd3333 za sitni tekst potamnjena na kontrast 4.5:1 */
	--crvena-tekst: #c41a1e;      /* poveznice u tekstu (gumbi ostaju #e52428) */
	--plava: #0071bc;
	--crna: #000;
	--naslov: #292929;
	--tekst: #616161;          /* stara #7a7a7a podignuta na kontrast 4.5:1 (WCAG AA) */
	--tekst-svijetli: #6b6b6b;
	--pozadina: #f8f9f9;
	--linija: #e6e6e6;
	--bijela: #fff;
	--sjena: 0 10px 30px rgba(0, 0, 0, .12);
	--sjena-mala: 0 4px 14px rgba(0, 0, 0, .08);
	--zaobljeno: 6px;
	--font-tekst: "Roboto", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
	--font-naslov: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--font-ukras: "Poppins", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
	--omot: 1320px;
	--omot-uski: 860px;
	--visina-zaglavlja: 84px;
	--razmak: clamp(48px, 7vw, 96px);
	--velicina-teksta: 1;
}

/* ---------- Osnova ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--visina-zaglavlja) + 16px); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
	margin: 0;
	font: 400 calc(16px * var(--velicina-teksta))/1.7 var(--font-tekst);
	color: var(--tekst);
	background: var(--pozadina);
	overflow-x: hidden;
}
img, svg, video, iframe { max-width: 100%; }
img { height: auto; }
a { color: var(--crvena-tekst); text-underline-offset: .18em; }
a:hover { color: var(--crvena-tamna); }
:focus-visible { outline: 3px solid var(--plava); outline-offset: 2px; }
h1, h2, h3, h4, h5, h6 { font-family: var(--font-naslov); font-weight: 400; color: var(--naslov); line-height: 1.25; margin: 0 0 .6em; }
h1 { font-size: clamp(30px, 4vw, 40px); }
h2 { font-size: clamp(26px, 3vw, 30px); }
h3 { font-size: 22px; }
h4 { font-size: 18px; }
p, ul, ol, figure, table { margin: 0 0 1.2em; }
strong, b { font-weight: 700; color: inherit; }
hr { border: 0; border-top: 1px solid var(--linija); margin: 2.5em 0; }

.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.preskoci {
	position: absolute; left: 16px; top: -100px; z-index: 10001;
	background: var(--crvena); color: #fff; padding: 12px 20px; border-radius: 0 0 6px 6px; font-weight: 500;
}
.preskoci:focus { top: 0; color: #fff; }
main:focus { outline: none; }

.omot { width: min(100% - 32px, var(--omot)); margin-inline: auto; }
.omot-uski { width: min(100% - 32px, var(--omot-uski)); }
.centar { text-align: center; }
.nadnaslov, .wp-block-heading.nadnaslov, p.nadnaslov {
	font-family: var(--font-naslov); font-size: 15px; letter-spacing: .04em; text-transform: uppercase;
	color: var(--crvena-nad); margin: 0 0 .5em;
}

/* ---------- Gumbi ---------- */
.gumb, .wp-block-button__link, .wp-element-button, button.gumb {
	display: inline-flex; align-items: center; justify-content: center; gap: .5em;
	font: 300 16px/1.2 var(--font-ukras); letter-spacing: .05em; text-transform: uppercase;
	background: var(--crvena); color: #fff; border: 2px solid var(--crvena); border-radius: 30px;
	padding: 14px 32px; min-height: 48px; text-decoration: none; cursor: pointer;
	transition: background-color .2s, border-color .2s, transform .2s;
}
.gumb:hover, .wp-block-button__link:hover, .wp-element-button:hover { background: var(--crvena-tamna); border-color: var(--crvena-tamna); color: #fff; }
.gumb:active { transform: translateY(1px); }
.gumb-obrub, .is-style-outline .wp-block-button__link { background: transparent; color: var(--crvena); }
.gumb-obrub:hover, .is-style-outline .wp-block-button__link:hover { background: var(--crvena); color: #fff; }
.gumb-mali { padding: 10px 22px; min-height: 44px; font-size: 15px; text-transform: none; border-radius: 12px; }
.wp-block-buttons { margin: 1.5em 0; gap: 12px; }

/* ---------- Zaglavlje ---------- */
.zaglavlje {
	position: sticky; top: 0; z-index: 1000; background: var(--crna);
	height: var(--visina-zaglavlja);
}
.admin-bar .zaglavlje { top: 32px; }
@media (max-width: 782px) { .admin-bar .zaglavlje { top: 46px; } }
.zaglavlje-omot { display: flex; align-items: center; justify-content: space-between; height: 100%; gap: 24px; }
.logo { display: block; flex: none; line-height: 0; }
.logo-slika { width: auto; height: 46px; }
.glavni-nav { display: flex; }
.izbornik, .izbornik ul { list-style: none; margin: 0; padding: 0; }
.izbornik { display: flex; align-items: center; gap: clamp(8px, 1.6vw, 28px); }
.izbornik > li { position: relative; }
.izbornik a {
	display: block; color: #fff; text-decoration: none;
	font: 500 15px/1.3 var(--font-ukras); text-transform: uppercase; letter-spacing: .02em; white-space: nowrap;
	padding: 10px 2px;
}
.izbornik a:hover, .izbornik .current-menu-item > a, .izbornik .current-menu-ancestor > a, .izbornik a[aria-current] { color: #ff5a5a; } /* na crnom: kontrast > 6:1 */
.izbornik .podizbornik-gumb {
	background: none; border: 0; color: #fff; padding: 6px; margin-left: 2px; cursor: pointer; line-height: 0; vertical-align: middle;
}
.izbornik .podizbornik-gumb svg { width: 10px; height: 10px; transition: transform .2s; }
.izbornik .podizbornik-gumb[aria-expanded="true"] svg { transform: rotate(180deg); }
.izbornik > li.menu-item-has-children { display: flex; align-items: center; }
.izbornik .sub-menu {
	position: absolute; top: 100%; left: -16px; min-width: 260px; padding: 10px 0;
	background: #fff; box-shadow: var(--sjena); border-top: 3px solid var(--crvena); border-radius: 0 0 var(--zaobljeno) var(--zaobljeno);
	opacity: 0; visibility: hidden; transform: translateY(8px); transition: opacity .18s, transform .18s, visibility .18s;
}
.izbornik > li:nth-last-child(-n+2) > .sub-menu { left: auto; right: -16px; }
.izbornik .sub-menu .sub-menu { position: static; box-shadow: none; border: 0; opacity: 1; visibility: visible; transform: none; padding: 0 0 6px 14px; min-width: 0; display: none; }
.izbornik .sub-menu .je-otvoreno > .sub-menu { display: block; }
.izbornik li.je-otvoreno > .sub-menu, .izbornik > li:hover > .sub-menu, .izbornik > li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }
.izbornik .sub-menu a { color: var(--naslov); text-transform: none; font-weight: 400; padding: 8px 20px; white-space: normal; }
.izbornik .sub-menu a:hover, .izbornik .sub-menu .current-menu-item > a, .izbornik .sub-menu a[aria-current] { color: var(--crvena-tekst); background: var(--pozadina); }
.izbornik .sub-menu .podizbornik-gumb { color: var(--naslov); }
.izbornik .sub-menu li { display: flex; flex-wrap: wrap; align-items: center; }
.izbornik .sub-menu li > a { flex: 1; }
.izbornik .sub-menu li > .sub-menu { flex-basis: 100%; }
.izbornik a[href="#"], .izbornik a[href="https://#"] { cursor: default; }

.izbornik-gumb {
	display: none; align-items: center; gap: 10px; background: none; border: 0; color: #fff; cursor: pointer;
	font: 500 14px var(--font-ukras); text-transform: uppercase; padding: 10px 4px; min-height: 44px;
}
.izbornik-crte { display: grid; gap: 5px; width: 24px; }
.izbornik-crte i { display: block; height: 2px; background: currentColor; transition: transform .2s, opacity .2s; }
.izbornik-gumb[aria-expanded="true"] .izbornik-crte i:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.izbornik-gumb[aria-expanded="true"] .izbornik-crte i:nth-child(2) { opacity: 0; }
.izbornik-gumb[aria-expanded="true"] .izbornik-crte i:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 1100px) {
	.izbornik-gumb { display: inline-flex; }
	.glavni-nav {
		position: fixed; inset: var(--visina-zaglavlja) 0 0 0; background: var(--crna); overflow-y: auto;
		padding: 16px 16px 48px; display: none;
	}
	.admin-bar .glavni-nav { top: calc(var(--visina-zaglavlja) + 46px); }
	.glavni-nav.je-otvoreno { display: block; }
	.izbornik { flex-direction: column; align-items: stretch; gap: 0; }
	.izbornik > li { border-bottom: 1px solid #222; flex-wrap: wrap; }
	.izbornik > li > a { flex: 1; padding: 14px 4px; font-size: 16px; }
	.izbornik .podizbornik-gumb { padding: 14px; }
	.izbornik .sub-menu, .izbornik > li:hover > .sub-menu, .izbornik > li:focus-within > .sub-menu {
		position: static; opacity: 1; visibility: visible; transform: none; display: none; flex-basis: 100%;
		background: #111; box-shadow: none; border: 0; border-radius: 0; min-width: 0; padding: 4px 0 10px;
	}
	.izbornik li.je-otvoreno > .sub-menu { display: block; }
	.izbornik .sub-menu a { color: #ddd; padding: 10px 16px; }
	.izbornik .sub-menu a:hover { background: #1a1a1a; color: #fff; }
	.izbornik .sub-menu .podizbornik-gumb { color: #ddd; }
	body.izbornik-otvoren { overflow: hidden; }
}

/* ---------- Hero ---------- */
.hero {
	position: relative; isolation: isolate; overflow: hidden; background: #111;
	min-height: clamp(380px, 52vw, 640px); display: flex; align-items: center;
	padding: 40px 0 clamp(110px, 14vw, 200px);
}
.hero-slike, .hero-slike img, .hero-zatamni { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-slike { z-index: -2; }
.hero-slike img { object-fit: cover; opacity: 0; transition: opacity 1.4s ease-in-out; will-change: opacity; backface-visibility: hidden; }
.hero-slike img.je-aktivna { opacity: 1; }
.hero-zatamni { z-index: -1; background: linear-gradient(90deg, rgba(0, 0, 0, .55) 0%, rgba(0, 0, 0, .25) 55%, rgba(0, 0, 0, .1) 100%); }
.hero-tekst { position: relative; color: #fff; }
.hero-naslov { margin: 0; color: #fff; font-family: var(--font-ukras); font-weight: 200; font-size: clamp(34px, 4.6vw, 56px); line-height: 1.15; text-shadow: 0 2px 18px rgba(0, 0, 0, .35); }
.hero-naslov .hero-nad { display: block; }
.hero-naslov strong { display: block; font-family: var(--font-naslov); font-weight: 700; font-size: .92em; }
.hero-pod { font: 300 clamp(16px, 1.6vw, 20px)/1.5 var(--font-ukras); max-width: 560px; margin: 18px 0 0; text-shadow: 0 1px 10px rgba(0, 0, 0, .4); }
.naslovnica-hero .hero-tekst, .home .hero-tekst { display: flex; flex-direction: column; align-items: flex-start; text-align: left; }
.home .hero-tekst > * { width: min(100%, 560px); }
.hero-val { position: absolute; left: 0; right: 0; bottom: -1px; width: 100%; height: clamp(90px, 13vw, 200px); z-index: 1; }
.hero-val .val { fill: var(--pozadina); }
.hero-val .val-sjena { fill: #e4e4e4; }
.hero-pauza {
	position: absolute; right: 16px; bottom: clamp(100px, 13vw, 190px); z-index: 2;
	width: 40px; height: 40px; border-radius: 50%; border: 0; background: rgba(0, 0, 0, .55); color: #fff; cursor: pointer;
	display: grid; place-items: center;
}
.hero-pauza svg { width: 14px; height: 14px; }

/* Kockice (motiv) */
.kockice { position: absolute; pointer-events: none; z-index: 2; }
.kockice i { position: absolute; display: block; }
.kockice .k1 { width: 26px; height: 26px; background: var(--crvena); transform: rotate(45deg); }
.kockice .k2 { width: 72px; height: 72px; background: var(--plava); transform: rotate(-9deg); }
.kockice .k3 { width: 22px; height: 22px; background: var(--crvena); transform: rotate(-10deg); }
.kockice-hero { left: clamp(8px, 3vw, 60px); bottom: clamp(18px, 4vw, 60px); width: 120px; height: 120px; }
.kockice-hero .k1 { left: 14px; top: 0; }
.kockice-hero .k2 { left: 44px; top: 22px; }
.kockice-hero .k3 { left: 2px; top: 96px; }
@media (max-width: 600px) { .kockice-hero { transform: scale(.6); transform-origin: left bottom; } }

/* ---------- Sadržaj stranica ---------- */
.stranica { padding: 0 0 var(--razmak); }
.sadrzaj > *:first-child { margin-top: 0; }
.klasicni-sadrzaj { padding-top: 24px; }
.ima-blokove .sadrzaj > * { width: min(100% - 32px, var(--omot)); margin-inline: auto; }
.ima-blokove .sadrzaj > .alignfull { width: 100%; }
.ima-blokove .sadrzaj > .is-layout-constrained:not(.alignfull):not(.alignwide),
.ima-blokove .sadrzaj > p, .ima-blokove .sadrzaj > ul, .ima-blokove .sadrzaj > ol, .ima-blokove .sadrzaj > h2, .ima-blokove .sadrzaj > h3, .ima-blokove .sadrzaj > h4 { max-width: var(--omot-uski); }
.sadrzaj .wp-block-group.sekcija, .sadrzaj .sekcija { padding-block: clamp(20px, 3vw, 40px); }
.sadrzaj .sekcija + .sekcija { padding-top: 0; }
.sadrzaj .wp-block-separator { border: 0; border-top: 1px solid #cfcfcf; margin: clamp(24px, 4vw, 48px) auto; opacity: 1; }
.sadrzaj .wp-block-columns { gap: clamp(24px, 4vw, 64px); margin-block: clamp(24px, 4vw, 48px); }
.sadrzaj ul li::marker { color: var(--crvena); }
.sadrzaj blockquote, .wp-block-quote { border-left: 4px solid var(--crvena); margin: 1.5em 0; padding: .4em 0 .4em 1.2em; font-style: italic; color: var(--naslov); }
.sadrzaj figure img, .sadrzaj .wp-block-image img { border-radius: 2px; }
.sadrzaj .wp-block-image figcaption, .wp-caption-text { font-size: 14px; color: var(--tekst-svijetli); margin-top: .5em; }
.sadrzaj table { width: 100%; border-collapse: collapse; font-size: 15px; }
.sadrzaj th, .sadrzaj td { border: 1px solid var(--linija); padding: 10px 12px; text-align: left; vertical-align: top; }
.sadrzaj th { background: #fff; color: var(--naslov); }
.sadrzaj .wp-block-table { overflow-x: auto; }
.sadrzaj iframe { border: 0; }
.sadrzaj .wp-block-embed__wrapper iframe, .sadrzaj iframe[src*="youtube"] { aspect-ratio: 16 / 9; width: 100%; height: auto; }
.sadrzaj .wp-block-file { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 14px 18px; background: #fff; border-left: 4px solid var(--crvena); box-shadow: var(--sjena-mala); }
.sadrzaj .wp-block-file a:not(.wp-block-file__button) { font-weight: 500; }
.sadrzaj .wp-block-file__button { font-size: 14px; padding: 8px 18px; border-radius: 30px; background: var(--crvena); color: #fff; text-decoration: none; }
.alignleft { float: left; margin: .3em 1.5em 1em 0; }
.alignright { float: right; margin: .3em 0 1em 1.5em; }
.aligncenter { display: block; margin-inline: auto; }
.sadrzaj::after { content: ""; display: table; clear: both; }
@media (max-width: 600px) { .alignleft, .alignright { float: none; margin: 0 0 1em; } }

/* Kartica (stil bloka) */
.is-style-kartica { background: #fff; box-shadow: var(--sjena); padding: clamp(24px, 3.5vw, 44px); border-radius: var(--zaobljeno); }
.wp-block-image.is-style-kartica { padding: 0; overflow: hidden; }
.wp-block-image.is-style-kartica img { width: 100%; display: block; }
.is-style-crveni-okvir { background: #ce2323; color: #fff; padding: clamp(20px, 3vw, 32px); border-radius: var(--zaobljeno); }
.is-style-crveni-okvir :is(h2, h3, h4, p, a) { color: #fff; }
.sadrzaj .crta-gore { border-top: 1px solid #5a5a5a; padding-top: clamp(32px, 5vw, 64px); }

/* Galerije */
.wp-block-gallery.has-nested-images figure.wp-block-image img { border-radius: 2px; transition: transform .3s; }
.wp-block-gallery.has-nested-images figure.wp-block-image a:hover img { transform: scale(1.03); }
.gallery { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); margin: 1.5em 0; }
.gallery .gallery-item { margin: 0; }
.gallery img { width: 100%; height: 100%; aspect-ratio: 1; object-fit: cover; }

/* ---------- Mreže i kartice ---------- */
.mreza { display: grid; gap: 28px; margin: 0 0 2em; }
.mreza-4 { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.mreza-3 { grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); }
.kartica {
	position: relative; display: flex; flex-direction: column; background: #fff; box-shadow: var(--sjena-mala);
	border-radius: var(--zaobljeno); overflow: hidden; transition: box-shadow .25s, transform .25s;
}
.kartica:hover { box-shadow: var(--sjena); transform: translateY(-3px); }
@media (prefers-reduced-motion: reduce) { .kartica:hover { transform: none; } }
.kartica-slika { position: relative; display: block; aspect-ratio: 3 / 2; background: var(--linija); overflow: hidden; }
.kartica-slika img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s; }
.kartica:hover .kartica-slika img { transform: scale(1.04); }
.kartica-bez-slike { position: absolute; inset: 0; display: grid; place-items: center; background: var(--pozadina); }
.kartica-bez-slike .kockice { position: relative; width: 90px; height: 90px; }
.kartica-bez-slike .k1 { left: 0; top: 0; } .kartica-bez-slike .k2 { left: 20px; top: 14px; } .kartica-bez-slike .k3 { left: 70px; top: 64px; }
.kartica-tijelo { display: flex; flex-direction: column; flex: 1; padding: 22px 24px 26px; }
.kartica-naslov { font-family: var(--font-naslov); font-size: 18px; line-height: 1.35; margin: 0 0 10px; color: var(--naslov); }
.kartica-naslov a { color: inherit; text-decoration: none; }
.kartica-naslov a::after { content: ""; position: absolute; inset: 0; }
.kartica-naslov a:hover { color: var(--crvena); }
.kartica:focus-within { outline: 3px solid var(--plava); outline-offset: 2px; }
.kartica-naslov a:focus-visible { outline: none; }
.kartica-izvadak { font-size: 14px; line-height: 1.6; margin: 0 0 14px; }
.kartica-vise { margin-top: auto; position: relative; z-index: 1; font: 500 13px var(--font-ukras); text-transform: uppercase; color: var(--crvena-tekst); text-decoration: none; }
.dog-znacka {
	position: absolute; top: 14px; left: 14px; display: grid; place-items: center; min-width: 46px; padding: 6px 6px 5px;
	background: #fff; color: var(--naslov); border-radius: 4px; box-shadow: var(--sjena-mala); line-height: 1.1; text-align: center;
}
.dog-znacka b { font: 500 16px var(--font-naslov); }
.dog-znacka small { font: 500 10px var(--font-ukras); letter-spacing: .05em; }
.dog-vrijeme { font-size: 13px; color: var(--tekst-svijetli); margin: 0 0 6px; }
.kartica-dog .kartica-naslov { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.dog-otkazano { color: #c00; font-weight: 700; font-size: .8em; letter-spacing: .04em; }
.nema-sadrzaja { text-align: center; padding: 32px 0; }

/* ---------- Događanja: arhiva ---------- */
.dogadjanja-arhiva { padding: 8px 0 var(--razmak); }
.dog-filter { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 24px; }
.dog-filter a {
	font: 400 14px var(--font-ukras); text-decoration: none; color: var(--naslov); background: #fff; border: 1px solid var(--linija);
	padding: 8px 16px; border-radius: 30px; min-height: 40px; display: inline-flex; align-items: center;
}
.dog-filter a:hover, .dog-filter a[aria-current] { background: var(--crvena); border-color: var(--crvena); color: #fff; }
.dog-mjesec { color: var(--crvena-tekst); font-weight: 700; text-transform: uppercase; font-size: clamp(22px, 2.4vw, 28px); margin: 40px 0 8px; padding-bottom: 8px; border-bottom: 2px solid var(--crvena); }
.dog-redovi { list-style: none; margin: 0; padding: 0; background: #fff; box-shadow: var(--sjena-mala); border-radius: var(--zaobljeno); overflow: hidden; }
.dog-red { position: relative; display: flex; gap: 24px; align-items: flex-start; padding: 20px clamp(16px, 3vw, 40px); border-bottom: 1px solid #e5e5e5; transition: background-color .2s; }
.dog-red:last-child { border-bottom: 0; }
.dog-red:hover { background: #fff5f5; }
.dog-red-datum { min-width: 110px; margin: 0; font-weight: 600; color: #111; line-height: 1.2; }
.dog-red-datum .dan { display: block; font-size: 20px; }
.dog-red-datum .mjesec { font-size: 14px; color: #6b6b6b; font-weight: 400; }
.dog-red-tekst { flex: 1; }
.dog-red-naslov { font-family: var(--font-naslov); font-size: 18px; font-weight: 600; margin: 0; }
.dog-red-naslov a { color: #000; text-decoration: none; }
.dog-red-naslov a::after { content: ""; position: absolute; inset: 0; }
.dog-red:hover .dog-red-naslov a, .dog-red:hover .dan { color: var(--crvena-tekst); }
.dog-red:focus-within { outline: 3px solid var(--plava); outline-offset: -3px; }
.dog-red-naslov a:focus-visible { outline: none; }
.dog-red-meta { font-size: 14px; color: #666; margin: 4px 0 0; }
.dog-red.je-proslo { background: #fbfbfb; }
.dog-red.je-proslo .dog-red-naslov a, .dog-red.je-proslo .dan { color: #5c5c5c; }
.dog-red.je-proslo .dog-red-meta, .dog-red.je-proslo .mjesec { color: #6b6b6b; }
@media (max-width: 600px) { .dog-red { flex-direction: column; gap: 4px; } }

/* ---------- Događanje i objava ---------- */
.objava, .dogadjanje { padding: 16px 0 var(--razmak); }
.objava-naslov { font-size: clamp(28px, 3.4vw, 38px); margin-bottom: .4em; }
.objava-datum { font-size: 14px; color: var(--tekst-svijetli); }
.objava-slika { margin: 0 0 32px; }
.objava-slika img { width: 100%; border-radius: var(--zaobljeno); box-shadow: var(--sjena); }
.dog-zaglavlje { margin-bottom: 32px; }
.dog-podaci { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 10px 28px; color: var(--naslov); font-size: 16px; }
.dog-podaci li { display: inline-flex; align-items: center; gap: 8px; }
.dog-podaci .ikona { width: 18px; height: 18px; color: var(--crvena); }
.dog-napomena { display: inline-block; margin-top: 14px; background: #fff; border-left: 4px solid var(--plava); padding: 8px 14px; font-size: 14px; }
.dog-raspored { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; align-items: start; }
.dog-raspored.bez-slike { grid-template-columns: minmax(0, var(--omot-uski)); }
.dog-slika { margin: 0; position: sticky; top: calc(var(--visina-zaglavlja) + 24px); border-radius: 10px; overflow: hidden; box-shadow: 0 12px 30px rgba(0, 0, 0, .18); background: #fff; }
.dog-slika img { display: block; width: 100%; height: auto; }
@media (max-width: 900px) { .dog-raspored { grid-template-columns: 1fr; } .dog-slika { position: static; order: -1; } }
.objava-nazad { margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--linija); }
.objava-nazad a { font: 500 14px var(--font-ukras); text-transform: uppercase; text-decoration: none; }

/* ---------- Paginacija ---------- */
.paginacija { margin: 48px 0 0; }
.paginacija ul { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; padding: 0; margin: 0; }
.paginacija li > .page-numbers { display: inline-grid; place-items: center; min-width: 44px; height: 44px; padding: 0 12px; border: 1px solid #ddd; border-radius: 4px; background: #fff; color: #333; text-decoration: none; font-weight: 500; }
.paginacija li > a.page-numbers:hover { border-color: var(--crvena); color: var(--crvena); }
.paginacija li > .page-numbers.current { background: var(--crvena); border-color: var(--crvena); color: #fff; }

/* ---------- Obrasci ---------- */
.obrazac-omot { background: #fff; box-shadow: var(--sjena); border-radius: 4px; padding: clamp(24px, 4vw, 44px); max-width: 640px; margin: 0 auto 2em; }
.obrazac { display: grid; gap: 18px; }
.obrazac label, .obrazac legend { font: 500 15px/1.4 var(--font-ukras); color: #000; }
.obrazac legend { padding: 0; margin-bottom: 8px; }
.obrazac fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.polje-grupa { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; }
.polje-grupa > legend { grid-column: 1 / -1; }
.polje-grupa .polje { margin: 0; }
.polje-grupa .polje label { font-weight: 400; font-size: 14px; color: #444; }
@media (max-width: 520px) { .polje-grupa { grid-template-columns: 1fr; } }
.obrazac input[type=text], .obrazac input[type=email], .obrazac select, .obrazac textarea, .trazilica input[type=search] {
	display: block; width: 100%; margin-top: 6px; font: 400 16px/1.4 var(--font-tekst); color: #111;
	background: #fff; border: 1px solid #8a8a8a; border-radius: 4px; padding: 11px 12px; min-height: 46px;
}
.obrazac textarea { resize: vertical; min-height: 140px; }
.obrazac input:focus, .obrazac select:focus, .obrazac textarea:focus { border-color: var(--plava); outline: 2px solid var(--plava); outline-offset: 0; }
.obrazac [aria-invalid="true"] { border-color: #c00; }
.polje-izbori label, .polje-pristanak label { display: flex; align-items: flex-start; gap: 10px; font-weight: 400; margin: 6px 0; cursor: pointer; font-family: var(--font-tekst); }
.polje-izbori input, .polje-pristanak input { width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--crvena); flex: none; }
.polje-izbori input:checked + * { color: var(--crvena); }
.obavezno { color: var(--crvena); }
.polje-greska { color: #b00000; font-size: 14px; margin: 6px 0 0; font-weight: 500; }
.polje-zbroj input { max-width: 120px; }
.obrazac-napomena { font-size: 13px; margin: 0; color: var(--tekst-svijetli); }
.obrazac-zamka { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.obrazac-poruka { padding: 16px 20px; border-radius: 4px; margin-bottom: 20px; }
.obrazac-poruka.uspjeh { background: #edf7ed; border-left: 4px solid #2e7d32; color: #1b4d1e; }
.obrazac-poruka.greska { background: #fdecec; border-left: 4px solid #c00; color: #6d0000; }
.obrazac-poruka ul { margin: 6px 0 0; }
.obrazac-poruka a { color: inherit; }
[data-uvjet][hidden] { display: none !important; }

.trazilica label { font: 500 15px var(--font-ukras); color: #000; }
.trazilica-red { display: flex; gap: 10px; margin-top: 6px; }
.trazilica-red input { margin: 0 !important; }
.pretraga { padding: 16px 0 var(--razmak); }
.pretraga-rezultati { padding-left: 1.2em; margin-top: 32px; }
.pretraga-rezultati h2 { font-size: 20px; margin: 0 0 4px; }
.stranica-404 { padding: 24px 0 var(--razmak); text-align: center; }
.stranica-404 .trazilica { max-width: 520px; margin: 24px auto; text-align: left; }

/* ---------- Podnožje ---------- */
.podnozje { margin-top: 0; }
.podnozje-traka { background: var(--crvena); padding: 10px 0; }
.mreze { list-style: none; margin: 0; padding: 0; display: flex; justify-content: flex-end; gap: 10px; }
.mreze a { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #fff; color: var(--crvena); transition: transform .2s, background-color .2s; }
.mreze a:hover { background: var(--crna); color: #fff; }
.mreze .ikona { width: 20px; height: 20px; }
.podnozje-glavno {
	background: var(--pozadina) url("../img/silueta.png") no-repeat center bottom / 100% auto;
	padding: 56px 0 72px;
}
.podnozje-mreza { display: grid; grid-template-columns: 120px 1fr 1fr 1fr 1fr; gap: 32px; align-items: start; }
.podnozje-logo img { width: 100px; height: auto; }
.podnozje-naslov { font: 700 15px/1.4 var(--font-naslov); text-transform: uppercase; color: var(--naslov); margin: 0 0 10px; }
.podnozje-naslov-velik { font: 300 26px/1.2 var(--font-naslov); text-transform: none; letter-spacing: .5px; }
.podnozje p { color: var(--naslov); margin: 0 0 12px; font-size: 15px; }
.podnozje-oib { padding-top: 34px; }
.podnozje-izbornik { list-style: none; margin: 0; padding: 0; }
.podnozje-izbornik li { margin-bottom: 8px; }
.podnozje-izbornik a { color: var(--naslov); text-decoration: none; font-size: 15px; }
.podnozje-izbornik a:hover { color: var(--crvena); text-decoration: underline; }
.podnozje-dno { background: var(--pozadina); padding: 0 0 24px; }
.podnozje-dno p { font-size: 14px; color: #666; margin: 0; }
.podnozje-dno a { color: var(--crvena-tekst); text-decoration: underline; }
@media (max-width: 1000px) { .podnozje-mreza { grid-template-columns: repeat(2, 1fr); } .podnozje-logo { grid-column: 1 / -1; } .podnozje-oib { padding-top: 0; } }
@media (max-width: 520px) { .podnozje-mreza { grid-template-columns: 1fr; } .mreze { justify-content: center; } }

.na-vrh {
	position: fixed; right: 18px; bottom: 84px; z-index: 900; width: 44px; height: 44px; display: grid; place-items: center;
	background: var(--crvena); color: #fff; border-radius: 4px; box-shadow: var(--sjena-mala);
	opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s;
}
.na-vrh.je-vidljiv { opacity: 1; visibility: visible; }
.na-vrh:hover { background: var(--crvena-tamna); color: #fff; }
.na-vrh .ikona { width: 18px; height: 18px; }
.ikona { width: 1em; height: 1em; fill: currentColor; flex: none; }

/* ---------- Pristupačnost: alatna traka ---------- */
.pristup { position: fixed; right: 18px; bottom: 18px; z-index: 1001; }
.pristup-gumb { width: 54px; height: 54px; border-radius: 50%; border: 3px solid #fff; background: var(--plava); color: #fff; cursor: pointer; display: grid; place-items: center; box-shadow: var(--sjena); }
.pristup-gumb .ikona { width: 30px; height: 30px; }
.pristup-ploca {
	position: absolute; right: 0; bottom: 66px; width: min(320px, calc(100vw - 36px)); background: #fff; color: #111;
	border-radius: 8px; box-shadow: 0 16px 40px rgba(0, 0, 0, .25); padding: 18px; display: grid; gap: 8px;
}
.pristup-ploca[hidden] { display: none; }
.pristup-ploca h2 { font: 600 18px var(--font-ukras); margin: 0 0 6px; color: #111; }
.pristup-red { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.pristup-red span { flex: 1; font-size: 15px; }
.pristup-red button, .pristup-opcija, .pristup-reset { font: 500 15px var(--font-ukras); border: 2px solid #ccc; background: #fff; color: #111; border-radius: 6px; min-height: 44px; padding: 8px 12px; cursor: pointer; text-align: left; }
.pristup-red button { min-width: 48px; text-align: center; }
.pristup-red output { min-width: 52px; text-align: center; font-weight: 600; }
.pristup-opcija[aria-pressed="true"] { border-color: var(--plava); background: #e6f1fa; }
.pristup-opcija[aria-pressed="true"]::after { content: " ✓"; color: var(--plava); }
.pristup-dno { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin: 6px 0 0; font-size: 14px; }
.pristup-reset { text-align: center; }

html.p-kontrast { --tekst: #000; --tekst-svijetli: #000; --naslov: #000; --pozadina: #fff; --linija: #000; }
html.p-kontrast body { background: #fff; color: #000; }
html.p-kontrast .kartica, html.p-kontrast .dog-redovi, html.p-kontrast .obrazac-omot { box-shadow: none; border: 2px solid #000; }
html.p-kontrast a:not(.gumb):not(.wp-block-button__link) { color: #0000c8; }
html.p-kontrast .hero-zatamni { background: rgba(0, 0, 0, .7); }
html.p-poveznice a:not(.gumb):not(.wp-block-button__link) { text-decoration: underline !important; text-decoration-thickness: 2px !important; }
html.p-poveznice .sadrzaj a, html.p-poveznice .kartica-naslov a { background: #ffff9c; color: #000 !important; }
html.p-font body, html.p-font h1, html.p-font h2, html.p-font h3, html.p-font h4, html.p-font .gumb, html.p-font .izbornik a { font-family: Verdana, Tahoma, Arial, sans-serif !important; letter-spacing: .02em; }
html.p-razmak body { line-height: 2; }
html.p-razmak p, html.p-razmak li { line-height: 2; letter-spacing: .03em; word-spacing: .1em; }
html.p-animacije *, html.p-animacije *::before, html.p-animacije *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
html.p-pokazivac, html.p-pokazivac * { cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 24 24'%3E%3Cpath d='M4 2l16 10-7 1 4 8-3 1-4-8-6 5z' fill='%23000' stroke='%23fff' stroke-width='1.2'/%3E%3C/svg%3E") 4 2, auto !important; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
@media print {
	.zaglavlje, .podnozje, .pristup, .na-vrh, .hero-val, .kockice, .obrazac-omot { display: none !important; }
	.hero { min-height: 0; padding: 0; background: none; } .hero-slike, .hero-zatamni { display: none; } .hero-naslov { color: #000; text-shadow: none; }
}
.hero-naslov.samo-nad .hero-nad { font-weight: 200; }

/* Motivi sekcija sa stare stranice */
.sadrzaj .sekcija-val { position: relative; background: url("../img/sekcija-val.webp") no-repeat center bottom / 100% 100%; padding-bottom: clamp(80px, 10vw, 160px) !important; }
.sadrzaj .sekcija-kockice { position: relative; background: url("../img/kockice-gore.webp") no-repeat right top / min(60%, 760px) auto; }
.sadrzaj .crveni, .sadrzaj h2.crveni, .sadrzaj h3.crveni, .sadrzaj h4.crveni { color: var(--crvena-nad); }
.sadrzaj .sivi { color: #6b6b6b; }
.sadrzaj .ukras img { box-shadow: none; }
.popis-datoteka { list-style: none; padding: 0; }
.popis-datoteka li { padding: 10px 0 10px 32px; border-bottom: 1px solid var(--linija); position: relative; }
.popis-datoteka li::before { content: ""; position: absolute; left: 0; top: 13px; width: 20px; height: 20px; background: var(--crvena); -webkit-mask: url("../img/pdf.svg") center / contain no-repeat; mask: url("../img/pdf.svg") center / contain no-repeat; }
.is-style-kartica .obrazac-omot { box-shadow: none; padding: 0; max-width: none; margin: 0; background: transparent; }

/* =====================================================================
   Moderni raspored stranica (v2) – sekcije, kartice, mreže, motiv kockica
   ===================================================================== */
.stranica { padding-bottom: 0; }
.ima-blokove .sadrzaj > .sekcija { width: 100%; max-width: none; margin: 0; padding: clamp(56px, 7vw, 104px) 0; position: relative; }
.ima-blokove .sadrzaj > .sekcija:first-child { padding-top: clamp(24px, 3vw, 40px); }
.sekcija > .wp-block-group__inner-container,
.sekcija.is-layout-constrained > * { width: min(100% - 32px, var(--omot)); margin-inline: auto; max-width: none; }
.sekcija-tekst > .wp-block-group__inner-container, .sekcija-citanje > .wp-block-group__inner-container,
.sekcija-tekst.is-layout-constrained > *, .sekcija-citanje.is-layout-constrained > * { width: min(100% - 32px, 860px); }
.sekcija-bijela { background: #fff; }
.sadrzaj .sekcija + .sekcija { padding-top: clamp(56px, 7vw, 104px); }
.sadrzaj .sekcija-val, .sadrzaj .sekcija-kockice { background: none; }

/* Naslov sekcije s kockicama */
.naslov-sekcije { font-size: clamp(28px, 3.2vw, 40px); line-height: 1.2; color: var(--naslov); margin: 0 0 24px; }
.naslov-sekcije::before {
	content: ""; display: block; width: 12px; height: 12px; margin: 0 0 22px 4px;
	background: var(--crvena); transform: rotate(45deg); box-shadow: 16px -10px 0 -1px var(--plava);
}
.naslov-sekcije.has-text-align-center::before { margin-inline: auto; transform: translateX(-8px) rotate(45deg); }
p.nadnaslov + .naslov-sekcije::before { display: none; }
p.nadnaslov { position: relative; padding-left: 26px; display: inline-block; }
p.nadnaslov::before { content: ""; position: absolute; left: 2px; top: .45em; width: 9px; height: 9px; background: var(--crvena); transform: rotate(45deg); box-shadow: 11px -6px 0 -1px var(--plava); }
p.nadnaslov.has-text-align-center { display: block; padding-left: 0; }
p.nadnaslov.has-text-align-center::before { position: static; display: block; margin: 0 auto 14px; }

/* Oznaka (uzrast, kategorija) */
.oznaka, p.oznaka {
	display: inline-block; margin: 0 0 14px; padding: 6px 14px; border-radius: 30px;
	background: rgba(229, 36, 40, .08); color: var(--crvena-tekst);
	font: 500 13px/1.3 var(--font-ukras); letter-spacing: .04em; text-transform: uppercase;
}

/* Stupci */
.sadrzaj .wp-block-columns { gap: clamp(28px, 5vw, 80px); margin: 0; }
@media (max-width: 781px) { .sadrzaj .wp-block-columns { flex-wrap: wrap !important; } .sadrzaj .wp-block-column { flex-basis: 100% !important; } }

/* Slika u okviru s kockicama */
.slika-okvir { position: relative; isolation: isolate; margin: 24px 24px 24px 0; }
.slika-okvir figure, .slika-okvir .wp-block-image { margin: 0; }
.slika-okvir img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 10px; box-shadow: 0 20px 50px rgba(0, 0, 0, .18); }
.slika-okvir.kockice-uz::before { content: ""; position: absolute; z-index: 2; left: -14px; top: -14px; width: 30px; height: 30px; background: var(--crvena); transform: rotate(45deg); }
.slika-okvir.kockice-uz::after { content: ""; position: absolute; z-index: -1; right: -24px; bottom: -24px; width: 42%; height: 46%; background: var(--plava); border-radius: 6px; transform: rotate(-4deg); }
.slika-okvir.slika-bez-sjene img { box-shadow: none; aspect-ratio: auto; object-fit: contain; }
.slika-okvir.slika-bez-sjene::after, .slika-okvir.slika-bez-sjene::before { display: none; }

/* Info kartice */
.mreza-kartica, .mreza-kartica > .wp-block-group__inner-container { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 28px; }
.mreza-kartica.mreza-3, .mreza-kartica.mreza-3 > .wp-block-group__inner-container { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.mreza-kartica > .wp-block-group__inner-container { grid-column: 1 / -1; }
.info-kartica { background: #fff; border-radius: 10px; padding: clamp(24px, 3vw, 36px); box-shadow: var(--sjena-mala); border-top: 4px solid var(--crvena); height: 100%; }
.info-kartica:nth-child(even) { border-top-color: var(--plava); }
.sekcija-bijela .info-kartica { background: var(--pozadina); box-shadow: none; }
.info-kartica > :last-child, .info-kartica > .wp-block-group__inner-container > :last-child { margin-bottom: 0; }
.kartica-naslov-kt { font-size: 20px; margin-bottom: 14px; color: var(--naslov); }
.info-kartica p strong { color: var(--naslov); }

/* Galerija */
.sadrzaj .galerija-kt { --wp--style--unstable-gallery-gap: 14px; gap: 14px; }
.sadrzaj .galerija-kt figure.wp-block-image img { border-radius: 8px; aspect-ratio: 4 / 3; object-fit: cover; }
.sadrzaj .galerija-kt figure.wp-block-image { overflow: hidden; border-radius: 8px; }

/* Katalog knjiga */
.mreza-knjiga, .mreza-knjiga > .wp-block-group__inner-container { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 28px; margin-top: 32px; }
.mreza-knjiga > .wp-block-group__inner-container { grid-column: 1 / -1; margin-top: 0; }
.knjiga { background: #fff; border-radius: 10px; padding: 18px 18px 22px; box-shadow: var(--sjena-mala); font-size: 14px; line-height: 1.55; transition: box-shadow .25s, transform .25s; }
.knjiga:hover { box-shadow: var(--sjena); transform: translateY(-3px); }
.knjiga .knjiga-naslovnica { margin: 0 0 16px; background: var(--pozadina); border-radius: 6px; padding: 14px; }
.knjiga .knjiga-naslovnica img { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: contain; }
.knjiga p { margin: 0 0 .5em; }
.knjiga strong { color: var(--naslov); }
.sekcija-katalog.sekcija-bijela { background: #fff; }


/* Arhiva */
.mreza-arhiva, .mreza-arhiva > .wp-block-group__inner-container { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 24px; }
.mreza-arhiva > .wp-block-group__inner-container { grid-column: 1 / -1; }
.arhiva-stavka figure { margin: 0; }
.arhiva-stavka img { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 6px; box-shadow: var(--sjena-mala); transition: transform .25s, box-shadow .25s; }
.arhiva-stavka a:hover img, .arhiva-stavka a:focus-visible img { transform: translateY(-4px); box-shadow: var(--sjena); }

/* Logotipi */
.mreza-logo, .mreza-logo > .wp-block-group__inner-container { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 20px; margin-top: 32px; }
.mreza-logo > .wp-block-group__inner-container { grid-column: 1 / -1; margin-top: 0; }
.mreza-logo-3, .mreza-logo-3 > .wp-block-group__inner-container { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.logo-stavka figure { margin: 0; height: 100%; }
.logo-stavka a, .logo-stavka figure > img { display: grid; place-items: center; height: 100%; min-height: 150px; padding: 24px; background: #fff; border: 1px solid var(--linija); border-radius: 10px; transition: box-shadow .25s, border-color .25s; }
.sekcija-bijela .logo-stavka a { background: var(--pozadina); border-color: transparent; }
.logo-stavka a:hover { box-shadow: var(--sjena-mala); border-color: #d5d5d5; }
.logo-stavka img { max-height: 120px; width: auto; max-width: 100%; object-fit: contain; }

/* Obrasci u sekcijama */
.obrazac-blok .obrazac-omot { max-width: 680px; margin: 0 auto; }
.sekcija-obrazac .naslov-sekcije { max-width: 760px; margin-inline: auto; }

/* Naslovnica: prijava na mjesečni program (bijela sekcija) */
.sekcija-novosti { background: #fff !important; overflow: hidden; }
.sekcija-novosti .obrazac-omot { background: var(--pozadina); box-shadow: none; border: 1px solid var(--linija); }
.sekcija-dogadjanja .mreza-dogadjanja { margin-top: 40px; }

/* Kontakt i karta */
.kontakt-podaci { height: auto; }
.sekcija-karta { padding-top: 0 !important; }
.karta iframe { display: block; width: 100%; height: clamp(320px, 40vw, 480px); border: 0; border-radius: 12px; box-shadow: var(--sjena-mala); }

/* Istaknuta obavijest (npr. upisi) */
.obavijest-traka { background: #fff; border-left: 5px solid var(--crvena); border-radius: 8px; padding: 20px 26px; box-shadow: var(--sjena-mala); font-size: 17px; color: var(--naslov); }
.obavijest-traka p:last-child { margin: 0; }

/* Radionice */
.naslov-grupe { margin-top: 56px; }
.naslov-grupe:first-child { margin-top: 0; }
.mreza-radionice { margin-top: 8px; }
.kartica-radionica .oznaka { font-size: 11px; padding: 4px 10px; margin-bottom: 10px; }
.sekcija-ostale .mreza-radionice { margin-top: 32px; }

/* Čitanje dugih tekstova */
.sekcija-citanje h2 { font-size: clamp(24px, 2.4vw, 30px); margin-top: 1.6em; }
.sekcija-citanje h2:first-child { margin-top: 0; }
.sekcija-citanje { font-size: 17px; }
.popis-ciste { padding-left: 1.2em; }

/* Popis datoteka */
.popis-datoteka a { font-weight: 500; text-decoration: none; }
.popis-datoteka a:hover { text-decoration: underline; }
.mreza-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) { .mreza-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .mreza-4 { grid-template-columns: 1fr; } }
.mreza-radionice { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.sadrzaj .galerija-kt.columns-1 { max-width: 760px; margin-inline: auto; }
.sadrzaj .galerija-kt.columns-2 { max-width: 1040px; margin-inline: auto; }
.arhiva-stavka img { aspect-ratio: 210 / 297; object-fit: contain; background: #fff; }
@media (max-width: 781px) {
	.slika-okvir { margin: 18px 12px 26px 0; }
	.slika-okvir.kockice-uz::before { width: 22px; height: 22px; left: -8px; top: -8px; }
	.slika-okvir.kockice-uz::after { right: -12px; bottom: -14px; }
}
.paginacija br { display: none; }

.paginacija ul.page-numbers { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; list-style: none; margin: 0; padding: 0; border: 0; background: none; min-width: 0; height: auto; }
.paginacija li { margin: 0; }
.paginacija li > .page-numbers.dots { border: 0; background: none; }
.slika-okvir.slika-bez-sjene img { background: transparent; border-radius: 0; }

/* Ukras uz naslove: dvije crvene i plava kockica (motiv Kulturnog centra) */
.naslov-sekcije::before {
	width: 72px; height: 44px; margin: 0 0 18px -2px; transform: none; box-shadow: none;
	background: url("../img/kockice-ukras.svg") no-repeat left center / contain;
}
.naslov-sekcije.has-text-align-center::before { margin-inline: auto; transform: none; }
p.nadnaslov { padding-left: 52px; }
p.nadnaslov::before {
	left: 0; top: 50%; width: 44px; height: 27px; margin-top: -14px; transform: none; box-shadow: none;
	background: url("../img/kockice-ukras.svg") no-repeat left center / contain;
}
p.nadnaslov.has-text-align-center { padding-left: 0; }
p.nadnaslov.has-text-align-center::before { width: 60px; height: 37px; margin: 0 auto 12px; }
.naslov-grupe::before { width: 60px; height: 37px; }

/* Različit raspored kockica po sekcijama (da ne bude jednolično) */
.sekcija:nth-of-type(6n+1) :is(.naslov-sekcije, p.nadnaslov)::before { background-image: url("../img/kockice-ukras-1.svg"); }
.sekcija:nth-of-type(6n+2) :is(.naslov-sekcije, p.nadnaslov)::before { background-image: url("../img/kockice-ukras-2.svg"); }
.sekcija:nth-of-type(6n+3) :is(.naslov-sekcije, p.nadnaslov)::before { background-image: url("../img/kockice-ukras-3.svg"); }
.sekcija:nth-of-type(6n+4) :is(.naslov-sekcije, p.nadnaslov)::before { background-image: url("../img/kockice-ukras-4.svg"); }
.sekcija:nth-of-type(6n+5) :is(.naslov-sekcije, p.nadnaslov)::before { background-image: url("../img/kockice-ukras-5.svg"); }
.sekcija:nth-of-type(6n+6) :is(.naslov-sekcije, p.nadnaslov)::before { background-image: url("../img/kockice-ukras-6.svg"); }
/* unutar iste sekcije drugi naslov (npr. grupe radionica) dobiva sljedeći raspored */
.naslov-grupe ~ .naslov-grupe::before { background-image: url("../img/kockice-ukras-4.svg") !important; }

/* Treća razina izbornika (npr. Edukacija → Radionice za djecu → …): otvara se prelaskom miša, desno */
@media (min-width: 1101px) {
	.izbornik .sub-menu li { position: relative; flex-wrap: nowrap; }
	.izbornik .sub-menu .sub-menu {
		display: block; position: absolute; top: -13px; left: 100%; min-width: 300px; padding: 10px 0;
		background: #fff; box-shadow: var(--sjena); border-top: 3px solid var(--crvena); border-radius: 0 0 var(--zaobljeno) var(--zaobljeno);
		opacity: 0; visibility: hidden; transform: translateX(8px);
		transition: opacity .15s, transform .15s, visibility 0s linear .35s; /* kratka odgoda zatvaranja – lakše pogoditi mišem */
	}
	.izbornik .sub-menu li:hover > .sub-menu,
	.izbornik .sub-menu li:focus-within > .sub-menu,
	.izbornik .sub-menu li.je-otvoreno > .sub-menu { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
	.izbornik .sub-menu li:hover > a, .izbornik .sub-menu li.je-otvoreno > a { color: var(--crvena-tekst); background: var(--pozadina); }
	.izbornik .sub-menu .podizbornik-gumb svg { transform: rotate(-90deg); }
	.izbornik .sub-menu .podizbornik-gumb[aria-expanded="true"] svg { transform: rotate(-90deg); }
	/* zadnje stavke (O nama) otvaraju treću razinu ulijevo da ne izađu iz ekrana */
	.izbornik > li:nth-last-child(-n+2) .sub-menu .sub-menu { left: auto; right: 100%; transform: translateX(-8px); }
	.izbornik > li:nth-last-child(-n+2) .sub-menu li:hover > .sub-menu { transform: none; }
	/* i padajući izbornik prve razine ostaje otvoren trenutak nakon izlaska miša */
	.izbornik > li > .sub-menu { transition: opacity .18s, transform .18s, visibility 0s linear .3s; }
	.izbornik > li:hover > .sub-menu, .izbornik > li:focus-within > .sub-menu, .izbornik > li.je-otvoreno > .sub-menu { transition-delay: 0s; }
}

/* Mobilni izbornik: sve razine odmah rasklopljene (bez traženja strelica) */
@media (max-width: 1100px) {
	.izbornik .podizbornik-gumb { display: none; }
	.izbornik .sub-menu, .izbornik > li:hover > .sub-menu, .izbornik > li:focus-within > .sub-menu, .izbornik .sub-menu .sub-menu {
		display: block !important; position: static; opacity: 1; visibility: visible; transform: none;
		background: transparent; box-shadow: none; border: 0; padding: 0 0 8px 0; min-width: 0;
	}
	.izbornik > li > a { font-size: 17px; padding: 16px 4px; }
	.izbornik .sub-menu { border-left: 3px solid var(--crvena); margin: 0 0 10px 6px; }
	.izbornik .sub-menu a { color: #e8e8e8; font-size: 17px; padding: 12px 16px; text-transform: none; }
	.izbornik .sub-menu .sub-menu { border-left-color: var(--plava); margin: 0 0 6px 14px; }
	.izbornik .sub-menu .sub-menu a { font-size: 16px; color: #d6d6d6; padding: 10px 14px; }
	/* naslovi skupina (stavke bez vlastite stranice) */
	.izbornik a[role="button"] { color: #fff; font-weight: 600; text-transform: uppercase; font-size: 14px; letter-spacing: .04em; padding-top: 14px; cursor: default; }
	.izbornik .sub-menu li { display: block; }
	.izbornik a:focus-visible { outline-offset: -3px; }
}

/* Dokumenti za preuzimanje */
.dokumenti { list-style: none; margin: 0 0 2em; padding: 0; display: grid; gap: 10px; }
.sadrzaj ul.dokumenti li::marker { content: none; }
.dokumenti-naslov { font-size: 20px; margin: 2em 0 .8em; padding-left: 14px; border-left: 4px solid var(--crvena); color: var(--naslov); }
.dokumenti-naslov:first-child { margin-top: 0; }
.dokument { margin: 0; }
.dokument-veza {
	display: flex; align-items: center; gap: 16px; padding: 14px 18px; min-height: 64px;
	background: #fff; border: 1px solid var(--linija); border-radius: 10px; text-decoration: none; color: var(--naslov);
	transition: border-color .2s, box-shadow .2s, transform .2s;
}
.sekcija-bijela .dokument-veza { background: var(--pozadina); }
.dokument-veza:hover { border-color: var(--crvena); box-shadow: var(--sjena-mala); transform: translateY(-1px); color: var(--naslov); }
.dokument-veza:focus-visible { outline: 3px solid var(--plava); outline-offset: 2px; }
.dokument-ikona {
	flex: none; display: grid; place-items: center; width: 46px; height: 54px; border-radius: 4px 12px 4px 4px;
	background: var(--crvena); color: #fff; font: 600 12px/1 var(--font-ukras); letter-spacing: .04em; position: relative;
}
.dokument-ikona[data-vrsta="DOC"], .dokument-ikona[data-vrsta="ODT"], .dokument-ikona[data-vrsta="RTF"] { background: var(--plava); }
.dokument-ikona[data-vrsta="XLS"], .dokument-ikona[data-vrsta="ODS"], .dokument-ikona[data-vrsta="CSV"] { background: #1d7a45; }
.dokument-ikona[data-vrsta="ZIP"], .dokument-ikona[data-vrsta="PPT"] { background: #5c5c5c; }
.dokument-tekst { flex: 1; min-width: 0; display: grid; gap: 2px; }
.dokument-naziv { font-weight: 500; line-height: 1.4; overflow-wrap: anywhere; }
.dokument-meta { font-size: 13px; color: var(--tekst-svijetli); }
.dokument-gumb {
	flex: none; font: 500 13px var(--font-ukras); text-transform: uppercase; letter-spacing: .04em; color: var(--crvena-tekst);
	border: 2px solid currentColor; border-radius: 30px; padding: 7px 16px;
}
.dokument-veza:hover .dokument-gumb { background: var(--crvena); border-color: var(--crvena); color: #fff; }
@media (max-width: 560px) { .dokument-gumb { display: none; } .dokument-veza { padding: 12px 14px; gap: 12px; } }
.info-kartica .dokumenti { gap: 8px; }
.info-kartica .dokument-veza { padding: 10px 12px; min-height: 0; }
.info-kartica .dokument-gumb { display: none; }
.info-kartica .dokument-ikona { width: 38px; height: 44px; font-size: 11px; }
.dokument-bez-datoteke .dokument-veza { background: transparent; border-style: dashed; color: var(--tekst); }
.dokument-bez-datoteke .dokument-ikona { background: #c9c9c9; }
.dokument-ikona[data-vrsta="WEB"] { background: #292929; }
.sadrzaj ul:has(> li > ul.dokumenti), .sadrzaj ul:has(> li.dokumenti-skupina) { list-style: none; padding: 0; margin: 0; }
.sadrzaj li.dokumenti-skupina, .sadrzaj li:has(> ul.dokumenti) { list-style: none; margin: 0; padding: 0; }
.sadrzaj li.dokumenti-skupina::marker, .sadrzaj li:has(> ul.dokumenti)::marker { content: none; }
.sadrzaj li > ul.dokumenti { margin-left: 0; padding-left: 0; }

/* =====================================================================
   v3 – moderni detalji: kosi prijelazi, zaobljeno, sjene, pokret
   ===================================================================== */
:root {
	--zaobljeno: 14px;
	--zaobljeno-veliko: 22px;
	--sjena-mala: 0 1px 2px rgba(16, 24, 40, .05), 0 6px 18px rgba(16, 24, 40, .07);
	--sjena: 0 2px 6px rgba(16, 24, 40, .06), 0 18px 40px rgba(16, 24, 40, .12);
	--sjena-velika: 0 4px 10px rgba(16, 24, 40, .06), 0 30px 70px rgba(16, 24, 40, .16);
	--kosina: clamp(28px, 4vw, 64px);
}

/* Kosi prijelazi: bijele sekcije imaju nagnut gornji i donji rub */
.ima-blokove .sadrzaj > .sekcija-bijela {
	clip-path: polygon(0 var(--kosina), 100% 0, 100% calc(100% - var(--kosina)), 0 100%);
	padding-top: calc(clamp(56px, 7vw, 104px) + var(--kosina) * .6) !important;
	padding-bottom: calc(clamp(56px, 7vw, 104px) + var(--kosina) * .6) !important;
	margin-block: calc(var(--kosina) * -0.5);
	position: relative; z-index: 1;
}
.ima-blokove .sadrzaj > .sekcija-bijela:nth-of-type(4n) { clip-path: polygon(0 0, 100% var(--kosina), 100% 100%, 0 calc(100% - var(--kosina))); }
.ima-blokove .sadrzaj > .sekcija-bijela:last-child { clip-path: polygon(0 var(--kosina), 100% 0, 100% 100%, 0 100%); margin-bottom: 0; }

/* Zaobljeno + sjene */
.info-kartica, .knjiga, .obrazac-omot, .kartica, .dog-redovi, .obavijest-traka, .is-style-kartica { border-radius: var(--zaobljeno); }
.obrazac-omot { box-shadow: var(--sjena); }
.slika-okvir img { border-radius: var(--zaobljeno-veliko); box-shadow: var(--sjena-velika); }
.slika-okvir.kockice-uz::after { border-radius: 12px; }
.sadrzaj .galerija-kt figure.wp-block-image, .sadrzaj .galerija-kt figure.wp-block-image img { border-radius: var(--zaobljeno); }
.sadrzaj .galerija-kt figure.wp-block-image img { transition: transform .5s ease; }
.sadrzaj .galerija-kt figure.wp-block-image:hover img { transform: scale(1.05); }
.karta iframe { border-radius: var(--zaobljeno-veliko); }
.info-kartica { transition: transform .25s ease, box-shadow .25s ease; }
.info-kartica:hover { transform: translateY(-4px); box-shadow: var(--sjena); }
.sekcija-bijela .info-kartica:hover { box-shadow: var(--sjena-mala); }

/* Gumbi: strelica klizne pri prelasku mišem */
.gumb::after, .wp-block-button__link::after {
	content: "→"; display: inline-block; width: 0; opacity: 0; margin-left: 0; overflow: hidden;
	transition: width .2s ease, opacity .2s ease, margin .2s ease;
}
.gumb:hover::after, .gumb:focus-visible::after, .wp-block-button__link:hover::after, .wp-block-button__link:focus-visible::after { width: 1em; opacity: 1; margin-left: .45em; }
.gumb, .wp-block-button__link { box-shadow: 0 6px 16px rgba(229, 36, 40, .22); }
.gumb:hover, .wp-block-button__link:hover { box-shadow: 0 10px 24px rgba(191, 23, 26, .3); transform: translateY(-1px); }

/* Kartice događanja: crvena oznaka datuma, zum slike */
.dog-znacka { background: var(--crvena); color: #fff; border-radius: 10px; box-shadow: 0 6px 14px rgba(229, 36, 40, .35); }
.dog-znacka b { color: #fff; font-size: 18px; }
.dog-znacka small { color: #fff; opacity: .95; }
.kartica { box-shadow: var(--sjena-mala); }
.kartica:hover { box-shadow: var(--sjena); transform: translateY(-5px); }
.kartica-slika img { transition: transform .6s ease; }
.kartica:hover .kartica-slika img { transform: scale(1.06); }
.kartica-tijelo { padding: 22px 24px 26px; }

/* Zaglavlje se smanji pri pomicanju */
/* Zaglavlje: stalna visina (bez skakanja/treperenja), pri pomicanju samo sjena */
.zaglavlje { transition: box-shadow .25s ease; }
.zaglavlje.je-pomaknuto { box-shadow: 0 8px 30px rgba(0, 0, 0, .35); }

/* Hero: blagi zum fotografija */
@media (prefers-reduced-motion: no-preference) {
	.hero-slike img.je-aktivna { animation: kt-zum 14s ease-out both; }
	@keyframes kt-zum { from { transform: scale(1.08); } to { transform: scale(1); } }
	.hero-tekst > * { animation: kt-uvod .9s ease-out both; }
	.hero-tekst > *:nth-child(2) { animation-delay: .15s; }
	@keyframes kt-uvod { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
}

/* Pojavljivanje sekcija pri pomicanju (JS dodaje .kt-otkrij; bez JS-a sve je vidljivo) */
@media (prefers-reduced-motion: no-preference) {
	html.js-pokret .kt-otkrij { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .7s ease; }
	html.js-pokret .kt-otkrij.je-vidljivo { opacity: 1; transform: none; }
}
html.p-animacije .kt-otkrij { opacity: 1 !important; transform: none !important; }

/* Podnožje: koso gornji rub crvene trake */
.podnozje-traka { position: relative; padding: 18px 0 14px; clip-path: polygon(0 28%, 100% 0, 100% 100%, 0 100%); margin-top: -1px; }
.podnozje { position: relative; margin-top: calc(var(--kosina) * .2); }

/* Mreže događanja/obavijesti: malo više zraka */
.mreza { gap: 30px; }
.dog-redovi { overflow: hidden; }
.dog-red { transition: background-color .2s ease, padding-left .2s ease; }
.dog-red:hover { padding-left: calc(clamp(16px, 3vw, 40px) + 6px); }
@media (prefers-reduced-motion: reduce) { .dog-red:hover { padding-left: clamp(16px, 3vw, 40px); } }

/* Prošla događanja: jasno zasivljena (kontrast i dalje ≥ 4.5:1) */
.dog-red.je-proslo { background: #f4f4f4; border-left: 4px solid #d0d0d0; }
.dog-red.je-proslo .dog-red-datum .dan, .dog-red.je-proslo .dog-red-naslov a { color: #6f6f6f; font-weight: 500; }
.dog-red.je-proslo .dog-red-meta, .dog-red.je-proslo .mjesec { color: #6f6f6f; }
.dog-red.je-proslo:hover { background: #ededed; }
.dog-red.je-proslo:hover .dog-red-naslov a, .dog-red.je-proslo:hover .dan { color: #4a4a4a; }
.dog-red:not(.je-proslo) { border-left: 4px solid var(--crvena); }
.dog-odrzano {
	display: inline-block; vertical-align: middle; margin-left: 10px; padding: 2px 10px; border-radius: 30px;
	background: #e2e2e2; color: #4f4f4f; font: 500 11px/1.6 var(--font-ukras); letter-spacing: .05em; text-transform: uppercase;
}
.dog-znacka { background: #cf1f24; }
.dog-znacka small { opacity: 1; }

/* Mobitel: sitnice nađene provjerom svih stranica */
.sadrzaj a { overflow-wrap: anywhere; }
.kartica-radionica .oznaka, .oznaka { font-size: 12px; }
.kartica-vise { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 0; }
.polje-izbori input, .polje-pristanak input { width: 22px; height: 22px; }
@media (max-width: 600px) {
	.dog-znacka small { font-size: 11px; }
	.kartica-izvadak { font-size: 15px; }
	.dokument-meta { font-size: 13px; }
	.naslov-sekcije { font-size: 27px; }
	.hero { min-height: 340px; padding-bottom: 110px; }
	.hero-naslov { font-size: 34px; }
	.ima-blokove .sadrzaj > .sekcija { padding: 48px 0; }
	.info-kartica { padding: 22px 20px; }
}
.polje-izbori input, .polje-pristanak input { width: 24px; height: 24px; }
@media (max-width: 600px) {
	.mreza-arhiva, .mreza-arhiva > .wp-block-group__inner-container { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
	.mreza-knjiga, .mreza-knjiga > .wp-block-group__inner-container { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
	.knjiga { padding: 10px 10px 14px; font-size: 13px; }
	.knjiga .knjiga-naslovnica { padding: 8px; margin-bottom: 10px; }
	.hero-zatamni { background: linear-gradient(180deg, rgba(0, 0, 0, .35) 0%, rgba(0, 0, 0, .55) 55%, rgba(0, 0, 0, .35) 100%); }
	.mreza-logo, .mreza-logo > .wp-block-group__inner-container { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.logo-stavka a, .logo-stavka figure > img { min-height: 110px; padding: 14px; }
}

/* Radionice: uvod (veća slova) uz sliku poravnatu s naslovom, ostatak teksta ispod */
.sekcija-uvod .uvodni-tekst { font-size: clamp(17px, 1.35vw, 19px); line-height: 1.7; color: #4a4a4a; }
.sekcija-uvod .wp-block-columns.are-vertically-aligned-top .slika-okvir { margin-top: 8px; }
@media (min-width: 782px) { .sekcija-uvod .slika-okvir { position: sticky; top: calc(var(--visina-zaglavlja) + 32px); } }
.sekcija-siroka > .wp-block-group__inner-container, .sekcija-siroka.is-layout-constrained > * { width: min(100% - 32px, 1120px); }
.tekst-stupci { columns: 2 340px; column-gap: clamp(32px, 5vw, 72px); column-rule: 1px solid var(--linija); }
.tekst-stupci p, .tekst-stupci ul, .tekst-stupci li { break-inside: avoid-column; }
.tekst-stupci > :first-child, .tekst-stupci p:first-child { margin-top: 0; }
.tekst-uski { max-width: 820px; }
.tekst-stupci strong, .tekst-uski strong { color: var(--naslov); }

/* Događanja: odjeljci, aktivna događanja istaknuta */
.dog-odjeljak { margin: 0 0 56px; }
.dog-odjeljak > .naslov-sekcije { margin-bottom: 8px; }
.dog-mjesec { font-size: clamp(20px, 2vw, 24px); }
.mreza-traje { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); margin-top: 24px; }
.kartica-traje { border: 2px solid var(--plava); }
.kartica-traje .kartica-tijelo { padding-top: 18px; }
.dog-traje-vrh { margin: 0 0 8px; }
.dog-traje-oznaka {
	display: inline-block; vertical-align: middle; margin-left: 10px; padding: 3px 12px; border-radius: 30px;
	background: var(--plava); color: #fff; font: 500 12px/1.6 var(--font-ukras); letter-spacing: .05em; text-transform: uppercase;
}
.dog-traje-vrh .dog-traje-oznaka { margin-left: 0; }
.dog-red.je-aktivno { border-left-color: var(--plava); background: #f0f7fd; }
.dog-red.je-aktivno .dan, .dog-red.je-aktivno .dog-red-naslov a { color: #00548c; }
.dog-stranica { font-size: .6em; color: var(--tekst-svijetli); }
.dog-dolazi .dog-mjesec:first-of-type { margin-top: 24px; }

/* Događanja: bočna traka (upravo traje, sljedećih 7 dana) */
.dog-s-bocnim { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: clamp(28px, 4vw, 56px); align-items: start; }
.dog-glavno { min-width: 0; }
.dog-bocno { position: sticky; top: calc(var(--visina-zaglavlja) + 24px); display: grid; gap: 20px; }
.bocno-blok { background: #fff; border-radius: var(--zaobljeno); box-shadow: var(--sjena-mala); padding: 22px 22px 14px; border-top: 4px solid var(--plava); }
.bocno-blok + .bocno-blok { border-top-color: var(--crvena); }
.bocno-naslov { font: 600 15px/1.3 var(--font-ukras); text-transform: uppercase; letter-spacing: .05em; color: var(--naslov); margin: 0 0 12px; }
.bocno-popis { list-style: none; margin: 0; padding: 0; }
.bocno-popis li { border-top: 1px solid var(--linija); }
.bocno-popis li:first-child { border-top: 0; }
.bocno-popis a { display: grid; gap: 2px; padding: 10px 0; text-decoration: none; color: var(--naslov); }
.bocno-popis a:hover .bocno-ime { color: var(--crvena-tekst); text-decoration: underline; }
.bocno-datum { font: 500 12px/1.4 var(--font-ukras); text-transform: uppercase; letter-spacing: .04em; color: #00548c; }
.bocno-blok + .bocno-blok .bocno-datum { color: var(--crvena-tekst); }
.bocno-ime { font-weight: 500; line-height: 1.35; }
.bocno-prazno { font-size: 14px; color: var(--tekst-svijetli); margin: 0 0 10px; }
.bocno-dno { margin: 0; }
.bocno-dno .gumb { width: 100%; }
@media (max-width: 1000px) { .dog-s-bocnim { grid-template-columns: 1fr; } .dog-bocno { display: none; } }
@media (max-height: 820px) { .dog-bocno { position: static; } }

/* Naslovnica na mobitelu */
@media (max-width: 600px) {
	.mreza-dogadjanja {
		display: grid; grid-auto-flow: column; grid-auto-columns: 78%; grid-template-columns: none;
		overflow-x: auto; scroll-snap-type: x mandatory; gap: 14px;
		margin-inline: -16px; padding: 4px 16px 18px; scrollbar-width: thin; overscroll-behavior-x: contain;
	}
	.mreza-dogadjanja > .kartica { scroll-snap-align: start; }
	.mreza-dogadjanja .kartica:hover { transform: none; }
	.sekcija-dogadjanja .mreza-dogadjanja { margin-top: 24px; }
	.slika-okvir:has(img[src*="og-image"]) { max-width: 72%; margin-inline: auto; }
	.slika-okvir.slika-bez-sjene { max-width: 80%; margin-inline: auto; }
	.sekcija-podruznice .mreza-logo-3, .sekcija-podruznice .mreza-logo-3 > .wp-block-group__inner-container { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
	.sekcija-podruznice .logo-stavka a { min-height: 90px; padding: 8px; }
}

/* Događanja na mobitelu: kategorije u jednom redu, kompaktniji retci */
@media (max-width: 600px) {
	.dog-filter { flex-wrap: nowrap; overflow-x: auto; margin-inline: -16px; padding: 2px 16px 10px; scrollbar-width: thin; }
	.dog-filter a { flex: none; }
	.dog-red { gap: 2px; padding: 14px 16px; }
	.dog-red-datum { display: flex; align-items: baseline; gap: 6px; min-width: 0; }
	.dog-red-datum .dan { display: inline; font-size: 17px; }
	.dog-red-datum .mjesec { font-size: 13px; }
	.dog-red-naslov { font-size: 17px; }
	.dog-mjesec { margin-top: 28px; }
	.dog-odrzano, .dog-traje-oznaka { margin-left: 6px; }
}

/* =====================================================================
   Valoviti prijelazi (kao val u zaglavlju) umjesto ravnih kosih rubova
   ===================================================================== */
:root {
	--val-visina: clamp(36px, 5.5vw, 86px);
	/* val 1: spušta se pa diže (kao zaglavlje) */
	--val-1: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M0 8C170 70 330 98 560 96C820 94 1110 40 1440 4V100H0Z' fill='%23fff'/%3E%3C/svg%3E");
	/* val 2: blaži, dvostruki */
	--val-2: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M0 60C220 10 430 4 700 40C930 72 1180 92 1440 30V100H0Z' fill='%23fff'/%3E%3C/svg%3E");
	--val-crveni: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M0 20C200 85 420 100 690 88C960 76 1200 30 1440 0V100H0Z' fill='%23e52428'/%3E%3C/svg%3E");
}
.ima-blokove .sadrzaj > .sekcija-bijela,
.ima-blokove .sadrzaj > .sekcija-bijela:nth-of-type(4n),
.ima-blokove .sadrzaj > .sekcija-bijela:last-child {
	clip-path: none; margin-block: var(--val-visina);
	padding-top: clamp(40px, 5vw, 80px) !important; padding-bottom: clamp(40px, 5vw, 80px) !important;
}
.ima-blokove .sadrzaj > .sekcija-bijela::before,
.ima-blokove .sadrzaj > .sekcija-bijela::after {
	content: ""; position: absolute; left: 0; right: 0; height: var(--val-visina); pointer-events: none;
	background: var(--val-1) no-repeat center / 100% 100%;
}
.ima-blokove .sadrzaj > .sekcija-bijela::before { top: calc(var(--val-visina) * -1 + 1px); }
.ima-blokove .sadrzaj > .sekcija-bijela::after { bottom: calc(var(--val-visina) * -1 + 1px); transform: scaleY(-1); background-image: var(--val-2); }
/* izmjena oblika: zrcaljeno lijevo-desno i drugi val */
.ima-blokove .sadrzaj > .sekcija-bijela:nth-of-type(4n+2)::before { transform: scaleX(-1); background-image: var(--val-2); }
.ima-blokove .sadrzaj > .sekcija-bijela:nth-of-type(4n+2)::after { transform: scale(-1, -1); background-image: var(--val-1); }
.ima-blokove .sadrzaj > .sekcija-bijela:nth-of-type(4n+3)::before { transform: scaleX(-1); }
.ima-blokove .sadrzaj > .sekcija-bijela:nth-of-type(4n+3)::after { transform: scale(-1, -1); }
.ima-blokove .sadrzaj > .sekcija-bijela:nth-of-type(4n)::before { background-image: var(--val-2); }
.ima-blokove .sadrzaj > .sekcija-bijela:nth-of-type(4n)::after { background-image: var(--val-1); }
/* zadnja bijela sekcija prije podnožja: bez donjeg vala */
.ima-blokove .sadrzaj > .sekcija-bijela:last-child { margin-bottom: 0; }
.ima-blokove .sadrzaj > .sekcija-bijela:last-child::after { display: none; }
.ima-blokove .sadrzaj > .sekcija-bijela:first-child { margin-top: 0; }
.ima-blokove .sadrzaj > .sekcija-bijela:first-child::before { display: none; }

/* Podnožje: valoviti gornji rub crvene trake */
.podnozje-traka { clip-path: none; margin-top: var(--val-visina); padding: 12px 0 14px; }
.podnozje-traka::before { content: ""; position: absolute; left: 0; right: 0; top: calc(var(--val-visina) * -1 + 1px); height: var(--val-visina); background: var(--val-crveni) no-repeat center / 100% 100%; transform: scaleX(-1); pointer-events: none; }
.ima-blokove .sadrzaj > .sekcija-bijela::before { filter: drop-shadow(0 -3px 0 #e4e4e4); }
.ima-blokove .sadrzaj > .sekcija-bijela::after { filter: drop-shadow(0 -3px 0 #e4e4e4); }
.ima-blokove .sadrzaj > .sekcija-novosti { overflow: visible; }
@media (max-width: 600px) { .mreza-dogadjanja { scroll-padding-inline: 16px; padding-left: 16px; padding-right: 16px; } }

/* Točkice ispod niza kartica (samo mobitel) */
.niz-tocke { display: none; }
@media (max-width: 600px) {
	.niz-tocke { display: flex; justify-content: center; align-items: center; gap: 4px; margin: 4px 0 22px; }
	.niz-tocke button { width: 28px; height: 28px; padding: 0; border: 0; background: none; cursor: pointer; display: grid; place-items: center; }
	.niz-tocke button::before { content: ""; display: block; width: 9px; height: 9px; background: #c9c9c9; border-radius: 2px; transform: rotate(45deg); transition: width .25s, background-color .25s, transform .25s; }
	.niz-tocke button[aria-current="true"]::before { width: 22px; background: var(--crvena); transform: none; border-radius: 4px; }
	.niz-tocke button:focus-visible { outline: 2px solid var(--plava); outline-offset: 0; border-radius: 4px; }
}

/* Zadnja bijela sekcija prelazi ravno u crveni val podnožja (bez sive trake) */
body:has(.ima-blokove .sadrzaj > .sekcija-bijela:last-child) .podnozje {
	margin-top: 0; display: flow-root;
	background: linear-gradient(#fff, #fff) no-repeat top / 100% calc(var(--val-visina) + 2px);
}
/* Katalog izdanja: bijele sekcije (dobivaju valove) */
.sekcija-katalog.sekcija-bijela .knjiga { background: var(--pozadina); box-shadow: none; }

/* Podružnice / logotipovi: ista visina, bez sive podloge slike */
.logo-stavka img { height: 104px; max-height: none; width: auto; max-width: 78%; object-fit: contain; }
.logo-stavka img[src*="kuc_mef_2"] { transform: scale(1.32); clip-path: inset(8% 17% 12% 17%); }
@media (max-width: 600px) { .logo-stavka img { height: 64px; max-width: 90%; } }

/* Dugi popisi dokumenata: bočna traka s pretragom i godinama */
.sadrzaj.dok-raspored { width: min(100% - 32px, 1200px); display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 40px; align-items: start; }
.dok-bocno { position: sticky; top: 104px; background: #fff; border-radius: var(--zaobljeno); box-shadow: var(--sjena-mala); padding: 22px 20px; max-height: calc(100vh - 124px); overflow: auto; }
.dok-trazi label { display: block; font-weight: 600; margin-bottom: 8px; color: var(--crna); }
.dok-trazi input { width: 100%; padding: 11px 14px; border: 1px solid #c9c9c9; border-radius: 8px; font: inherit; background: #fff; }
.dok-trazi input:focus { border-color: var(--crvena); outline: 2px solid var(--crvena); outline-offset: 1px; }
.dok-broj { font-size: 14px; margin: 10px 0 0; }
.dok-skupina { margin-top: 22px; border-top: 1px solid var(--linija); padding-top: 18px; }
.dok-bocno-naslov { font-size: 13px; letter-spacing: .08em; text-transform: uppercase; margin: 0 0 10px; color: var(--crna); }
.dok-godine, .dok-skupine { list-style: none; margin: 0; padding: 0; }
.dok-godine { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.dok-godine li:first-child { grid-column: 1 / -1; }
.dok-godine button { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 6px; padding: 8px 10px; border: 1px solid var(--linija); border-radius: 8px; background: var(--pozadina); font: inherit; font-size: 14px; color: var(--tekst, #616161); cursor: pointer; transition: background-color .2s, border-color .2s, color .2s; }
.dok-godine button span { font-size: 12px; }
.dok-godine button:hover { border-color: var(--crvena); color: var(--crna); }
.dok-godine button[aria-pressed="true"] { background: var(--crvena); border-color: var(--crvena); color: #fff; }
.dok-skupine a { display: block; padding: 6px 0; font-size: 14px; color: var(--crna); text-decoration: none; }
.dok-skupine a:hover { color: var(--crvena); text-decoration: underline; }
.dok-popis { scroll-margin-top: 100px; }
.dok-popis > .dokumenti-naslov:first-child, .dok-popis > .dok-nema + .dokumenti-naslov { margin-top: 0; }
.dok-popis .dokumenti-naslov { scroll-margin-top: 100px; }
.dok-nema { padding: 18px 20px; background: #fff; border-radius: var(--zaobljeno); }
@media (max-width: 900px) {
	.sadrzaj.dok-raspored { grid-template-columns: minmax(0, 1fr); gap: 24px; }
	.dok-bocno { position: static; max-height: none; padding: 18px 16px; }
	.dok-godine { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 6px; scroll-snap-type: x proximity; }
	.dok-godine li { flex: none; }
	.dok-godine button { white-space: nowrap; }
	.dok-skupina:has(.dok-skupine) { display: none; }
}

/* Radionice: uravnoteženi redovi, zadnji red centriran */
.mreza-uravnotezena { display: flex; flex-wrap: wrap; justify-content: center; --razmak-m: 30px; gap: var(--razmak-m); }
.mreza-uravnotezena > * { flex: 0 0 calc((100% - (var(--po-redu) - 1) * var(--razmak-m)) / var(--po-redu)); min-width: 0; }
@media (max-width: 1100px) { .mreza-uravnotezena > * { flex-basis: calc((100% - (var(--po-redu-t) - 1) * var(--razmak-m)) / var(--po-redu-t)); } }
@media (max-width: 760px) { .mreza-uravnotezena { --razmak-m: 20px; } .mreza-uravnotezena > * { flex-basis: calc((100% - var(--razmak-m)) / 2); } }
@media (max-width: 480px) { .mreza-uravnotezena > * { flex-basis: 100%; } }

/* Događanja: pretraga */
.dog-trazi { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 32px; }
.dog-trazi-polje { position: relative; flex: 1 1 320px; max-width: 560px; }
.dog-trazi-polje .ikona { position: absolute; left: 16px; top: 50%; width: 20px; height: 20px; transform: translateY(-50%); color: var(--tekst); pointer-events: none; }
.dog-trazi input { width: 100%; height: 48px; padding: 0 16px 0 46px; border: 1px solid #c9c9c9; border-radius: 999px; background: #fff; font: inherit; box-shadow: var(--sjena-mala); transition: border-color .2s; }
.dog-trazi input:focus { border-color: var(--crvena); outline: 2px solid var(--crvena); outline-offset: 1px; }
.dog-trazi .gumb { height: 48px; padding-inline: 26px; margin: 0; }
.dog-trazi-ponisti { font-size: 15px; color: var(--crvena-tamna, #BF171A); }
.dog-rez-broj { margin: -8px 0 20px; }
@media (max-width: 600px) { .dog-trazi { gap: 8px; } .dog-trazi-polje { flex: 1 1 0; min-width: 0; max-width: none; } .dog-trazi .gumb { padding-inline: 18px; } .dog-trazi-ponisti { flex-basis: 100%; } }

/* Podnožje: linijska panorama Zagreba preko cijele širine (min. 1300px, na užim ekranima izrezana po sredini) */
.podnozje-glavno {
	--panorama-s: max(100%, 1300px);
	--panorama-v: calc(max(100vw, 1300px) / 10);
	background: url("../img/zagreb-panorama-v10.svg") no-repeat center bottom / var(--panorama-s) auto, var(--pozadina);
	padding-bottom: calc(var(--panorama-v) - 36px);
}
.podnozje-dno { padding-top: 18px; }
@media (max-width: 600px) { .podnozje-glavno { padding-bottom: calc(var(--panorama-v) - 4px); } }

/* Naslovnica: Podružnice na bijeloj sekciji – kartice logotipova ostaju bijele s rubom */
.sekcija-bijela.sekcija-podruznice .logo-stavka a { background: #fff; border-color: var(--linija); }

/* Naslovnica, 2. slajd (klaunovi): ljudi desno od teksta – rubovi fotografije su crni, pa se pomak ne vidi */
.hero-slike { background: #000; overflow: hidden; }
@media (min-width: 901px) { .hero-slika[src*="11898804_703093269833904"] { left: auto; right: 0; width: 64%; object-position: 0 50%; -webkit-mask-image: linear-gradient(to right, transparent 0, #000 22%); mask-image: linear-gradient(to right, transparent 0, #000 22%); } }
/* 3. slajd (mladi glumci): fotografija u desne dvije trećine, lijevi rub prelazi u tamnu pozadinu ispod teksta */
@media (min-width: 901px) { .hero-slika[src*="Gordogan-2"] { left: auto; right: 0; width: 57%; -webkit-mask-image: linear-gradient(to right, transparent 0, #000 26%); mask-image: linear-gradient(to right, transparent 0, #000 26%); } }

/* Pojedino događanje: slika gore preko širine sadržaja, desno bočna traka (U tijeku / Sljedećih 7 dana) */
.dog-jedno .dog-slika { position: static; margin: 0 0 32px; }
.dog-jedno .dog-slika img { width: 100%; max-height: 640px; object-fit: contain; background: #111; }
.dog-jedno .sadrzaj { max-width: none; }
/* 1. slajd (lutka): isto – fotografija desno, lijevi rub prelazi u tamnu pozadinu ispod teksta */
@media (min-width: 901px) { .hero-slika[src*="Nije-pas-bestija"] { left: auto; right: 0; width: 60%; object-position: 30% 50%; -webkit-mask-image: linear-gradient(to right, transparent 0, #000 24%); mask-image: linear-gradient(to right, transparent 0, #000 24%); } }
/* Klizač: nova slika se pretapa preko stare (stara ostaje ispod do kraja prijelaza) */
.hero-slike img.je-prethodna { opacity: 1; transition: none; z-index: 0; }
.hero-slike img.je-aktivna { z-index: 1; }
/* Podružnice: PIF logo manji, da bude vizualno kao MSF i Centar za tradicijsku kulturnu baštinu */
.logo-stavka img[src*="PIF-logo"] { height: 76px; }
@media (max-width: 600px) { .logo-stavka img[src*="PIF-logo"] { height: 46px; } }
@media (min-width: 601px) { .sekcija-podruznice .logo-stavka a { min-height: 152px; } }