/*
Theme Name: ŽNK Ljubljana
Theme URI: https://www.znk-ljubljana.si
Author: Mojca Dimič s.p.
Author URI: https://mojcadimic.si
Description: Tema za Ženski nogometni klub Ljubljana. Blokovna tema z lastnim vsebinskim modelom za igralke, tekme in sponzorje, pripravljena za poznejšo dograditev spletne trgovine.
Version: 2.4.0
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: znk-ljubljana
Tags: full-site-editing, block-patterns, sports, blog
*/

/* ==========================================================================
   KAZALO
   1.  Žetoni in osnove
   2.  Vsebnik in razdelki
   3.  Gumbi
   4.  Glava
   5.  Junak naslovnice
   6.  Naslovni pas podstrani
   7.  Drobtine
   8.  Naslov razdelka
   9.  Kartice novic
   10. Kartice tekem
   11. Osebe
   12. Sponzorji
   13. Za mlade in informacijske škatle
   14. Vrednote, galerija, številke
   15. Novica
   16. Noga
   17. Obrazci in iskanje
   18. Prazna stanja in opombe
   19. Tisk
   ========================================================================== */

/* ==========================================================================
   1. Žetoni in osnove
   ========================================================================== */

:root {
	--znk-prehod: var(--wp--custom--prehod, 200ms cubic-bezier(.2,.7,.3,1));
	--znk-r-s: var(--wp--custom--zaokrozitev--majhna, 8px);
	--znk-r-m: var(--wp--custom--zaokrozitev--srednja, 14px);
	--znk-r-l: var(--wp--custom--zaokrozitev--velika, 22px);
	--znk-r-polna: var(--wp--custom--zaokrozitev--polna, 999px);
	--znk-glava: var(--wp--custom--glava--visina, 72px);
	--znk-rob: var(--wp--custom--rob, clamp(1.25rem, 5vw, 2.5rem));
	--znk-sirina: 1200px;
	--znk-sirina-ozka: 720px;
	--znk-tarca: 44px;
}

/* Brez tega notranji odmik poveča širino elementa in vsebina uide čez rob. */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; scroll-padding-top: calc(var(--znk-glava) + 1rem); }

::selection { background: var(--wp--preset--color--roza); color: #fff; }

/* Zastavici: polovici grba kot podpis teme. Roza in azurna ploščica
   označujeta naslove razdelkov, nadnaslov junaka in naslovne pasove. */
.znk-naslov-razdelka__besedilo::before,
.znk-pas h1::before {
	content: '';
	display: block;
	width: 34px;
	height: 12px;
	margin-bottom: .85rem;
	background:
		linear-gradient(var(--wp--preset--color--roza), var(--wp--preset--color--roza)) left / 15px 100% no-repeat,
		linear-gradient(var(--wp--preset--color--modra), var(--wp--preset--color--modra)) right / 15px 100% no-repeat;
	transform: skewX(-22deg);
	transform-origin: left bottom;
}

/* Ovoj dela predloge je visok točno toliko kot glava, zato lepljiva glava
   nima dosega. Z display:contents postane glava otrok strani in se lepi.
   Prav tako na body ni overflow, ker ta prav tako onemogoči lepljenje. */
.wp-site-blocks > .wp-block-template-part { display: contents; }

img, video, svg { max-width: 100%; height: auto; }

/* Fokus je viden povsod in se ne odstranjuje zaradi estetike. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--wp--preset--color--roza-temna);
	outline-offset: 3px;
	border-radius: var(--znk-r-s);
}
/* Nad fotografijami in na temnem je moder obris preslab, zato bel. */
.znk-glava :where(a, button):focus-visible,
.znk-temno :where(a, button, input, select, textarea, [tabindex]):focus-visible,
.znk-junak :where(a, button):focus-visible,
.znk-pas :where(a, button):focus-visible,
.znk-poziv :where(a, button):focus-visible,
.znk-vrednota :where(a, button):focus-visible,
.znk-fasada:focus-visible {
	outline-color: #fff;
	outline-offset: 2px;
}

.znk-skoci {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 999;
	background: var(--wp--preset--color--temna);
	color: #fff;
	padding: .85rem 1.35rem;
	border-radius: 0 0 var(--znk-r-s) 0;
	font-weight: 700;
	text-decoration: none;
}
.znk-skoci:focus { left: 0; }

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip-path: inset(50%);
	white-space: nowrap; border: 0;
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}

/* ==========================================================================
   2. Vsebnik in razdelki
   ========================================================================== */

.znk-vsebnik {
	width: 100%;
	max-width: var(--znk-sirina);
	margin-inline: auto;
	padding-inline: var(--znk-rob);
}
.znk-vsebnik--ozek { max-width: var(--znk-sirina-ozka); }

/* Dva razmika za razdelke, nič vmesnega. */
.znk-razdelek { padding-block: var(--wp--custom--razdelek, clamp(3.5rem, 8vw, 6.5rem)); }
.znk-razdelek--tesen { padding-block: var(--wp--custom--razdelek-tesen, clamp(2.25rem, 5vw, 3.5rem)); }

/* Med polnoširinskimi razdelki ne sme uhajati privzeti razmik med bloki. */
.wp-site-blocks > main > .alignfull + .alignfull,
main .znk-razdelek + .znk-razdelek,
main .znk-junak + .znk-razdelek,
main .znk-pas + .znk-razdelek,
main .znk-razdelek + .znk-poziv { margin-block-start: 0; }
.wp-site-blocks > main { margin-block-start: 0; }

.znk-temno {
	background: var(--wp--preset--color--temna);
	color: #fff;
}
.znk-temno :is(h1, h2, h3, h4, p, li, dt, dd) { color: #fff; }
.znk-temno .znk-tiho, .znk-temno .znk-kartica__datum { color: var(--wp--preset--color--tiha-na-temni); }
.znk-temno a:where(:not(.znk-gumb)) { color: var(--wp--preset--color--modra-svetla); }

.znk-mehko { background: var(--wp--preset--color--ozadje); }

.znk-tiho { color: var(--wp--preset--color--tiha); }

/* ==========================================================================
   3. Gumbi
   ========================================================================== */

.znk-gumb,
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .55em;
	min-height: 52px;
	padding: 0 1.75rem;
	border-radius: var(--znk-r-polna);
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	border: 1px solid transparent;
	cursor: pointer;
	transition: background var(--znk-prehod), color var(--znk-prehod), border-color var(--znk-prehod), transform var(--znk-prehod);
}

/* Prva raven: klubska roza iz grba. Uporablja se enkrat na razdelek. */
.znk-gumb--glavni,
.wp-block-button:not(.is-style-outline) .wp-block-button__link {
	background: var(--wp--preset--color--roza-temna);
	color: #fff;
}
.znk-gumb--glavni:hover,
.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
	background: var(--wp--preset--color--temna);
	color: #fff;
	transform: translateY(-1px);
}

/* Druga raven: obroba. */
.znk-gumb--drugotni {
	background: transparent;
	color: var(--wp--preset--color--temna);
	border-color: var(--wp--preset--color--obroba);
}
.znk-gumb--drugotni:hover {
	background: var(--wp--preset--color--temna);
	border-color: var(--wp--preset--color--temna);
	color: #fff;
}
.znk-temno .znk-gumb--drugotni,
.znk-junak .znk-gumb--drugotni,
.znk-pas .znk-gumb--drugotni,
.znk-poziv .znk-gumb--drugotni {
	color: #fff;
	border-color: rgba(255, 255, 255, .38);
	background: rgba(255, 255, 255, .08);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}
.znk-temno .znk-gumb--drugotni:hover,
.znk-junak .znk-gumb--drugotni:hover,
.znk-pas .znk-gumb--drugotni:hover,
.znk-poziv .znk-gumb--drugotni:hover {
	background: #fff;
	color: var(--wp--preset--color--temna);
	border-color: #fff;
}

/* Jedrni slog »Oris« je druga raven gumba, tudi kadar ga doda klub sam. */
.wp-block-button.is-style-outline > .wp-block-button__link,
.wp-block-button.is-style-outline > .wp-block-button__link:not(.has-background) {
	background: transparent;
	color: var(--wp--preset--color--temna);
	border: 1px solid var(--wp--preset--color--obroba);
	padding: 0 1.75rem;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--wp--preset--color--temna);
	color: #fff;
	border-color: var(--wp--preset--color--temna);
}

/* Nad fotografijo in na temnem je isti gumb svetel. */
.znk-glava .wp-block-button.is-style-outline > .wp-block-button__link,
.znk-junak .wp-block-button.is-style-outline > .wp-block-button__link,
.znk-pas .wp-block-button.is-style-outline > .wp-block-button__link,
.znk-temno .wp-block-button.is-style-outline > .wp-block-button__link {
	color: #fff;
	border-color: rgba(255, 255, 255, .4);
	background: rgba(255, 255, 255, .1);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}
.znk-glava .wp-block-button.is-style-outline > .wp-block-button__link:hover,
.znk-junak .wp-block-button.is-style-outline > .wp-block-button__link:hover,
.znk-pas .wp-block-button.is-style-outline > .wp-block-button__link:hover,
.znk-temno .wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: #fff;
	color: var(--wp--preset--color--temna);
	border-color: #fff;
}

/* Tretja raven: povezava s puščico. */
.znk-gumb--tih {
	min-height: var(--znk-tarca);
	padding: 0 .5rem;
	background: none;
	border: 0;
	color: var(--wp--preset--color--modra-temna);
	font-weight: 700;
	text-decoration: none;
}
.znk-gumb--tih:hover { color: var(--wp--preset--color--roza-temna); text-decoration: underline; text-underline-offset: 4px; }
.znk-temno .znk-gumb--tih { color: #fff; }
.znk-temno .znk-gumb--tih:hover { color: var(--wp--preset--color--modra-svetla); }

.znk-gumb__puscica { transition: transform var(--znk-prehod); }
.znk-gumb:hover .znk-gumb__puscica { transform: translateX(3px); }

.znk-gumbi { display: flex; flex-wrap: wrap; gap: .75rem; }
.znk-gumbi--sredina { justify-content: center; }

/* ==========================================================================
   4. Glava
   ========================================================================== */

.znk-glava {
	position: sticky;
	top: 0;
	z-index: 100;
	background: var(--wp--preset--color--temna);
	transition: background var(--znk-prehod), box-shadow var(--znk-prehod);
}

/* Nad junakom je glava prosojna, ob pomiku pa dobi ozadje. Ostane lepljiva,
   da navigacija ne izgine na najdaljši strani spletišča. */
.home .znk-glava { background: transparent; }
.home .znk-glava.je-pomaknjena {
	background: rgba(6, 15, 38, .93);
	backdrop-filter: saturate(150%) blur(14px);
	-webkit-backdrop-filter: saturate(150%) blur(14px);
	box-shadow: 0 1px 0 rgba(255, 255, 255, .08);
}
/* Ob odprtem prekrivnem meniju zameglitev odpade: backdrop-filter na
   predniku ujame fixed meni v okvir glave, zato se odpre kot ozek trak. */
.home .znk-glava.je-pomaknjena:has(.wp-block-navigation__responsive-container.is-menu-open) {
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
	background: var(--wp--preset--color--temna);
}

.znk-glava__vrstica {
	min-height: var(--znk-glava);
	gap: 1.25rem;
}
/* Jedro doda otrokom razmik po navpičnici, kar v prožni vrstici zamakne postavke. */
.znk-glava__vrstica > * { margin-block-start: 0; }

.znk-glava a { color: #fff; text-decoration: none; }

.znk-znamka {
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	font-weight: 800;
	font-size: 1.0625rem;
	letter-spacing: -.01em;
	white-space: nowrap;
	min-height: var(--znk-tarca);
}
.znk-znamka img { width: 34px; height: 34px; object-fit: contain; }

.znk-glava .wp-block-navigation { font-weight: 600; }
.znk-glava .wp-block-navigation a.wp-block-navigation-item__content.wp-block-navigation-item__content {
	color: rgba(255, 255, 255, .8);
	text-decoration: none;
	padding-block: .5rem;
	transition: color var(--znk-prehod);
}
.znk-glava .wp-block-navigation a.wp-block-navigation-item__content.wp-block-navigation-item__content:hover {
	color: #fff;
}
.znk-glava .wp-block-navigation .current-menu-item > a.wp-block-navigation-item__content.wp-block-navigation-item__content,
.znk-glava .wp-block-navigation a.wp-block-navigation-item__content.wp-block-navigation-item__content[aria-current="page"] {
	color: #fff;
	position: relative;
}
/* Podčrtaj samo na namizju: v prekrivnem meniju bi absolutno pozicioniran
   ::after ušel iz skritega menija in se narisal čez glavo. */
@media (min-width: 960px) {
	.znk-glava .wp-block-navigation .current-menu-item > a::after,
	.znk-glava .wp-block-navigation a[aria-current="page"]::after {
		content: '';
		position: absolute;
		left: 0;
		right: 0;
		bottom: -.35rem;
		height: 3px;
		border-radius: 2px;
		background: var(--wp--preset--color--modra);
	}
}

/* Gumb hamburgerja mora biti dovolj velik za palec.
   Lastnosti display tu ne nastavljamo, ker z njo jedro odloča,
   pri kateri širini je gumb sploh viden. */
.znk-glava .wp-block-navigation__responsive-container-open,
.znk-glava .wp-block-navigation__responsive-container-close {
	min-width: var(--znk-tarca);
	min-height: var(--znk-tarca);
	align-items: center;
	justify-content: center;
	color: #fff;
}

/* Meni ima sedem postavk, zato bi se med 600 in 960 px prelomil v dve vrstici.
   Do 960 px raje pokažemo prekrivni meni. */
@media (min-width: 600px) and (max-width: 959px) {
	.znk-glava .wp-block-navigation__responsive-container:not(.is-menu-open) { display: none; }
	.znk-glava .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
}
.znk-glava .wp-block-navigation__responsive-container-open svg,
.znk-glava .wp-block-navigation__responsive-container-close svg { width: 28px; height: 28px; }

.znk-glava .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--temna);
	padding: 1.1rem var(--znk-rob) 2.5rem;
}
.znk-glava .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 3.25rem;
	gap: 0;
	align-items: stretch;
	width: 100%;
}
.znk-glava .is-menu-open .wp-block-navigation__container {
	flex-direction: column;
	align-items: stretch;
	gap: 0;
	width: 100%;
}
.znk-glava .is-menu-open .wp-block-navigation-item { width: 100%; }
.znk-glava .wp-block-navigation__responsive-container.is-menu-open a.wp-block-navigation-item__content.wp-block-navigation-item__content {
	display: flex;
	align-items: center;
	width: 100%;
	color: rgba(255, 255, 255, .85);
	font-size: 1.3125rem;
	font-weight: 700;
	padding: 1rem .15rem;
	min-height: var(--znk-tarca);
	border-bottom: 1px solid rgba(255, 255, 255, .1);
}

/* Vpis v šolo je v predalu poudarjen kot gumb, na namizju pa skrit,
   ker je isti poziv že v junaku in v pasu pred nogo. */
.znk-glava .is-menu-open .znk-meni-vpis a.wp-block-navigation-item__content.wp-block-navigation-item__content {
	margin-top: 1.75rem;
	justify-content: center;
	min-height: 52px;
	padding: 0 1.75rem;
	font-size: 1.0625rem;
	color: #fff;
	background: var(--wp--preset--color--roza-temna);
	border: 0;
	border-radius: var(--znk-r-polna);
}
@media (min-width: 960px) {
	.znk-glava .znk-meni-vpis { display: none; }
}
.znk-glava .wp-block-navigation__responsive-container.is-menu-open .current-menu-item > a.wp-block-navigation-item__content.wp-block-navigation-item__content,
.znk-glava .wp-block-navigation__responsive-container.is-menu-open a.wp-block-navigation-item__content.wp-block-navigation-item__content[aria-current="page"] {
	color: #fff;
}
.znk-glava .is-menu-open .current-menu-item > a::after,
.znk-glava .is-menu-open a[aria-current="page"]::after { display: none; }
.znk-glava .is-menu-open .current-menu-item > a::before,
.znk-glava .is-menu-open a[aria-current="page"]::before {
	content: '';
	display: inline-block;
	width: 8px; height: 8px;
	margin-right: .6rem;
	border-radius: 50%;
	background: var(--wp--preset--color--roza);
	vertical-align: middle;
}


/* ==========================================================================
   5. Junak naslovnice
   ========================================================================== */

.znk-junak {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: min(78vh, 760px);
	margin-top: calc(-1 * var(--znk-glava));
	padding-top: var(--znk-glava);
	overflow: hidden;
	background: var(--wp--preset--color--temna);
	isolation: isolate;
}

.znk-junak__medij { position: absolute; inset: 0; z-index: -2; max-width: none; margin: 0; }
.znk-junak__medij img {
	width: 100%; height: 100%;
	object-fit: cover;
	object-position: center 28%;
	display: block;
	border-radius: 0;
}
.znk-junak::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: -1;
	background: var(--wp--preset--gradient--cez-fotografijo);
}

.znk-junak__vsebina {
	position: relative;
	width: 100%;
	padding-block: clamp(2.5rem, 7vw, 4.5rem);
	color: #fff;
	max-width: 46rem;
}

.znk-nadnaslov {
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	font-size: .8125rem;
	font-weight: 800;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: #fff;
	margin: 0 0 1rem;
}
.znk-nadnaslov::before {
	content: '';
	flex: none;
	width: 28px; height: 10px;
	background:
		linear-gradient(var(--wp--preset--color--roza), var(--wp--preset--color--roza)) left / 12px 100% no-repeat,
		linear-gradient(var(--wp--preset--color--modra), var(--wp--preset--color--modra)) right / 12px 100% no-repeat;
	transform: skewX(-22deg);
}

.znk-junak h1 {
	color: #fff;
	margin: 0;
	font-size: var(--wp--preset--font-size--prikaz);
	text-wrap: balance;
}

.znk-junak__dejstva {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem 1.25rem;
	margin: 1.25rem 0 0;
	padding: 0;
	list-style: none;
	color: rgba(255, 255, 255, .88);
	font-weight: 600;
}
.znk-junak__dejstva li { display: flex; align-items: center; gap: 1.25rem; }
.znk-junak__dejstva li + li::before {
	content: '';
	width: 5px; height: 5px;
	border-radius: 50%;
	background: var(--wp--preset--color--modra);
	margin-left: -.75rem;
}

.znk-junak .znk-gumbi { margin-top: 2rem; }

/* ==========================================================================
   6. Naslovni pas podstrani
   ========================================================================== */

.znk-pas {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: min(46vh, 420px);
	margin-top: calc(-1 * var(--znk-glava));
	padding-top: var(--znk-glava);
	overflow: hidden;
	background: var(--wp--preset--color--temna);
	isolation: isolate;
}
.znk-pas__medij { position: absolute; inset: 0; z-index: -2; max-width: none; margin: 0; }
.znk-pas__medij img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 0; }
.znk-pas::after {
	content: '';
	position: absolute; inset: 0; z-index: -1;
	background: var(--wp--preset--gradient--cez-fotografijo);
}
.znk-pas__vsebina { position: relative; width: 100%; padding-block: clamp(2rem, 5vw, 3.25rem); }
.znk-pas h1 {
	color: #fff;
	margin: 0;
	font-size: var(--wp--preset--font-size--naslov-xl);
	font-weight: 700;
	letter-spacing: -.015em;
	text-wrap: balance;
}
.znk-pas__uvod {
	color: rgba(255, 255, 255, .85);
	margin: .85rem 0 0;
	max-width: 46ch;
	font-size: var(--wp--preset--font-size--veliko);
}

/* Različica brez fotografije. */
.znk-pas--brez-slike { min-height: auto; }
.znk-pas--brez-slike::after { background: none; }

/* ==========================================================================
   7. Drobtine
   ========================================================================== */

.znk-drobtine { margin: 0 0 1rem; font-size: var(--wp--preset--font-size--drobno); }
.znk-drobtine ol {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .35rem .5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.znk-drobtine li {
	display: flex;
	align-items: center;
	gap: .5rem;
	min-width: 0;
	color: rgba(255, 255, 255, .72);
}
.znk-drobtine [aria-current="page"] {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
@media (max-width: 520px) {
	.znk-drobtine li:last-child { display: none; }
	.znk-drobtine li:nth-last-child(2)::after { content: ''; }
}
.znk-drobtine li + li::before { content: '/'; opacity: .5; }
.znk-drobtine a { color: rgba(255, 255, 255, .82); text-decoration: none; }
.znk-drobtine a:hover { color: #fff; text-decoration: underline; }
.znk-drobtine [aria-current="page"] { color: #fff; font-weight: 600; }

/* Na svetlem ozadju. */
.znk-svetlo .znk-drobtine li { color: var(--wp--preset--color--tiha); }
.znk-svetlo .znk-drobtine a { color: var(--wp--preset--color--tiha); }
.znk-svetlo .znk-drobtine [aria-current="page"] { color: var(--wp--preset--color--temna); }

/* ==========================================================================
   8. Naslov razdelka
   ========================================================================== */

.znk-naslov-razdelka {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 1rem 1.5rem;
	flex-wrap: wrap;
	margin-bottom: clamp(1.75rem, 3.5vw, 2.75rem);
}
.znk-naslov-razdelka__besedilo { margin: 0; }
.znk-naslov-razdelka .znk-gumb--tih { margin-bottom: .2em; }

/* ==========================================================================
   9. Kartice novic
   ========================================================================== */

.znk-novice-mreza,
.znk-novice-stranske {
	display: grid;
	gap: clamp(1.25rem, 2.5vw, 2rem);
	margin: 0;
	padding: 0;
	list-style: none;
}
.znk-novice-mreza { grid-template-columns: minmax(0, 1fr); }

@media (min-width: 601px) { .znk-novice-mreza { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .znk-novice-mreza { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.znk-novice-postavitev {
	display: grid;
	gap: clamp(1.5rem, 3vw, 2.5rem);
	grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 1000px) {
	.znk-novice-postavitev { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); align-items: start; }
}

.znk-kartica { position: relative; height: 100%; }

.znk-kartica__povezava {
	display: flex;
	flex-direction: column;
	gap: .9rem;
	height: 100%;
	color: inherit;
	text-decoration: none;
}

.znk-kartica__slika {
	position: relative;
	overflow: hidden;
	border-radius: var(--znk-r-m);
	background: var(--wp--preset--color--ozadje);
	aspect-ratio: 4 / 3;
}
.znk-kartica--velika .znk-kartica__slika { aspect-ratio: 16 / 9; }
.znk-kartica__slika img {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
	border-radius: 0;
	transition: transform 420ms cubic-bezier(.2,.7,.3,1);
}
.znk-kartica__povezava:hover .znk-kartica__slika img { transform: scale(1.04); }

.znk-kartica__brez-slike {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	background: var(--wp--preset--color--modra-bleda);
}
.znk-kartica__brez-slike img { width: 44px; height: 44px; object-fit: contain; }

.znk-kartica__besedilo { display: flex; flex-direction: column; gap: .35rem; }

.znk-kartica__datum {
	font-size: var(--wp--preset--font-size--drobno);
	font-weight: 600;
	color: var(--wp--preset--color--tiha);
	letter-spacing: .01em;
}

.znk-kartica__naslov {
	margin: 0;
	font-size: var(--wp--preset--font-size--naslov-s);
	font-weight: 700;
	line-height: 1.3;
	/* Dve vrstici, da se kartice v vrsti poravnajo. */
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: calc(2 * 1.3em);
}
.znk-kartica--velika .znk-kartica__naslov {
	font-size: var(--wp--preset--font-size--naslov-m);
	-webkit-line-clamp: 3;
	min-height: 0;
}
.znk-kartica__povezava:hover .znk-kartica__naslov { text-decoration: underline; text-underline-offset: 3px; }
.znk-temno .znk-kartica__povezava:hover .znk-kartica__naslov { color: var(--wp--preset--color--modra-svetla); }

.znk-kartica__povzetek {
	margin: .35rem 0 0;
	color: var(--wp--preset--color--tiha);
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.znk-temno .znk-kartica__povzetek { color: var(--wp--preset--color--tiha-na-temni); }

.znk-kartica__vec {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	margin-top: .75rem;
	font-weight: 700;
	color: var(--wp--preset--color--modra);
}
.znk-kartica__povezava:hover .znk-kartica__vec .znk-gumb__puscica { transform: translateX(3px); }

/* Vodoravna kartica v stranskem seznamu. */
.znk-kartica--vrstica .znk-kartica__povezava { flex-direction: row; align-items: center; gap: 1rem; }
.znk-kartica--vrstica .znk-kartica__slika { flex: none; width: 116px; aspect-ratio: 1 / 1; border-radius: var(--znk-r-s); }
.znk-kartica--vrstica .znk-kartica__naslov { font-size: 1rem; min-height: 0; }

/* ==========================================================================
   10. Kartica zadnje tekme
   ========================================================================== */

.znk-tekme { max-width: 720px; }

.znk-tekma {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	color: var(--wp--preset--color--temna);
	background: #fff;
	border: 1px solid var(--wp--preset--color--obroba);
	border-radius: var(--znk-r-l);
	padding: clamp(1.5rem, 3vw, 2rem);
	box-shadow: var(--wp--custom--senca--mirna);
	overflow: hidden;
}
/* Trak v barvah grba, kot polovici ščita. */
.znk-tekma::before {
	content: '';
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 4px;
	background: linear-gradient(90deg, var(--wp--preset--color--roza) 0 50%, var(--wp--preset--color--modra) 50% 100%);
}

.znk-tekma__glava {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .75rem;
	flex-wrap: wrap;
}
.znk-tekma__tekmovanje {
	font-size: var(--wp--preset--font-size--drobno);
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--wp--preset--color--tiha);
}

.znk-znacka {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	padding: .3rem .7rem;
	border-radius: var(--znk-r-polna);
	font-size: .75rem;
	font-weight: 800;
	letter-spacing: .05em;
	text-transform: uppercase;
	background: var(--wp--preset--color--modra-bleda);
	color: var(--wp--preset--color--modra-temna);
	white-space: nowrap;
}
.znk-znacka--zmaga { background: var(--wp--preset--color--roza-temna); color: #fff; }
.znk-znacka--poraz { background: var(--wp--preset--color--tiha); color: #fff; }
.znk-znacka--remi { background: var(--wp--preset--color--ozadje); color: var(--wp--preset--color--tiha); }

.znk-tekma__ekipi {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	align-items: center;
	gap: .75rem;
}
.znk-tekma__ekipa {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .5rem;
	text-align: center;
	min-width: 0;
}
.znk-grb {
	width: 48px; height: 48px;
	object-fit: contain;
	border-radius: 0;
}
.znk-grb--prazen {
	display: grid;
	place-items: center;
	background: var(--wp--preset--color--ozadje);
	border-radius: 50%;
	font-size: .8125rem;
	font-weight: 800;
	color: var(--wp--preset--color--tiha);
}
.znk-tekma__ime {
	font-size: .9375rem;
	font-weight: 700;
	line-height: 1.25;
	color: var(--wp--preset--color--tiha);
}
/* Naš klub je vedno v polni barvi, ne glede na to, ali igra doma. */
.znk-tekma__ekipa--nasa .znk-tekma__ime { color: var(--wp--preset--color--temna); }

.znk-tekma__sredina { text-align: center; }
.znk-tekma__rezultat {
	display: inline-flex;
	align-items: baseline;
	gap: .35rem;
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: clamp(2.25rem, 5vw, 3rem);
	font-weight: 800;
	letter-spacing: -.02em;
	font-variant-numeric: tabular-nums;
}
.znk-tekma__dvopicje { color: var(--wp--preset--color--tiha); }

.znk-tekma__noga {
	display: flex;
	flex-direction: column;
	gap: .2rem;
	padding-top: .9rem;
	border-top: 1px solid var(--wp--preset--color--obroba);
	font-size: var(--wp--preset--font-size--drobno);
	color: var(--wp--preset--color--tiha);
}
.znk-tekma__kdaj { font-weight: 700; color: var(--wp--preset--color--temna); }

/* ==========================================================================
   11. Osebe
   ========================================================================== */

.znk-osebe {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(1.25rem, 2.5vw, 2rem) clamp(1rem, 2vw, 1.5rem);
	margin: 0;
	padding: 0;
	list-style: none;
}
@media (min-width: 640px) { .znk-osebe { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .znk-osebe { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* Kartica igralke: fotografija čez celo kartico, ime na prelivu, velika
   številka dresa. Ob preletu se fotografija približa, kartica pa dvigne. */

.znk-oseba { text-align: left; }

.znk-oseba__slika {
	position: relative;
	aspect-ratio: 4 / 5;
	border-radius: var(--znk-r-m);
	overflow: hidden;
	background: linear-gradient(160deg, var(--wp--preset--color--modra-bleda), var(--wp--preset--color--roza-bleda));
	display: grid;
	place-items: center;
	isolation: isolate;
	transition: transform var(--znk-prehod), box-shadow var(--znk-prehod);
}
.znk-oseba:hover .znk-oseba__slika {
	transform: translateY(-6px);
	box-shadow: var(--wp--custom--senca--dvignjena);
}
.znk-oseba__slika img {
	position: absolute;
	inset: 0;
	width: 100%; height: 100%;
	object-fit: cover;
	object-position: center top;
	display: block;
	border-radius: 0;
	z-index: -2;
	transition: transform 520ms cubic-bezier(.2,.7,.3,1);
}
.znk-oseba:hover .znk-oseba__slika img { transform: scale(1.07); }

/* Preliv za berljivost napisa; ob preletu se rahlo poglobi. */
.znk-oseba__slika::after {
	content: '';
	position: absolute;
	inset: 40% 0 0;
	z-index: -1;
	background: linear-gradient(180deg, rgba(6, 15, 38, 0) 0%, rgba(6, 15, 38, .88) 88%);
	transition: opacity var(--znk-prehod);
	opacity: .92;
}
.znk-oseba:hover .znk-oseba__slika::after { opacity: 1; }

.znk-oseba__zacetnici {
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: clamp(1.75rem, 5vw, 2.5rem);
	font-weight: 800;
	color: var(--wp--preset--color--modra);
	opacity: .55;
	letter-spacing: .02em;
	margin-bottom: 28%;
}

.znk-oseba__stevilka {
	position: absolute;
	right: .85rem;
	bottom: .65rem;
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: clamp(2rem, 4.5vw, 2.75rem);
	font-weight: 800;
	line-height: 1;
	color: var(--wp--preset--color--roza);
	font-variant-numeric: tabular-nums;
	letter-spacing: -.02em;
	transition: transform var(--znk-prehod);
}
.znk-oseba:hover .znk-oseba__stevilka { transform: translateY(-4px); }

.znk-oseba__napis {
	align-self: end;
	justify-self: start;
	width: 100%;
	padding: .9rem 4.25rem .85rem 1rem;
}
.znk-oseba__ime {
	margin: 0;
	color: #fff;
	line-height: 1.15;
}
.znk-oseba__kr-ime {
	display: block;
	font-size: .875rem;
	font-weight: 600;
	color: rgba(255, 255, 255, .82);
}
.znk-oseba__priimek {
	display: block;
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: clamp(1.15rem, 2vw, 1.4rem);
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .01em;
}
.znk-oseba__vloga {
	margin: .3rem 0 0;
	font-size: .6875rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .66);
}
.znk-oseba__opis { margin: .6rem 0 0; font-size: var(--wp--preset--font-size--drobno); color: var(--wp--preset--color--tiha); }
.znk-temno .znk-oseba__opis { color: var(--wp--preset--color--tiha-na-temni); }

/* ==========================================================================
   12. Sponzorji
   ========================================================================== */

.znk-sponzorji {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: center;
	gap: clamp(1.25rem, 3vw, 2.5rem);
	margin: 0;
	padding: 0;
	list-style: none;
}
@media (min-width: 600px) { .znk-sponzorji { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .znk-sponzorji--trak { grid-template-columns: repeat(7, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .znk-sponzorji--mreza { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.znk-sponzor { display: flex; align-items: center; justify-content: center; }
.znk-sponzor a,
.znk-sponzor > img,
.znk-sponzor > .znk-sponzor__ime-nadomestek {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 56px;
	width: 100%;
	padding: .25rem;
	border-radius: var(--znk-r-s);
}
.znk-sponzor img {
	max-height: 52px;
	width: auto;
	max-width: 100%;
	object-fit: contain;
	filter: grayscale(100%);
	opacity: .75;
	transition: filter var(--znk-prehod), opacity var(--znk-prehod);
	border-radius: 0;
}
.znk-sponzor a:hover img,
.znk-sponzor a:focus-visible img { filter: none; opacity: 1; }
.znk-sponzor--glavni img { max-height: 74px; opacity: .9; }
.znk-sponzor__ime-nadomestek { font-weight: 700; color: var(--wp--preset--color--tiha); }

.znk-temno .znk-sponzor img { filter: grayscale(100%) brightness(2.4); opacity: .72; }
.znk-temno .znk-sponzor a:hover img { filter: none; opacity: 1; }

/* ==========================================================================
   13. Za mlade in informacijske škatle
   ========================================================================== */

.znk-dvojka {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: clamp(1.5rem, 4vw, 3.5rem);
	align-items: start;
}
@media (min-width: 860px) { .znk-dvojka { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.znk-dvojka img { width: 100%; border-radius: var(--znk-r-l); display: block; }
.znk-dvojka--obrnjena .znk-dvojka__slika { order: 2; }
@media (max-width: 859px) { .znk-dvojka--obrnjena .znk-dvojka__slika { order: 0; } }

.znk-seznam-kljukic { list-style: none; padding: 0; margin: 1.25rem 0; }
.znk-seznam-kljukic li { position: relative; padding-left: 1.9rem; margin-bottom: .7rem; }
.znk-seznam-kljukic li::before {
	content: '';
	position: absolute;
	left: 0;
	top: .45em;
	width: 12px; height: 7px;
	border-left: 2.5px solid var(--wp--preset--color--roza);
	border-bottom: 2.5px solid var(--wp--preset--color--roza);
	transform: rotate(-45deg);
}

.znk-ponudba {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: clamp(1rem, 2vw, 1.5rem);
}
@media (min-width: 760px) { .znk-ponudba { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.znk-skatla {
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--wp--preset--color--obroba);
	border-radius: var(--znk-r-l);
	padding: clamp(1.5rem, 3vw, 2.25rem);
	height: 100%;
}
.znk-skatla--mehka { background: var(--wp--preset--color--ozadje); border-color: transparent; }
.znk-skatla > :first-child { margin-top: 0; }
.znk-skatla > :last-child { margin-bottom: 0; }
.znk-skatla__dno { margin-top: auto; padding-top: 1.5rem; }

.znk-podatki { margin: 0; }
.znk-podatki__vrstica {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: .1rem;
	padding: .7rem 0;
	border-top: 1px solid var(--wp--preset--color--obroba);
}
.znk-podatki__vrstica:first-child { border-top: 0; padding-top: 0; }
@media (min-width: 560px) {
	.znk-podatki__vrstica { grid-template-columns: 13rem minmax(0, 1fr); gap: 1rem; align-items: baseline; }
}
.znk-podatki dt { font-size: var(--wp--preset--font-size--drobno); font-weight: 700; color: var(--wp--preset--color--tiha); margin: 0; }
.znk-podatki dd { margin: 0; }
.znk-temno .znk-podatki__vrstica { border-top-color: rgba(255,255,255,.14); }
.znk-temno .znk-podatki dt { color: var(--wp--preset--color--tiha-na-temni); }

/* ==========================================================================
   14. Vrednote, galerija, številke
   ========================================================================== */

.znk-vrednote {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: clamp(1rem, 2vw, 1.5rem);
	margin: 0; padding: 0; list-style: none;
}
@media (min-width: 760px) { .znk-vrednote { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.znk-vrednota {
	position: relative;
	display: flex;
	border-radius: var(--znk-r-l);
	overflow: hidden;
	min-height: 340px;
	isolation: isolate;
}
.znk-vrednota img {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
	border-radius: 0;
	z-index: -2;
	filter: grayscale(100%) brightness(.8);
}
.znk-vrednota::after {
	content: '';
	position: absolute; inset: 0; z-index: -1;
	background: var(--wp--preset--gradient--pod-napisom);
}
.znk-vrednota__besedilo {
	margin-top: auto;
	padding: clamp(1.25rem, 3vw, 1.75rem);
	color: #fff;
}
.znk-vrednota__besedilo strong {
	display: block;
	font-size: var(--wp--preset--font-size--naslov-m);
	font-weight: 800;
	margin-bottom: .35rem;
}

.znk-galerija {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(.75rem, 1.5vw, 1rem);
	margin: 0; padding: 0; list-style: none;
}
@media (min-width: 760px) { .znk-galerija { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.znk-galerija img,
.znk-galerija > li > * {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--znk-r-m);
	display: block;
}

.znk-vdelava {
	position: relative;
	aspect-ratio: 16 / 9;
	border-radius: var(--znk-r-m);
	overflow: hidden;
	background: #000;
}
.znk-vdelava iframe,
.znk-vdelava img { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; object-fit: cover; }

/* Fasada za YouTube: sličica se naloži takoj, predvajalnik šele ob kliku. */
.znk-fasada {
	position: absolute;
	inset: 0;
	width: 100%;
	cursor: pointer;
	border: 0;
	padding: 0;
	background: none;
	display: block;
}
.znk-fasada__gumb {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	background: rgba(6, 15, 38, .25);
	transition: background var(--znk-prehod);
}
.znk-fasada:hover .znk-fasada__gumb { background: rgba(6, 15, 38, .1); }
.znk-fasada__gumb span {
	width: 68px; height: 48px;
	border-radius: 14px;
	background: rgba(6, 15, 38, .82);
	display: grid;
	place-items: center;
	transition: background var(--znk-prehod), transform var(--znk-prehod);
}
.znk-fasada:hover .znk-fasada__gumb span,
.znk-fasada:focus-visible .znk-fasada__gumb span {
	background: var(--wp--preset--color--roza-temna);
	transform: scale(1.07);
}
.znk-fasada__gumb span::after {
	content: '';
	width: 0; height: 0;
	border-left: 17px solid #fff;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	margin-left: 4px;
}
.znk-stevilke {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(1rem, 2.5vw, 2rem);
	margin: 0; padding: 0; list-style: none;
}
@media (min-width: 760px) { .znk-stevilke { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.znk-stevilka { text-align: left; }
.znk-stevilka b {
	display: block;
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: clamp(1.875rem, 3vw, 2.375rem);
	font-weight: 800;
	line-height: 1.08;
	letter-spacing: -.015em;
	text-wrap: balance;
	color: var(--wp--preset--color--roza-temna);
}
.znk-stevilka span {
	display: block;
	margin-top: .4rem;
	font-weight: 600;
	color: var(--wp--preset--color--tiha);
}
.znk-temno .znk-stevilka span { color: var(--wp--preset--color--tiha-na-temni); }

.znk-navedek {
	margin: 0 0 clamp(2rem, 4vw, 3rem);
	max-width: 26ch;
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: var(--wp--preset--font-size--naslov-l);
	font-weight: 700;
	line-height: 1.22;
	letter-spacing: -.008em;
	text-wrap: balance;
}

/* ==========================================================================
   15. Novica
   ========================================================================== */

.znk-novica { background: #fff; }

.znk-novica__glava { padding-block: clamp(1.5rem, 3vw, 2.5rem) clamp(1.25rem, 2.5vw, 2rem); }
.znk-novica__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .5rem 1rem;
	margin: 0 0 1rem;
	font-size: var(--wp--preset--font-size--drobno);
	font-weight: 600;
	color: var(--wp--preset--color--tiha);
}
.znk-novica h1 { margin: 0; font-size: var(--wp--preset--font-size--naslov-xl); text-wrap: balance; }

.znk-novica__slika {
	position: relative;
	margin: 0 0 clamp(1.75rem, 3.5vw, 2.5rem);
	border-radius: var(--znk-r-l);
	overflow: hidden;
	isolation: isolate;
}
.znk-novica__slika img {
	width: 100%;
	max-height: min(62vh, 560px);
	object-fit: cover;
	display: block;
	border-radius: 0;
}

/* Pokončna naslovnica stoji na sredini širokega odra; polnilo za njo je
   ista slika, zamegljena, da oder ni prazen in da se plakata ne reže. */
.znk-novica__slika--pokoncna {
	aspect-ratio: 16 / 9;
	max-height: min(62vh, 560px);
}
.znk-novica__slika--pokoncna img {
	position: relative;
	width: auto;
	height: 100%;
	max-width: 100%;
	margin-inline: auto;
	object-fit: contain;
}
.znk-novica__polnilo {
	position: absolute;
	inset: 0;
	z-index: -1;
	background-size: cover;
	background-position: center;
	filter: blur(32px) saturate(1.25) brightness(.72);
	transform: scale(1.15);
}

.znk-vsebina { font-size: var(--wp--preset--font-size--veliko); line-height: 1.72; }
.znk-vsebina > * + * { margin-top: 1.3em; }
.znk-vsebina > h2 { margin-top: 2em; font-size: var(--wp--preset--font-size--naslov-m); }
.znk-vsebina > h3 { margin-top: 1.7em; font-size: var(--wp--preset--font-size--naslov-s); }
.znk-vsebina :is(ul, ol) { padding-left: 1.35em; }
.znk-vsebina li + li { margin-top: .45em; }
.znk-vsebina img { border-radius: var(--znk-r-m); display: block; margin-inline: auto; }
.znk-vsebina figure { margin: 2em 0; }
.znk-vsebina figcaption {
	margin-top: .6rem;
	font-size: var(--wp--preset--font-size--drobno);
	color: var(--wp--preset--color--tiha);
	text-align: center;
}
.znk-vsebina a { color: var(--wp--preset--color--modra-temna); text-underline-offset: 3px; }
/* Gumb sredi besedila obdrži svojo barvo, sicer je moder na modrem. */
.znk-vsebina a.znk-gumb { text-decoration: none; }
.znk-vsebina a.znk-gumb--glavni { color: #fff; }
.znk-vsebina a.znk-gumb--drugotni { color: var(--wp--preset--color--temna); }
.znk-vsebina a.znk-gumb--drugotni:hover { color: #fff; }
.znk-vsebina blockquote {
	margin: 2em 0;
	padding-left: 1.35rem;
	border-left: 3px solid var(--wp--preset--color--roza);
	font-size: var(--wp--preset--font-size--uvod);
	font-weight: 600;
}

.znk-deli {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .75rem;
	margin-top: clamp(2rem, 4vw, 3rem);
	padding-top: 1.5rem;
	border-top: 1px solid var(--wp--preset--color--obroba);
}
.znk-deli__oznaka { font-weight: 700; font-size: var(--wp--preset--font-size--drobno); color: var(--wp--preset--color--tiha); margin-right: .25rem; }
.znk-deli a,
.znk-deli .znk-kopiraj {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	min-width: var(--znk-tarca);
	min-height: var(--znk-tarca);
	padding: 0 1rem;
	border: 1px solid var(--wp--preset--color--obroba);
	border-radius: var(--znk-r-polna);
	font-size: .875rem;
	font-weight: 700;
	color: var(--wp--preset--color--temna);
	text-decoration: none;
}
.znk-ikona { display: block; flex: none; }
.znk-deli a:hover,
.znk-deli .znk-kopiraj:hover { background: var(--wp--preset--color--temna); color: #fff; border-color: var(--wp--preset--color--temna); }
.znk-deli .znk-kopiraj { background: none; font-family: inherit; cursor: pointer; }

.znk-krmarjenje {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 1rem;
	margin-top: clamp(2rem, 4vw, 3rem);
	padding-top: 1.5rem;
	border-top: 1px solid var(--wp--preset--color--obroba);
}
@media (min-width: 720px) { .znk-krmarjenje { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.znk-krmarjenje__polje {
	display: flex;
	flex-direction: column;
	gap: .3rem;
	padding: 1rem 1.25rem;
	border: 1px solid var(--wp--preset--color--obroba);
	border-radius: var(--znk-r-m);
	text-decoration: none;
	color: inherit;
	min-height: var(--znk-tarca);
	transition: border-color var(--znk-prehod), background var(--znk-prehod);
}
.znk-krmarjenje__polje:hover { border-color: var(--wp--preset--color--modra); background: var(--wp--preset--color--ozadje); }
.znk-krmarjenje__smer {
	font-size: var(--wp--preset--font-size--drobno);
	font-weight: 700;
	color: var(--wp--preset--color--modra-temna);
	letter-spacing: .04em;
	text-transform: uppercase;
}
.znk-krmarjenje__naslov {
	font-weight: 700;
	line-height: 1.3;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.znk-krmarjenje__polje--naprej { text-align: right; align-items: flex-end; }

/* Zaključni poziv */

.znk-poziv {
	position: relative;
	display: grid;
	place-items: center;
	min-height: min(52vh, 460px);
	overflow: hidden;
	text-align: center;
	isolation: isolate;
	background: var(--wp--preset--color--temna);
}
.znk-poziv__medij { position: absolute; inset: 0; z-index: -2; max-width: none; margin: 0; }
.znk-poziv__medij img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 0; }
.znk-poziv::after {
	content: '';
	position: absolute; inset: 0; z-index: -1;
	background: var(--wp--preset--gradient--cez-poziv);
}
.znk-poziv__vsebina { position: relative; padding-block: clamp(3rem, 7vw, 5rem); color: #fff; max-width: 44rem; margin-inline: auto; }
.znk-poziv h2 { color: #fff; margin: 0; font-size: var(--wp--preset--font-size--naslov-l); text-wrap: balance; }
.znk-poziv p { color: #fff; margin: .85rem 0 0; font-size: var(--wp--preset--font-size--veliko); }
.znk-poziv .znk-gumbi { margin-top: 1.75rem; }

/* ==========================================================================
   16. Noga
   ========================================================================== */

.znk-noga { background: var(--wp--preset--color--temna); color: var(--wp--preset--color--tiha-na-temni); }
.znk-noga a { color: var(--wp--preset--color--tiha-na-temni); text-decoration: none; }
.znk-noga a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }

.znk-noga__mreza {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: clamp(1.75rem, 3.5vw, 2.5rem);
	padding-block: clamp(2.25rem, 4.5vw, 3.25rem) 1.5rem;
}
@media (min-width: 640px) { .znk-noga__mreza { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .znk-noga__mreza { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1.1fr) minmax(0, 1.1fr); } }

.znk-noga__naslov {
	margin: 0 0 1rem;
	font-size: var(--wp--preset--font-size--drobno);
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: #fff;
}
.znk-noga ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .55rem; }
.znk-noga li a { display: inline-flex; align-items: center; padding-block: .15rem; }

.znk-noga__znamka { display: inline-flex; align-items: center; gap: .65rem; margin-bottom: 1rem; }
.znk-noga__znamka img { width: 40px; height: 40px; object-fit: contain; }
.znk-noga__znamka span { font-size: 1.0625rem; font-weight: 800; color: #fff; }
.znk-noga__opis { margin: 0 0 1.25rem; max-width: 34ch; }

.znk-noga__dno {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding-block: 1.15rem;
	border-top: 1px solid rgba(255, 255, 255, .12);
	font-size: var(--wp--preset--font-size--drobno);
}

.znk-omrezja { display: flex; flex-wrap: wrap; gap: .6rem; }
.znk-omrezja a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--znk-tarca);
	height: var(--znk-tarca);
	border: 1px solid rgba(255, 255, 255, .2);
	border-radius: 50%;
	transition: background var(--znk-prehod), color var(--znk-prehod), border-color var(--znk-prehod), transform var(--znk-prehod);
}
.znk-omrezja a:hover { background: #fff; color: var(--wp--preset--color--temna); border-color: #fff; text-decoration: none; transform: translateY(-2px); }

/* ==========================================================================
   17. Obrazci in iskanje
   ========================================================================== */

.znk-iskanje { display: flex; gap: .5rem; max-width: 26rem; }
.znk-iskanje input[type="search"] {
	flex: 1;
	min-height: 52px;
	padding: 0 1.1rem;
	border: 1px solid #8a93a5;
	border-radius: var(--znk-r-polna);
	background: #fff;
	font: inherit;
	color: inherit;
}
.znk-iskanje input[type="search"]::placeholder { color: var(--wp--preset--color--tiha); }
.znk-temno .znk-iskanje input[type="search"] {
	background: rgba(255,255,255,.08);
	border-color: rgba(255,255,255,.2);
	color: #fff;
}
.znk-temno .znk-iskanje input[type="search"]::placeholder { color: var(--wp--preset--color--tiha-na-temni); }

.wp-block-query-pagination { margin-top: clamp(2.5rem, 5vw, 3.5rem); justify-content: center; gap: .5rem; }
.wp-block-query-pagination a,
.wp-block-query-pagination .current {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: var(--znk-tarca);
	min-height: var(--znk-tarca);
	padding: 0 .85rem;
	border-radius: var(--znk-r-polna);
	text-decoration: none;
	font-weight: 700;
}
.wp-block-query-pagination a:hover { background: var(--wp--preset--color--ozadje); }
.wp-block-query-pagination .current { background: var(--wp--preset--color--temna); color: #fff; }

/* ==========================================================================
   18. Prazna stanja in opombe
   ========================================================================== */

.znk-prazno {
	padding: clamp(2rem, 4vw, 3rem);
	border: 1px dashed var(--wp--preset--color--obroba);
	border-radius: var(--znk-r-l);
	text-align: center;
	color: var(--wp--preset--color--tiha);
}

.znk-opomba-urednika {
	margin: 1rem 0;
	padding: 1rem 1.25rem;
	border-left: 3px solid var(--wp--preset--color--modra);
	background: var(--wp--preset--color--modra-bleda);
	border-radius: 0 var(--znk-r-s) var(--znk-r-s) 0;
	color: var(--wp--preset--color--temna);
	font-size: var(--wp--preset--font-size--drobno);
}

/* ==========================================================================
   19. Tisk
   ========================================================================== */

@media print {
	.znk-glava, .znk-noga, .znk-deli, .znk-krmarjenje, .znk-razdelek--tekme, .znk-fasada { display: none !important; }
	body { background: #fff; color: #000; }
	.znk-novica { background: #fff; }
	a[href^="http"]::after { content: " (" attr(href) ")"; font-size: .8em; }
}

/* ==========================================================================
   20. Dotik in pritisk
   ========================================================================== */

.znk-gumb:active,
.wp-block-button__link:active,
.znk-kartica__povezava:active,
.znk-krmarjenje__polje:active { transform: translateY(1px); }

.znk-noga a:active,
.znk-drobtine a:active { opacity: .7; }

/* Na zaslonih na dotik ni preleta, zato logotipi ne smejo ostati sivi. */
@media (hover: none) {
	.znk-sponzor img { filter: none; opacity: 1; }
	.znk-vrednota img { filter: grayscale(100%) brightness(.85); }
}

/* ==========================================================================
   21. Junak kot jedrni blok Pokrivalo
   ==========================================================================
   Fotografijo klub zamenja z gumbom »Zamenjaj« v urejevalniku, zato je junak
   navaden blok Pokrivalo, ne lasten HTML. */

.znk-junak.wp-block-cover {
	align-items: flex-end;
	padding: 0;
	margin-top: calc(-1 * var(--znk-glava));
	min-height: 100vh;
	isolation: isolate;
}
/* Junak sega čez cel zaslon ne glede na velikost. Enota svh upošteva vrstico
   mobilnega brskalnika; !important je potreben, ker jedro višino iz
   urejevalnika vpiše kot slog v vrstici. */
@supports (height: 100svh) {
	.znk-junak.wp-block-cover { min-height: 100svh !important; }
}
.znk-junak.wp-block-cover .wp-block-cover__image-background {
	object-position: center 30%;
	border-radius: 0;
}
.znk-junak.wp-block-cover .wp-block-cover__background {
	/* !important, ker jedro na ta element vpiše inline background-color,
	   ki bi sicer kot neprosojna podlaga preliva skril fotografijo. */
	background: var(--wp--preset--gradient--cez-fotografijo) !important;
	opacity: 1;
}
.znk-junak.wp-block-cover .wp-block-cover__inner-container {
	width: 100%;
	max-width: var(--znk-sirina);
	margin-inline: auto;
	padding: calc(var(--znk-glava) + clamp(3rem, 8vw, 5rem)) var(--znk-rob) clamp(2.5rem, 6vw, 4rem);
	color: #fff;
}
.znk-junak.wp-block-cover :is(h1, h2, p, li) { color: #fff; }
.znk-junak.wp-block-cover h1 {
	margin: 0;
	max-width: 20ch;
	font-size: var(--wp--preset--font-size--prikaz);
	text-wrap: balance;
}
.znk-junak.wp-block-cover .wp-block-buttons { margin-top: 2rem; gap: .75rem; }

/* Naslov junaka se razkrije črko po črki; črke ovije inc/bloki-vsebina.php. */
.znk-junak .znk-beseda { display: inline-block; white-space: nowrap; }
@media (prefers-reduced-motion: no-preference) {
	.znk-junak .znk-crka {
		display: inline-block;
		animation: znk-razkrij .65s cubic-bezier(.2, .65, .25, 1) both;
		animation-delay: calc(var(--zamik) * 28ms);
	}
}
@keyframes znk-razkrij {
	from { opacity: 0; filter: blur(6px); transform: scale(1.4); }
}

/* Vrstica dejstev pod naslovom */
.znk-dejstva {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .4rem 1rem;
	margin: 1.1rem 0 0;
	font-weight: 600;
	color: rgba(255, 255, 255, .92);
}
.znk-dejstva span { display: inline-flex; align-items: center; gap: 1rem; }
.znk-dejstva span + span::before {
	content: '';
	flex: none;
	width: 5px; height: 5px;
	border-radius: 50%;
	background: var(--wp--preset--color--modra);
	margin-left: -.5rem;
	margin-right: .5rem;
}
.znk-dejstva span { gap: 0; }

/* Kartice v razdelku Za mlade */
.znk-ponudba-mladi { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(1rem, 2vw, 1.5rem); }
@media (min-width: 760px) { .znk-ponudba-mladi { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.znk-kartica-ponudbe {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border-radius: var(--znk-r-l);
	background: var(--wp--preset--color--ozadje);
	height: 100%;
}
.znk-kartica-ponudbe__slika { aspect-ratio: 16 / 9; }
.znk-kartica-ponudbe__slika img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 0; }
.znk-kartica-ponudbe__telo { display: flex; flex-direction: column; flex: 1; padding: clamp(1.35rem, 3vw, 2rem); }
.znk-kartica-ponudbe h3 { margin: 0 0 .5rem; }
.znk-kartica-ponudbe p { margin: 0 0 1rem; color: var(--wp--preset--color--tiha); }
.znk-kartica-ponudbe .znk-seznam-kljukic { margin: 0 0 1.5rem; }
.znk-kartica-ponudbe .znk-seznam-kljukic li { margin-bottom: .45rem; font-size: var(--wp--preset--font-size--drobno); }
.znk-kartica-ponudbe .znk-gumb { align-self: flex-start; margin-top: auto; }

/* Posnetki */
.znk-posnetki {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: clamp(1rem, 2vw, 1.5rem);
	margin: 0; padding: 0; list-style: none;
}
@media (min-width: 700px) { .znk-posnetki { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.znk-video {
	max-width: 380px;
	margin: clamp(1.5rem, 3vw, 2.5rem) auto 0;
	border-radius: var(--znk-r-l);
	overflow: hidden;
	background: #000;
	box-shadow: 0 24px 60px rgba(0, 0, 0, .45);
}
.znk-video video { width: 100%; aspect-ratio: 480 / 848; display: block; }
.znk-video figcaption {
	padding: .85rem 1rem;
	text-align: center;
	font-size: var(--wp--preset--font-size--drobno);
	color: var(--wp--preset--color--tiha-na-temni);
	background: rgba(255, 255, 255, .05);
}

/* Na širokih zaslonih stojita geslo in posnetek drug ob drugem,
   da navpični posnetek ne visi sam sredi praznega pasu. */
@media (min-width: 880px) {
	.znk-temno .znk-vsebnik:has(> .znk-video, > * > .znk-video) {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 380px;
		align-items: center;
		column-gap: clamp(2.5rem, 6vw, 5rem);
	}
	.znk-temno .znk-vsebnik:has(.znk-video) .znk-navedek {
		margin: 0;
		text-align: left;
		max-width: 18ch;
		font-size: var(--wp--preset--font-size--naslov-l);
		justify-self: end;
	}
	.znk-temno .znk-vsebnik:has(.znk-video) .znk-video { margin: 0; }
}

/* Vrednote kot jedrna Pokrivala */
.znk-vrednote-mreza .wp-block-column { display: flex; }
.znk-vrednota.wp-block-cover {
	width: 100%;
	min-height: 340px;
	border-radius: var(--znk-r-l);
	align-items: flex-end;
	padding: clamp(1.25rem, 3vw, 1.75rem);
}
.znk-vrednota.wp-block-cover .wp-block-cover__background {
	/* !important iz istega razloga kot pri junaku: inline background-color. */
	background: var(--wp--preset--gradient--pod-napisom) !important;
	opacity: 1;
}
.znk-vrednota.wp-block-cover .wp-block-cover__image-background { filter: grayscale(100%) brightness(.85); }
.znk-vrednota.wp-block-cover :is(h3, p) { color: #fff; }
.znk-vrednota.wp-block-cover h3 { margin: 0 0 .35rem; font-size: var(--wp--preset--font-size--naslov-m); }
.znk-vrednota.wp-block-cover p { margin: 0; font-size: var(--wp--preset--font-size--drobno); }

/* Koda za nakazilo donacije */
.znk-koda { display: inline-block; margin-top: 1rem; }
.znk-koda img {
	width: 168px;
	height: auto;
	background: #fff;
	padding: 8px;
	border-radius: var(--znk-r-s);
	border: 1px solid var(--wp--preset--color--obroba);
}


/* ==========================================================================
   22. Svetlobna galerija
   ==========================================================================
   Klik na fotografijo v galeriji jo odpre čez cel zaslon, puščici listata,
   Esc zapre. Velja povsod, kjer je več fotografij skupaj. */

.znk-galerija img,
.wp-block-gallery img { cursor: zoom-in; }

.znk-svetloba {
	position: fixed;
	inset: 0;
	z-index: 999;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(6, 15, 38, .95);
	padding: clamp(3.5rem, 9vh, 5rem) clamp(3.75rem, 9vw, 6.5rem);
}
.znk-svetloba[hidden] { display: none; }

.znk-svetloba img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	object-fit: contain;
	border-radius: var(--znk-r-s);
	box-shadow: 0 30px 80px rgba(0, 0, 0, .5);
}

.znk-svetloba__gumb {
	position: absolute;
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, .12);
	color: #fff;
	cursor: pointer;
	transition: background var(--znk-prehod), transform var(--znk-prehod);
}
.znk-svetloba__gumb:hover { background: var(--wp--preset--color--roza-temna); }
.znk-svetloba__gumb:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.znk-svetloba__gumb[disabled] { opacity: 0; pointer-events: none; }

.znk-svetloba__zapri { top: .9rem; right: .9rem; }
.znk-svetloba__nazaj { left: .8rem; top: 50%; transform: translateY(-50%); }
.znk-svetloba__naprej { right: .8rem; top: 50%; transform: translateY(-50%); }

.znk-svetloba__stevec {
	position: absolute;
	left: 50%;
	bottom: 1rem;
	transform: translateX(-50%);
	color: rgba(255, 255, 255, .85);
	font-size: var(--wp--preset--font-size--drobno);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

html.znk-brez-pomika { overflow: hidden; }

@media (max-width: 600px) {
	.znk-svetloba { padding: 3.5rem .5rem 3rem; }
	.znk-svetloba__nazaj { left: .3rem; }
	.znk-svetloba__naprej { right: .3rem; }
}

/* ==========================================================================
   23. Podpora klubu in starostne skupine
   ========================================================================== */

/* Naslovnica: povabilo sponzorjem z uspehi na levi in donacijsko kartico desno. */
.znk-podpora {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: clamp(1.5rem, 3.5vw, 3.5rem);
	align-items: start;
	margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
}
@media (min-width: 940px) { .znk-podpora { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); } }

.znk-podpora__uvod {
	margin: 0 0 clamp(1.5rem, 3vw, 2rem);
	max-width: 52ch;
	font-size: var(--wp--preset--font-size--uvod);
}
.znk-podpora .znk-stevilke { margin: 0 0 clamp(1.75rem, 3vw, 2.25rem); }

.znk-podpora__donacija { width: 100%; max-width: 460px; }
@media (min-width: 940px) { .znk-podpora__donacija { justify-self: end; } }
.znk-podpora__donacija > p { color: var(--wp--preset--color--tiha); margin: .5rem 0 1.25rem; }
.znk-podpora__donacija .znk-koda { margin: 0 0 1.25rem; }

/* QR koda je majhna bitna slika; pri povečavi mora ostati ostra. */
.znk-koda img { image-rendering: pixelated; }

/* Za mlade: starostne skupine mladinske šole. */
.znk-skupine__uvod {
	margin: 0 0 clamp(1.5rem, 3vw, 2rem);
	max-width: 62ch;
	font-size: var(--wp--preset--font-size--veliko);
}
@media (min-width: 1000px) { .znk-ponudba--stiri { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(1rem, 1.5vw, 1.25rem); } }

.znk-skupina h3 {
	margin: 0;
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: 1.4rem;
	letter-spacing: -.01em;
}
.znk-skupina__letniki {
	margin: .9rem 0 0;
	font-family: var(--wp--preset--font-family--bricolage);
	font-weight: 800;
	font-size: 1.25rem;
	letter-spacing: -.01em;
}
.znk-skupina__letniki span {
	display: block;
	margin-bottom: .3rem;
	font-family: var(--wp--preset--font-family--manrope);
	font-size: .6875rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--tiha);
}
.znk-skupina__vloga {
	margin: .75rem 0 0;
	font-size: var(--wp--preset--font-size--drobno);
	color: var(--wp--preset--color--tiha);
}
.znk-skupine__kontakt { margin: clamp(1.5rem, 3vw, 2rem) 0 0; font-weight: 600; }

/* ==========================================================================
   24. Zadnja tekma v junaku, barvne vrednote, potujoči trak partnerjev
   ========================================================================== */

/* Kompaktna kartica zadnje tekme: tekmovanje, ekipi, rezultat. */
.znk-tekma--zadnja { gap: .8rem; padding: 1.1rem 1.25rem 1.2rem; }
.znk-tekma--zadnja .znk-tekma__oznaka {
	font-size: .6875rem;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--roza-temna);
}
.znk-tekma--zadnja .znk-grb,
.znk-tekma--zadnja .znk-grb--prazen { width: 42px; height: 42px; }
.znk-tekma--zadnja .znk-grb--prazen { font-size: .75rem; }
.znk-tekma--zadnja .znk-tekma__rezultat { font-size: clamp(1.75rem, 3vw, 2.125rem); }
.znk-tekma--zadnja .znk-tekma__ime { font-size: .8125rem; }

/* V junaku kartica lebdi desno spodaj; na ožjih zaslonih se postavi
   pod gumbe, da ne prekriva naslova. Steklen videz sledi gumbu Podpri klub. */
.znk-tekma--lebdeca {
	color: #fff;
	background: rgba(255, 255, 255, .08);
	border-color: rgba(255, 255, 255, .3);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	box-shadow: 0 22px 60px rgba(6, 15, 38, .35);
}
.znk-tekma--lebdeca .znk-tekma__oznaka { color: color-mix(in srgb, var(--wp--preset--color--roza) 55%, #fff); }
.znk-tekma--lebdeca .znk-tekma__tekmovanje { color: rgba(255, 255, 255, .72); }
.znk-tekma--lebdeca .znk-tekma__ime { color: rgba(255, 255, 255, .85); }
.znk-tekma--lebdeca .znk-tekma__ekipa--nasa .znk-tekma__ime,
.znk-tekma--lebdeca .znk-tekma__rezultat { color: #fff; }
.znk-tekma--lebdeca .znk-tekma__dvopicje { color: rgba(255, 255, 255, .55); }
.znk-tekma--lebdeca .znk-grb--prazen { background: rgba(255, 255, 255, .14); color: #fff; }

@media (min-width: 1100px) {
	.znk-tekma--lebdeca {
		position: absolute;
		right: var(--znk-rob);
		bottom: clamp(2.5rem, 5vw, 3.75rem);
		width: 400px;
	}
}
@media (max-width: 1099px) {
	.znk-tekma--lebdeca {
		position: relative;
		margin-top: 1.9rem;
		width: min(100%, 420px);
	}
}

/* Vrednote: črno-bela fotografija ob preletu oživi v barvah in se približa. */
.znk-vrednota.wp-block-cover { overflow: hidden; }
.znk-vrednota.wp-block-cover .wp-block-cover__image-background {
	transition: filter 450ms ease, transform 650ms cubic-bezier(.2, .7, .3, 1);
}
.znk-vrednota.wp-block-cover:hover .wp-block-cover__image-background,
.znk-vrednota.wp-block-cover:focus-within .wp-block-cover__image-background {
	filter: grayscale(0) brightness(1);
	transform: scale(1.05);
}

/* Partnerji: logotipi neprekinjeno potujejo, ob preletu se trak ustavi. */
.znk-sponzorji-trak {
	display: flex;
	gap: clamp(2.5rem, 6vw, 4.5rem);
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.znk-sponzorji-trak .znk-sponzorji {
	flex: none;
	display: flex;
	align-items: center;
	gap: clamp(2.5rem, 6vw, 4.5rem);
	min-width: max-content;
	animation: znk-trak 36s linear infinite;
}
.znk-sponzorji-trak:hover .znk-sponzorji,
.znk-sponzorji-trak:focus-within .znk-sponzorji { animation-play-state: paused; }
@keyframes znk-trak {
	to { transform: translateX(calc(-100% - clamp(2.5rem, 6vw, 4.5rem))); }
}
@media (prefers-reduced-motion: reduce) {
	.znk-sponzorji-trak { display: block; mask-image: none; -webkit-mask-image: none; }
	.znk-sponzorji-trak .znk-sponzorji { animation: none; flex-wrap: wrap; min-width: 0; }
	.znk-sponzorji-trak .znk-sponzorji[aria-hidden] { display: none; }
}
