/*
Theme Name: Kibertalent
Theme URI: https://kibertalent.si/
Author: Kibertalent
Description: Tema za Kibertalent.si – ECSC, CyberGirls in blog. Klasična tema z blokovnimi vzorci, brez zunanjih odvisnosti in brez build koraka; pisavi Barlow in Barlow Condensed sta v temi.
Version: 1.0.0
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kibertalent
Domain Path: /languages
Tags: custom-menu, featured-images, block-patterns
*/

/* ==========================================================================
   1. Design tokeni – vir resnice je dizajn (design/*.html)
   ========================================================================== */

:root {
	color-scheme: light;

	--kt-bg: #f2f2f3;
	--kt-surface: #e9e9ea;
	--kt-text: #1d1f20;
	--kt-accent: #1fb5c9;
	--kt-divider: color-mix(in srgb, #1d1f20 16%, transparent);

	--kt-n100: #f5f5f8;
	--kt-n600: #7a7a7d;
	--kt-n700: #5d5d60;
	--kt-n800: #424244;

	/* Modrozelena lestvica okoli poudarka #1fb5c9 (a500). Svetli odtenki
	   (a100–a400) so za temne pasove, temni (a600–a800) za svetle sekcije:
	   a700 ima na ozadju kontrast 5,2 : 1, a600 3,5 : 1 (le za velike številke). */
	--kt-a100: #e6f8fa;
	--kt-a300: #9ee3ec;
	--kt-a400: #5ecdda;
	--kt-a500: #1fb5c9;
	--kt-a600: #158e9f;
	--kt-a700: #0e6f7d;
	--kt-a800: #0a4f5a;
	--kt-a900: #0b1525;

	--kt-font: Barlow, system-ui, sans-serif;
	--kt-font-naslov: "Barlow Condensed", system-ui, sans-serif;

	/* Vodoravni rob vsebine: 56 px na namizju, manj na ozkih zaslonih. */
	--kt-rob: clamp(20px, 4vw, 56px);
	--kt-sirina: 1440px;
	--kt-sekcija: clamp(64px, 8vw, 104px);

	/* Barva kotnih oznak okvirja (.kt-okvir); temni pasovi jo prepišejo. */
	--kt-kot: color-mix(in srgb, var(--kt-text) 55%, transparent);
	--kt-glava-h: 68px;
}

/* ==========================================================================
   2. Osnova
   ========================================================================== */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: 24px;
}

body {
	margin: 0;
	min-height: 100vh;
	min-height: 100svh;
	display: flex;
	flex-direction: column;
	background: var(--kt-bg);
	color: var(--kt-text);
	font-family: var(--kt-font);
	font-size: 16px;
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}
body > main { flex: 1 0 auto; }

h1, h2, h3, h4, h5, h6 {
	margin: 0;
	font-family: var(--kt-font-naslov);
	font-weight: 600;
	line-height: 1.05;
	letter-spacing: -0.005em;
}

p { margin: 0; }
img, svg { display: block; max-width: 100%; }
img { height: auto; }
figure { margin: 0; }

a { color: var(--kt-a700); text-underline-offset: 3px; }
a:hover { color: var(--kt-a800); }

:focus { outline: none; }
:focus-visible { outline: 2px solid var(--kt-accent); outline-offset: 2px; }
::selection { background: color-mix(in srgb, var(--kt-accent) 30%, transparent); }

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

.kt-skok {
	position: absolute;
	left: 12px; top: -100px;
	z-index: 100;
	padding: 10px 16px;
	background: var(--kt-bg);
	color: var(--kt-text);
	font-family: var(--kt-font-naslov);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}
.kt-skok:focus { top: 12px; }

.kt-ikona { flex: none; }

/* ==========================================================================
   3. Postavitev
   ========================================================================== */

.kt-ovoj {
	width: 100%;
	max-width: var(--kt-sirina);
	margin-inline: auto;
	padding-inline: var(--kt-rob);
}

.kt-sekcija { padding-block: var(--kt-sekcija) clamp(64px, 7.5vw, 96px); }
.kt-sekcija--crta { border-top: 1px solid var(--kt-divider); }
.kt-sekcija--povrsina { background: var(--kt-surface); }
.kt-sekcija--brez-dna { padding-bottom: 0; }
.kt-sekcija--temna {
	position: relative;
	background: var(--kt-a900);
	color: var(--kt-bg);
}

.kt-dva {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 48px clamp(40px, 5vw, 72px);
	align-items: start;
}
.kt-dva--5-7 { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
.kt-dva--sredina { align-items: center; }

.kt-center { margin-top: 56px; text-align: center; }

@media (max-width: 900px) {
	.kt-dva,
	.kt-dva--5-7 { grid-template-columns: minmax(0, 1fr); }
}

/* ==========================================================================
   4. Blueprint okvir in nadomestki
   Okvir nariše štiri kotne križce iz ene psevdo-plasti (osem črt v ozadju),
   zato ne potrebuje dodatnih elementov in deluje tudi na blokih.
   ========================================================================== */

.kt-okvir { position: relative; }
.kt-okvir::before {
	content: "";
	position: absolute;
	inset: -6px;
	z-index: 1;
	pointer-events: none;
	--l: linear-gradient(var(--kt-kot), var(--kt-kot));
	background:
		var(--l) left 0 top 5px / 11px 1px no-repeat,
		var(--l) left 5px top 0 / 1px 11px no-repeat,
		var(--l) right 0 top 5px / 11px 1px no-repeat,
		var(--l) right 5px top 0 / 1px 11px no-repeat,
		var(--l) left 0 bottom 5px / 11px 1px no-repeat,
		var(--l) left 5px bottom 0 / 1px 11px no-repeat,
		var(--l) right 0 bottom 5px / 11px 1px no-repeat,
		var(--l) right 5px bottom 0 / 1px 11px no-repeat;
}

.kt-glava,
.kt-hero,
.kt-sekcija--temna {
	--kt-kot: var(--kt-a400);
}

/* Duotone: fotografija dobi ton poudarka; ob prehodu z miško se odstrani. */
.kt-duotone { position: relative; display: block; }
.kt-duotone::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: var(--kt-accent);
	mix-blend-mode: color;
	transition: opacity 0.3s ease;
}
.kt-duotone:has(> .kt-nadomestek)::after { display: none; }
a.kt-duotone { text-decoration: none; }
a.kt-duotone:hover::after,
.kt-kartica:hover .kt-duotone::after,
.kt-izpostavljena:hover .kt-duotone::after { opacity: 0; }

.kt-nadomestek {
	display: grid;
	place-items: center;
	width: 100%;
	height: 100%;
	padding: 1em;
	background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--kt-accent) 14%, transparent) 0 1px, transparent 1px 10px);
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-align: center;
	color: var(--kt-n700);
}

/* ==========================================================================
   5. Tipografski gradniki
   ========================================================================== */

.kt-nadnaslov {
	margin-bottom: 24px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--kt-a300);
}

.kt-oznaka {
	margin: 0 0 24px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--kt-divider);
	font-family: var(--kt-font);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.55;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--kt-a700);
}
.kt-oznaka--brez-crte { padding-bottom: 0; border-bottom: 0; }

.kt-naslov {
	margin: 0;
	font-size: clamp(36px, 1.6rem + 2.6vw, 56px);
	line-height: 1;
	text-transform: uppercase;
	text-wrap: balance;
}
.kt-naslov--velik { font-size: clamp(42px, 1.6rem + 3vw, 60px); line-height: 0.95; }
.kt-naslov--manjsi { font-size: clamp(28px, 1.2rem + 1.4vw, 36px); }
.kt-naslov--z-razmikom { margin-bottom: 48px; }

.kt-podnaslov {
	margin-bottom: 8px;
	font-size: 22px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.kt-uvod {
	margin-top: 20px;
	font-size: 16px;
	line-height: 1.6;
	color: color-mix(in srgb, var(--kt-text) 78%, transparent);
	text-wrap: pretty;
}
.kt-uvod strong { color: var(--kt-text); }
.kt-glava-sekcije .kt-uvod { max-width: 46ch; }

.kt-kicker {
	font-size: 12px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--kt-a700);
}

.kt-poudarek { color: var(--kt-a400); }

.kt-sekcija--temna .kt-uvod {
	max-width: 40ch;
	margin-top: 28px;
	color: color-mix(in srgb, var(--kt-bg) 78%, transparent);
}

.kt-glava-sekcije { margin-bottom: 56px; }
.kt-glava-sekcije--krmilje {
	display: flex;
	align-items: flex-end;
	gap: 24px;
	margin-bottom: 48px;
}
.kt-glava-sekcije--krmilje > :first-child { flex: 1; min-width: 0; }

/* ==========================================================================
   6. Gumbi in vnosna polja
   ========================================================================== */

.kt-gumb,
.wp-block-button > .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 13px 22px;
	border: 1px solid var(--kt-divider);
	border-radius: 0;
	background: transparent;
	color: var(--kt-text);
	font-family: var(--kt-font-naslov);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.kt-gumb:disabled { opacity: 0.45; cursor: not-allowed; }

/* Primarni (tudi privzeti gumb bloka brez razreda). */
.kt-gumb--primarni,
.wp-block-button:not(.kt-gumb--obroba) > .wp-block-button__link {
	background: var(--kt-accent);
	border-color: var(--kt-accent);
	color: var(--kt-a900); /* Belo na poudarku ima le 2,4 : 1, temno 7,4 : 1. */
}
.kt-gumb--primarni:hover,
.wp-block-button:not(.kt-gumb--obroba) > .wp-block-button__link:hover {
	background: var(--kt-a400);
	border-color: var(--kt-a400);
	color: var(--kt-a900);
}
.kt-gumb--primarni:active { background: var(--kt-a300); border-color: var(--kt-a300); }

.kt-gumb--obroba:hover,
.wp-block-button.kt-gumb--obroba > .wp-block-button__link:hover {
	background: color-mix(in srgb, var(--kt-text) 7%, transparent);
	color: var(--kt-text);
}

:is(.kt-hero, .kt-sekcija--temna) :is(.kt-gumb--obroba, .wp-block-button.kt-gumb--obroba > .wp-block-button__link) {
	color: var(--kt-bg);
	border-color: color-mix(in srgb, var(--kt-a400) 45%, transparent);
}
:is(.kt-hero, .kt-sekcija--temna) :is(.kt-gumb--obroba, .wp-block-button.kt-gumb--obroba > .wp-block-button__link):hover {
	background: color-mix(in srgb, var(--kt-a400) 16%, transparent);
	color: var(--kt-bg);
}

.kt-gumb--ikona { width: 36px; height: 36px; padding: 0; }

.wp-block-buttons.kt-gumbi {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: 36px;
}
.kt-deljeno .wp-block-buttons.kt-gumbi { margin-top: 24px; }
.kt-deljeno .wp-block-button > .wp-block-button__link { padding: 12px 20px; font-size: 15px; }

.kt-vnos {
	width: 100%;
	min-height: 44px;
	padding: 6px 12px;
	border: 1px solid var(--kt-divider);
	border-radius: 0;
	background: var(--kt-surface);
	color: var(--kt-text);
	font: inherit;
	font-size: 15px;
	caret-color: var(--kt-accent);
}
.kt-vnos:hover { border-color: color-mix(in srgb, var(--kt-text) 45%, transparent); }
.kt-vnos:focus-visible { border-color: var(--kt-accent); outline-offset: 0; }

:is(.kt-hero, .kt-sekcija--temna) .kt-vnos {
	background: color-mix(in srgb, var(--kt-a900) 88%, transparent);
	color: var(--kt-bg);
	border-color: color-mix(in srgb, var(--kt-a400) 50%, transparent);
}
:is(.kt-hero, .kt-sekcija--temna) .kt-vnos::placeholder { color: color-mix(in srgb, var(--kt-bg) 50%, transparent); }
:is(.kt-hero, .kt-sekcija--temna) .kt-vnos:hover { border-color: var(--kt-a400); }

.kt-iskanje { display: flex; }
.kt-iskanje .kt-vnos { flex: 1; min-height: 46px; }
.kt-iskanje .kt-gumb--ikona { width: 46px; height: 46px; }

.kt-vec {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--kt-font-naslov);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--kt-a700);
}
.kt-vec .kt-ikona { transition: transform 0.15s ease; }
.kt-vec:hover .kt-ikona { transform: translateX(3px); }
.kt-vec--velik { margin-top: 24px; font-size: 16px; }

.kt-znacka {
	display: inline-flex;
	align-items: center;
	padding: 3px 10px;
	font-size: 11px;
	letter-spacing: 0.02em;
	background: var(--kt-n100);
	color: var(--kt-n800);
}
.kt-znacka--poudarjena { background: var(--kt-a100); color: var(--kt-a800); }

.kt-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 12px;
	font-size: 13px;
	color: var(--kt-n700);
}

.kt-obvestilo {
	margin: 0 0 20px;
	padding: 10px 14px;
	border-left: 3px solid currentColor;
	font-size: 15px;
}
.kt-obvestilo--uspeh { color: var(--kt-a300); background: color-mix(in srgb, var(--kt-a300) 10%, transparent); }
.kt-obvestilo--napaka { color: #ffb4a8; background: color-mix(in srgb, #ffb4a8 10%, transparent); }

.kt-med { position: absolute !important; left: -9999px; }

/* ==========================================================================
   7. Glava
   ========================================================================== */

.kt-glava {
	position: relative;
	z-index: 20;
	background: var(--kt-a900);
	color: var(--kt-bg);
	border-bottom: 1px solid color-mix(in srgb, var(--kt-a400) 22%, transparent);
}

.kt-glava__vrstica {
	display: flex;
	align-items: center;
	gap: 36px;
	height: var(--kt-glava-h);
	max-width: var(--kt-sirina);
	margin-inline: auto;
	padding-inline: var(--kt-rob);
}

.kt-znamka {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-right: auto;
	color: inherit;
	text-decoration: none;
}
.kt-znamka:hover { color: inherit; }
.kt-znamka img { max-height: 40px; width: auto; }

.kt-znamka__znak {
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	border: 1px solid var(--kt-a500);
	font-family: var(--kt-font-naslov);
	font-size: 15px;
	font-weight: 600;
	color: var(--kt-a300);
}

.kt-znamka__ime {
	font-family: var(--kt-font-naslov);
	font-size: 21px;
	font-weight: 600;
	letter-spacing: 0.02em;
}
.kt-znamka__ime span { color: var(--kt-a400); }

.kt-nav ul {
	display: flex;
	gap: 36px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.kt-nav a {
	display: block;
	padding: 23px 0;
	border-bottom: 2px solid transparent;
	font-family: var(--kt-font-naslov);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--kt-bg);
}
.kt-nav a:hover { color: var(--kt-a300); }
.kt-nav .current-menu-item > a,
.kt-nav .current_page_item > a {
	color: var(--kt-a300);
	border-bottom-color: var(--kt-a400);
}

.kt-jezik {
	display: flex;
	margin-left: 12px;
	border: 1px solid color-mix(in srgb, var(--kt-a400) 40%, transparent);
	font-family: var(--kt-font-naslov);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
}
.kt-jezik b,
.kt-jezik a { padding: 5px 10px; }
.kt-jezik b { font-weight: inherit; background: color-mix(in srgb, var(--kt-a400) 22%, transparent); }
.kt-jezik a { color: color-mix(in srgb, var(--kt-bg) 70%, transparent); text-decoration: none; }
.kt-jezik a:hover { color: var(--kt-bg); }

.kt-burger {
	display: none;
	place-items: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 1px solid color-mix(in srgb, var(--kt-a400) 40%, transparent);
	background: transparent;
	color: inherit;
	cursor: pointer;
}
.kt-burger__zapri,
.kt-burger[aria-expanded="true"] .kt-burger__odpri { display: none; }
.kt-burger[aria-expanded="true"] .kt-burger__zapri { display: block; }

@media (max-width: 900px) {
	.kt-glava__vrstica { gap: 16px; }
	.kt-jezik { margin-left: 0; }
	.kt-burger { display: grid; }

	.kt-nav {
		display: none;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		padding: 8px var(--kt-rob) 24px;
		background: var(--kt-a900);
		border-bottom: 1px solid color-mix(in srgb, var(--kt-a400) 22%, transparent);
	}
	.kt-nav.is-open { display: block; }
	.kt-nav ul { flex-direction: column; gap: 0; }
	.kt-nav a {
		padding: 14px 0;
		border-bottom: 1px solid color-mix(in srgb, var(--kt-a400) 16%, transparent);
	}
	.kt-nav .current-menu-item > a,
	.kt-nav .current_page_item > a { border-bottom-color: color-mix(in srgb, var(--kt-a400) 16%, transparent); }

	/* Brez JavaScripta je meni vedno odprt – sicer bi bil nedosegljiv. */
	.no-js .kt-nav { display: block; position: static; padding: 0 0 16px; }
	.no-js .kt-glava__vrstica { flex-wrap: wrap; height: auto; padding-block: 16px 0; }
	.no-js .kt-burger { display: none; }
}

/* ==========================================================================
   8. Uvodni pas (hero) in hex ozadje
   ========================================================================== */

.kt-hero {
	position: relative;
	overflow: hidden;
	background: var(--kt-a900);
	color: var(--kt-bg);
}

.kt-hex {
	position: absolute;
	top: 0;
	bottom: 56px;
	right: 0;
	width: 62%;
	overflow: hidden;
	pointer-events: none;
	user-select: none;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 45%);
	mask-image: linear-gradient(90deg, transparent, #000 45%);
}
.kt-hero--podstran .kt-hex { bottom: 0; }

/* Mreža ima toliko 30-px vrstic, kolikor jih gre v višino pasu; odvečne
   padejo v implicitne vrstice z višino 0, zato se zadnja vidna vrstica ne
   odreže na pol in spodnji odmik je enak zgornjemu. */
.kt-hex__mreza {
	box-sizing: border-box;
	display: grid;
	grid-template-rows: repeat(auto-fill, 30px);
	grid-auto-rows: 0;
	height: 100%;
	padding: 24px 56px 24px 0;
	font-family: var(--kt-font-naslov);
	font-size: 17px;
	line-height: 30px;
	font-feature-settings: "tnum" 1;
}
.kt-hex__vrstica {
	display: grid;
	grid-template-columns: 64px repeat(20, 1fr);
	overflow: hidden;
	text-align: center;
}
.kt-hex__naslov { text-align: left; color: color-mix(in srgb, var(--kt-a300) 30%, transparent); }
.kt-hex__r0 { color: color-mix(in srgb, var(--kt-a300) 14%, transparent); }
.kt-hex__r1 { color: color-mix(in srgb, var(--kt-a300) 22%, transparent); }
.kt-hex__r2 { color: color-mix(in srgb, var(--kt-a300) 30%, transparent); }
.kt-hex__zadetek {
	background: color-mix(in srgb, var(--kt-a300) 12%, transparent);
	color: color-mix(in srgb, var(--kt-a300) 75%, transparent);
	font-weight: 600;
}

.kt-hero__mreza {
	position: relative;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
	gap: 64px;
	align-items: center;
	max-width: var(--kt-sirina);
	margin-inline: auto;
	padding: clamp(64px, 8vw, 104px) var(--kt-rob);
}

.kt-hero__naslov {
	margin: 0;
	font-size: clamp(56px, 2rem + 6vw, 128px);
	line-height: 0.9;
	letter-spacing: 0;
	text-transform: uppercase;
	color: var(--kt-bg);
}
.kt-hero__naslov--kurzor::after {
	content: "";
	display: inline-block;
	width: 0.42em;
	height: 0.72em;
	margin-left: 0.08em;
	background: var(--kt-a400);
	animation: kt-utrip 1.1s steps(1) infinite;
}

.kt-hero__uvod {
	max-width: 52ch;
	margin-top: 32px;
	font-size: 18px;
	line-height: 1.6;
	color: color-mix(in srgb, var(--kt-bg) 78%, transparent);
	text-wrap: pretty;
}

.kt-hero__trak {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 24px;
	padding: 18px max(var(--kt-rob), (100% - var(--kt-sirina)) / 2 + var(--kt-rob));
	border-top: 1px solid color-mix(in srgb, var(--kt-a400) 22%, transparent);
	font-size: 14px;
	color: color-mix(in srgb, var(--kt-bg) 75%, transparent);
}
.kt-hero__trak > p { margin-right: auto; }

.kt-druzbena { display: flex; flex-wrap: wrap; gap: 12px 24px; }
.kt-druzbena a {
	display: flex;
	align-items: center;
	gap: 8px;
	font-family: var(--kt-font-naslov);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--kt-bg);
}
.kt-druzbena a:hover { color: var(--kt-a300); }

/* Podstrani: drobtine, nižji pas, naslov poravnan na dno. */
.kt-hero--podstran .kt-hero__mreza {
	gap: 40px 64px;
	align-items: end;
	padding-block: clamp(56px, 6vw, 72px) 56px;
}
.kt-hero--podstran .kt-hero__naslov { line-height: 0.85; }
/* Dolg naslov seže čez hex mrežo: mreža se umakne v ozadje. */
.kt-hero--ozek .kt-hex { opacity: 0.45; }
.kt-hero--ozek .kt-hex__zadetek { background: color-mix(in srgb, var(--kt-a300) 35%, transparent); color: var(--kt-a300); }
.kt-hero--ozek .kt-hero__naslov {
	font-size: clamp(40px, 1.5rem + 3.6vw, 76px);
	line-height: 0.95;
	text-wrap: balance;
}
.kt-hero__meta {
	margin-top: 20px;
	font-size: 16px;
	color: color-mix(in srgb, var(--kt-bg) 78%, transparent);
}

.kt-drobtine {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 20px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--kt-a300);
}
.kt-drobtine a { color: color-mix(in srgb, var(--kt-bg) 70%, transparent); text-decoration: none; }
.kt-drobtine a:hover { color: var(--kt-bg); }

.kt-filtri {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 14px 0 0;
	padding: 0;
	list-style: none;
}
.kt-filter {
	display: inline-flex;
	padding: 5px 12px;
	border: 1px solid color-mix(in srgb, var(--kt-a400) 50%, transparent);
	font-size: 13px;
	letter-spacing: 0.02em;
	text-decoration: none;
	color: var(--kt-a300);
}
.kt-filter:hover { color: var(--kt-bg); border-color: var(--kt-a400); }
.kt-filter.is-active { background: var(--kt-a300); border-color: var(--kt-a300); color: var(--kt-a900); }

@media (max-width: 900px) {
	.kt-hex { width: 100%; opacity: 0.55; }
}
@media (max-width: 600px) {
	.kt-hex { display: none; }
}

/* --- Terminal ------------------------------------------------------------ */

.kt-terminal {
	border: 1px solid color-mix(in srgb, var(--kt-a400) 45%, transparent);
	background: color-mix(in srgb, var(--kt-a900) 70%, black);
}

.kt-terminal__glava {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 18px;
	border-bottom: 1px solid color-mix(in srgb, var(--kt-a400) 30%, transparent);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--kt-a300);
}
/* Trije »gumbi okna«: dva prazna kvadratka in poln. */
.kt-terminal__glava::after {
	content: "";
	flex: none;
	width: 44px;
	height: 8px;
	margin-left: auto;
	--l: linear-gradient(currentColor, currentColor);
	background:
		var(--l) 0 0 / 8px 1px no-repeat,
		var(--l) 0 7px / 8px 1px no-repeat,
		var(--l) 0 0 / 1px 8px no-repeat,
		var(--l) 7px 0 / 1px 8px no-repeat,
		var(--l) 18px 0 / 8px 1px no-repeat,
		var(--l) 18px 7px / 8px 1px no-repeat,
		var(--l) 18px 0 / 1px 8px no-repeat,
		var(--l) 25px 0 / 1px 8px no-repeat,
		var(--l) 36px 0 / 8px 8px no-repeat;
}

.wp-block-table.kt-terminal__tabela {
	margin: 0;
	padding: 10px 22px 0;
	overflow: visible;
	font-family: var(--kt-font-naslov);
	font-size: 20px;
	font-feature-settings: "tnum" 1;
}
.wp-block-table.kt-terminal__tabela table { width: 100%; border-collapse: collapse; }
.wp-block-table.kt-terminal__tabela td {
	padding: 12px 0;
	border: 0;
	border-bottom: 1px dashed color-mix(in srgb, var(--kt-a400) 30%, transparent);
}
.wp-block-table.kt-terminal__tabela td:first-child { color: color-mix(in srgb, var(--kt-bg) 65%, transparent); }
.wp-block-table.kt-terminal__tabela td:last-child { text-align: right; }

.kt-terminal__poziv {
	padding: 16px 22px 20px;
	font-family: var(--kt-font-naslov);
	font-size: 20px;
	color: var(--kt-a300);
}

@keyframes kt-utrip {
	50% { opacity: 0; }
}

/* --- Statistika (CyberGirls) --------------------------------------------- */

.kt-statistika {
	border: 1px solid color-mix(in srgb, var(--kt-a400) 45%, transparent);
	background: color-mix(in srgb, var(--kt-a900) 88%, transparent);
}
.kt-statistika > * { padding: 32px; }
.kt-statistika > * + * { border-top: 1px solid color-mix(in srgb, var(--kt-a400) 35%, transparent); }
.kt-statistika__vrednost {
	font-family: var(--kt-font-naslov);
	font-size: clamp(64px, 2rem + 5vw, 96px);
	font-weight: 600;
	line-height: 0.9;
	color: var(--kt-a300);
}
.kt-statistika__vrednost--svetla { color: var(--kt-bg); }
.kt-statistika__opis {
	margin-top: 10px;
	font-size: 16px;
	color: color-mix(in srgb, var(--kt-bg) 80%, transparent);
}

/* ==========================================================================
   9. Sekcije
   ========================================================================== */

/* --- Časovnica ----------------------------------------------------------- */

.kt-casovnica {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.kt-faza {
	position: relative;
	padding: 45px 40px 0 0;
}
.kt-faza:last-child { padding-right: 0; }
.kt-faza::before {
	content: "";
	position: absolute;
	top: 6px;
	left: 0;
	right: 0;
	height: 1px;
	background: var(--kt-divider);
}
.kt-faza::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 13px;
	height: 13px;
	border: 1px solid var(--kt-a600);
	background: var(--kt-bg);
}
.kt-faza.is-zakljucena::before { background: var(--kt-a600); }
.kt-faza.is-zakljucena::after { background: var(--kt-a600); }

.kt-faza__oznaka {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--kt-a700);
}
.kt-faza__naslov {
	font-size: 34px;
	line-height: 1;
	text-transform: uppercase;
}
.kt-faza__datum {
	margin: 8px 0 16px;
	font-family: var(--kt-font-naslov);
	font-size: 20px;
	color: var(--kt-a700);
}
.kt-faza p:last-child {
	font-size: 15px;
	line-height: 1.6;
	color: color-mix(in srgb, var(--kt-text) 78%, transparent);
}

@media (max-width: 800px) {
	.kt-casovnica { grid-template-columns: minmax(0, 1fr); gap: 40px; }
	.kt-faza { padding-right: 0; }
}

/* --- Ekipa --------------------------------------------------------------- */

.kt-stevec {
	display: flex;
	align-items: flex-end;
	gap: 20px;
	font-size: 28px;
	line-height: 1.05;
	text-transform: uppercase;
}
.kt-stevec strong {
	font-size: clamp(120px, 4rem + 9vw, 200px);
	font-weight: 600;
	line-height: 0.78;
	color: var(--kt-a600);
}
.kt-stevec span { padding-bottom: 4px; }
.kt-stevec + .kt-uvod { margin-top: 32px; }

.kt-kategorije {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 28px;
}
.kt-kategorije + .kt-uvod { margin-top: 32px; }

.kt-kategorija {
	padding: 28px;
	border: 1px solid var(--kt-divider);
}
.kt-kategorija__naslov {
	margin: 6px 0 20px;
	font-size: 36px;
	text-transform: uppercase;
}

.wp-block-table.kt-vrstice { margin: 0; overflow: visible; font-size: 15px; }
.wp-block-table.kt-vrstice table { width: 100%; border-collapse: collapse; }
.wp-block-table.kt-vrstice td {
	padding: 10px 0;
	border: 0;
	border-top: 1px solid var(--kt-divider);
}
.wp-block-table.kt-vrstice td:first-child { color: var(--kt-n700); }
.wp-block-table.kt-vrstice td:last-child {
	text-align: right;
	font-family: var(--kt-font-naslov);
	font-size: 20px;
	font-weight: 600;
}

@media (max-width: 560px) {
	.kt-kategorije { grid-template-columns: minmax(0, 1fr); }
}

/* --- O tekmovanju -------------------------------------------------------- */

.kt-dva--raztegni { align-items: stretch; }

/* Številki sedita na dnu stolpca, poravnani z zavihki ciljev na desni. */
.kt-o-tekmovanju { display: flex; flex-direction: column; }
.kt-stevilke {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin-top: auto;
	padding-top: 40px;
}
.kt-stevilke > * { padding: 22px 24px 0; border-top: 1px solid var(--kt-divider); }
.kt-stevilke > :first-child { padding-left: 0; }
.kt-stevilke > * + * { border-left: 1px solid var(--kt-divider); }
.kt-stevilke__vrednost {
	font-family: var(--kt-font-naslov);
	font-size: clamp(40px, 1.5rem + 2.5vw, 56px);
	font-weight: 600;
	line-height: 1;
	color: var(--kt-a700);
}
.kt-stevilke__opis { margin-top: 6px; font-size: 14px; color: var(--kt-n700); }

/* Cilji: brez JS so navaden oštevilčen seznam na plošči. main.js doda
   .is-js, zloži cilje enega na drugega, doda števec in zavihke ter jih
   samodejno menjava. Čas prikaza enega cilja je trajanje animacije
   napredka na zavihku – ko se izteče, JS pokaže naslednjega. */
.kt-cilji { display: flex; flex-direction: column; }
.kt-cilji__glava {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 18px;
}
.kt-cilji__naslov {
	margin: 0 0 18px;
	font-size: 20px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}
.kt-cilji__glava .kt-cilji__naslov { margin: 0; }
.kt-cilji__stevec {
	font-size: 13px;
	font-variant-numeric: tabular-nums;
	color: var(--kt-n700);
}

.kt-cilji__plosca {
	flex: 1;
	display: grid;
	border: 1px solid var(--kt-divider);
	padding: clamp(24px, 3vw, 40px);
}
.kt-cilj {
	display: grid;
	grid-template-columns: 48px 1fr;
	gap: 0 16px;
	align-items: baseline;
	padding: 14px 0;
}
.kt-cilj + .kt-cilj { border-top: 1px solid var(--kt-divider); }
.kt-cilj__st {
	font-family: var(--kt-font-naslov);
	font-size: 28px;
	font-weight: 600;
	line-height: 1;
	color: var(--kt-a700);
}
.kt-cilj__kratko { display: none; }
.kt-cilj__besedilo { font-size: 17px; line-height: 1.5; text-wrap: pretty; }

/* Interaktivna različica. */
.kt-cilji.is-js .kt-cilji__plosca { min-height: clamp(280px, 26vw, 340px); }
.kt-cilji.is-js .kt-cilj {
	grid-area: 1 / 1;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 32px;
	padding: 0;
	border: 0;
	visibility: hidden;
	opacity: 0;
}
.kt-cilji.is-js .kt-cilj.is-aktiven {
	visibility: visible;
	opacity: 1;
	animation: kt-cilj-pojav 0.5s ease both;
}
.kt-cilji.is-js .kt-cilj__st {
	font-size: clamp(110px, 4rem + 7vw, 180px);
	font-weight: 700;
	line-height: 0.85;
	color: transparent;
	-webkit-text-stroke: 1.5px var(--kt-a600);
}
.kt-cilji.is-js .kt-cilj__besedilo {
	max-width: 32ch;
	font-size: clamp(20px, 1rem + 0.8vw, 26px);
	line-height: 1.35;
}
@keyframes kt-cilj-pojav {
	from { opacity: 0; transform: translateY(8px); }
	to   { opacity: 1; transform: none; }
}

.kt-cilji__zavihki {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 8px;
	margin-top: 16px;
}
.kt-cilji__zavihek {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-height: 78px;
	padding: 14px 12px;
	overflow: hidden;
	border: 1px solid var(--kt-divider);
	background: transparent;
	color: var(--kt-text);
	font: inherit;
	text-align: left;
	cursor: pointer;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.kt-cilji__zavihek:hover { border-color: var(--kt-a500); }
.kt-cilji__zavihek:focus-visible { outline: 2px solid var(--kt-a600); outline-offset: 2px; }
.kt-cilji__zavihek-st {
	font-family: var(--kt-font-naslov);
	font-size: 20px;
	font-weight: 600;
	line-height: 1;
}
.kt-cilji__zavihek-ime { font-size: 12px; line-height: 1.35; color: var(--kt-n700); }
.kt-cilji__zavihek[aria-selected="true"] {
	border-color: var(--kt-a700);
	background: var(--kt-a700);
	color: #fff;
}
.kt-cilji__zavihek[aria-selected="true"] .kt-cilji__zavihek-ime { color: var(--kt-a100); }

/* Napredek do naslednjega cilja. */
.kt-cilji__zavihek[aria-selected="true"]::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 3px;
	background: var(--kt-a300);
	transform-origin: left;
	animation: kt-cilj-cas var(--kt-cilj-cas, 6s) linear both;
}
.kt-cilji:hover .kt-cilji__zavihek::after,
.kt-cilji:has(:focus-visible) .kt-cilji__zavihek::after,
.kt-cilji.is-ustavljen .kt-cilji__zavihek::after { animation-play-state: paused; }
@keyframes kt-cilj-cas {
	from { transform: scaleX(0); }
	to   { transform: scaleX(1); }
}

@media (max-width: 700px) {
	.kt-cilji__zavihki { gap: 6px; }
	.kt-cilji__zavihek { min-height: 0; padding: 12px 8px; align-items: center; }
	.kt-cilji__zavihek-ime { display: none; }
}

/* --- Vrtiljak oseb ------------------------------------------------------- */

.kt-vrtiljak__krmilje { display: flex; gap: 8px; }
.kt-vrtiljak__krmilje[hidden] { display: none; }

.kt-vrtiljak__sled {
	--kt-stolpci: 4;
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - (var(--kt-stolpci) - 1) * 28px) / var(--kt-stolpci));
	gap: 28px;
	margin: 0;
	padding: 6px 6px 16px;
	list-style: none;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: thin;
	scrollbar-color: var(--kt-divider) transparent;
	/* Prostor za kotne oznake, ki segajo 6 px čez rob kartice. */
	margin-inline: -6px;
}
.kt-vrtiljak__sled > li { scroll-snap-align: start; min-width: 0; }

.kt-oseba__portret {
	height: auto;
	aspect-ratio: 4 / 5;
	border: 1px solid var(--kt-divider);
}
.kt-oseba__portret img { width: 100%; height: 100%; object-fit: cover; }
.kt-oseba__ime {
	margin-top: 16px;
	font-family: var(--kt-font-naslov);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.2;
	text-transform: uppercase;
}
.kt-oseba__opis { font-size: 14px; color: var(--kt-n700); }

@media (max-width: 1100px) { .kt-vrtiljak__sled { --kt-stolpci: 3; } }
@media (max-width: 800px)  { .kt-vrtiljak__sled { --kt-stolpci: 2; } }
@media (max-width: 520px)  { .kt-vrtiljak__sled { grid-auto-columns: 78%; } }

/* --- Izziv in prijava na novice ------------------------------------------ */

.kt-izziv {
	padding: clamp(24px, 3vw, 32px);
	border: 1px solid color-mix(in srgb, var(--kt-a400) 45%, transparent);
}
.kt-izziv__oznaka {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--kt-a300);
}
.kt-izziv__navodilo { margin: 8px 0 18px; font-size: 16px; }

.kt-izziv__crke {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 28px;
}
.kt-izziv__crke span {
	display: grid;
	place-items: center;
	width: 56px;
	height: 64px;
	border: 1px solid var(--kt-a400);
	font-family: var(--kt-font-naslov);
	font-size: 36px;
	font-weight: 600;
	color: var(--kt-a300);
}

.kt-izziv__polja {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}
.kt-polje label {
	display: block;
	margin-bottom: 5px;
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--kt-bg) 75%, transparent);
}

.kt-izziv__noga {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 20px;
	margin-top: 24px;
}
.kt-izziv__opomba {
	flex: 1 1 260px;
	font-size: 13px;
	line-height: 1.5;
	color: color-mix(in srgb, var(--kt-bg) 70%, transparent);
}
.kt-izziv__opomba a { color: var(--kt-a300); }

@media (max-width: 560px) {
	.kt-izziv__polja { grid-template-columns: minmax(0, 1fr); }
	.kt-izziv__crke span { width: 48px; height: 56px; font-size: 30px; }
}

/* --- Deljen pas: organizator / sponzorji + sponzorstvo -------------------- */

.kt-deljeno { border-top: 1px solid var(--kt-divider); }
.kt-deljeno__mreza {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
.kt-deljeno__celica { padding-block: 72px; }
.kt-deljeno__celica:first-child {
	padding-right: clamp(32px, 4vw, 56px);
	border-right: 1px solid var(--kt-divider);
}
.kt-deljeno__celica + .kt-deljeno__celica { padding-left: clamp(32px, 4vw, 56px); }
.kt-deljeno .kt-uvod { margin-top: 14px; }

/* Ena sama celica (npr. le poziv k sponzorstvu): čez vso širino, brez delilne črte. */
.kt-deljeno__mreza--ena { grid-template-columns: minmax(0, 1fr); }
.kt-deljeno__mreza--ena > .kt-deljeno__celica:first-child { padding-right: 0; border-right: 0; border-bottom: 0; }

@media (max-width: 900px) {
	.kt-deljeno__mreza { grid-template-columns: minmax(0, 1fr); }
	.kt-deljeno__celica { padding-block: 56px; }
	.kt-deljeno__celica:first-child { padding-right: 0; border-right: 0; border-bottom: 1px solid var(--kt-divider); }
	.kt-deljeno__celica + .kt-deljeno__celica { padding-left: 0; }
}

.kt-partnerji {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	margin: 0;
	padding: 6px 0 0;
	list-style: none;
}
.kt-partner {
	display: grid;
	place-items: center;
	width: 200px;
	height: 96px;
	padding: 12px 16px;
	border: 1px solid var(--kt-divider);
	text-decoration: none;
	color: var(--kt-a700);
}
.kt-partner img { max-width: 72%; max-height: 36px; width: auto; height: auto; object-fit: contain; }
.kt-partner__ime {
	font-family: var(--kt-font-naslov);
	font-size: 26px;
	font-weight: 600;
	letter-spacing: 0.06em;
}
.kt-partnerji li:nth-child(even) .kt-partner__ime { color: var(--kt-text); }
a.kt-partner:hover { background: color-mix(in srgb, var(--kt-accent) 8%, transparent); }

.kt-partnerji--sponzor {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}
.kt-partnerji--sponzor .kt-partner { width: auto; height: 88px; color: var(--kt-text); }
.kt-partnerji--sponzor .kt-partner__ime { font-size: 24px; }
.kt-partner--prazen {
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-align: center;
	color: var(--kt-n600) !important;
}

/* Na ozkih zaslonih dva enako široka stolpca; ploščica zapolni celico
   (odstotna širina na <li> v flexu bi se skrčila na vsebino). */
@media (max-width: 600px) {
	.kt-partnerji,
	.kt-partnerji--sponzor {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 16px;
	}
	.kt-partner,
	.kt-partnerji--sponzor .kt-partner { width: 100%; height: 88px; }
	.kt-partner img { max-width: 80%; max-height: 40px; }
}

/* --- Besedilo s sliko (CyberGirls) --------------------------------------- */

.kt-izjava {
	margin-top: 28px;
	padding-left: 20px;
	border-left: 2px solid var(--kt-accent);
	font-family: var(--kt-font-naslov);
	font-size: 24px;
	font-weight: 600;
	line-height: 1.2;
}

.wp-block-image.kt-slika {
	margin: 0;
	aspect-ratio: 16 / 10;
	border: 1px solid var(--kt-divider);
}
.wp-block-image.kt-slika--5-4 { aspect-ratio: 5 / 4; }
.wp-block-image.kt-slika img { width: 100%; height: 100%; object-fit: cover; }

/* Nadomestek praznega bloka slike (glej kt_prazna_slika v functions.php). */
.kt-slika.kt-nadomestek {
	height: auto;
	aspect-ratio: 16 / 10;
	border: 1px solid var(--kt-divider);
}
.kt-slika--5-4.kt-nadomestek { aspect-ratio: 5 / 4; }

/* --- Mreža celic (dejstva) ----------------------------------------------- */

.kt-celice {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
	border-top: 1px solid var(--kt-divider);
	border-left: 1px solid var(--kt-divider);
}
.kt-celica {
	min-height: 180px;
	padding: 28px;
	border-right: 1px solid var(--kt-divider);
	border-bottom: 1px solid var(--kt-divider);
	font-size: 16px;
	line-height: 1.55;
}
.kt-celica__st {
	font-family: var(--kt-font-naslov);
	font-size: 40px;
	font-weight: 600;
	line-height: 1;
	color: var(--kt-a600);
}
.kt-celica__st + p { margin-top: 16px; }

.kt-celica--povezava {
	position: relative;
	display: flex;
	background: color-mix(in srgb, var(--kt-accent) 8%, transparent);
	color: var(--kt-a700);
	transition: background-color 0.15s ease;
}
.kt-celica--povezava:hover { background: color-mix(in srgb, var(--kt-accent) 16%, transparent); }
.kt-celica--povezava p {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 40px;
	width: 100%;
}
.kt-celica--povezava a {
	font-family: var(--kt-font-naslov);
	font-size: 28px;
	font-weight: 600;
	line-height: 1.05;
	text-transform: uppercase;
	text-decoration: none;
	color: inherit;
}
.kt-celica--povezava a::after { content: ""; position: absolute; inset: 0; }

/* --- Prednosti (temni pas) ----------------------------------------------- */

.kt-prednosti {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr));
	border-top: 1px solid color-mix(in srgb, var(--kt-a400) 35%, transparent);
	border-left: 1px solid color-mix(in srgb, var(--kt-a400) 35%, transparent);
}
.kt-prednost {
	padding: 28px 24px;
	border-right: 1px solid color-mix(in srgb, var(--kt-a400) 35%, transparent);
	border-bottom: 1px solid color-mix(in srgb, var(--kt-a400) 35%, transparent);
	color: var(--kt-a300);
}
.kt-prednost__naslov {
	margin-top: 40px;
	font-size: 24px;
	line-height: 1.05;
	text-transform: uppercase;
	color: var(--kt-bg);
}

/* ==========================================================================
   10. Blog: izpostavljena objava, kartice, članek
   ========================================================================== */

.kt-izpostavljena {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
	gap: 40px 56px;
	align-items: center;
}
.kt-izpostavljena__slika {
	aspect-ratio: 16 / 10;
	border: 1px solid var(--kt-divider);
}
.kt-izpostavljena .kt-meta { font-size: 14px; }
.kt-izpostavljena__naslov {
	margin-top: 18px;
	font-size: clamp(32px, 1.4rem + 2vw, 48px);
	line-height: 1;
	text-transform: uppercase;
	text-wrap: balance;
}
.kt-izpostavljena__naslov a,
.kt-kartica__naslov a { color: inherit; text-decoration: none; }
.kt-izpostavljena__naslov a:hover,
.kt-kartica__naslov a:hover { color: var(--kt-a700); }

.kt-mreza {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
	gap: 32px;
	margin-top: 40px;
}
.kt-oznaka + .kt-mreza { margin-top: 16px; }

.kt-kartica {
	display: flex;
	flex-direction: column;
	border: 1px solid var(--kt-divider);
}
.kt-kartica__slika {
	aspect-ratio: 16 / 10;
	border-bottom: 1px solid var(--kt-divider);
}
/* Prazno stanje (ni zadetkov / ni objav): poravnano na levi rob vsebine,
   kot naslov v uvodnem pasu nad njim. */
.kt-prazno > * { max-width: 640px; }
.kt-prazno .kt-uvod { margin-top: 16px; }
.kt-prazno__akcija { margin-top: 32px; }

/* Slika je absolutna, da razmerje vedno določa okvir – sicer jo pokončna
   ali kvadratna slika (višina iz atributov width/height) raztegne. */
.kt-kartica__slika { position: relative; overflow: hidden; }
.kt-kartica__slika img,
.kt-izpostavljena__slika img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.kt-kartica__telo {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 12px;
	padding: 24px;
}
.kt-kartica__naslov {
	font-size: 26px;
	line-height: 1.05;
	text-transform: uppercase;
}
.kt-kartica__izvlecek {
	flex: 1;
	font-size: 15px;
	line-height: 1.55;
	color: color-mix(in srgb, var(--kt-text) 78%, transparent);
}
.kt-kartica .kt-vec { align-self: flex-start; margin-top: 6px; }

/* Nove kartice ob nalaganju se pokažejo mehko. */
.kt-kartica.is-nova { animation: kt-pojav 0.4s ease both; }
@keyframes kt-pojav {
	from { opacity: 0; transform: translateY(12px); }
}

.kt-clanek__slika {
	margin: 0 auto 56px;
	max-width: 1080px;
	border: 1px solid var(--kt-divider);
}
.kt-clanek__slika img { width: 100%; }

/* Berljiv stolpec za besedilo prispevkov in navadnih strani. */
.kt-besedilo {
	max-width: 760px;
	margin-inline: auto;
	font-size: 17px;
	line-height: 1.7;
}
.kt-besedilo > * + * { margin-top: 1.2em; }
.kt-besedilo :is(h2, h3, h4) { margin-top: 1.8em; text-transform: uppercase; }
.kt-besedilo h2 { font-size: clamp(28px, 1.2rem + 1.4vw, 38px); }
.kt-besedilo h3 { font-size: 26px; }
.kt-besedilo h4 { font-size: 21px; }
.kt-besedilo :is(ul, ol) { padding-left: 1.3em; }
.kt-besedilo li + li { margin-top: 0.4em; }
.kt-besedilo blockquote {
	margin-inline: 0;
	padding-left: 20px;
	border-left: 2px solid var(--kt-accent);
	font-family: var(--kt-font-naslov);
	font-size: 24px;
	font-weight: 600;
	line-height: 1.25;
}
.kt-besedilo figcaption { margin-top: 6px; font-size: 13px; color: var(--kt-n700); }
.kt-besedilo .wp-block-button { margin-top: 0; }

/* --- Dolge (pravne) strani: kazalo + oštevilčena poglavja ---------------- */

.kt-pravno__mreza {
	display: grid;
	grid-template-columns: minmax(220px, 3fr) minmax(0, 8fr);
	gap: 48px clamp(40px, 6vw, 96px);
	align-items: start;
}

.kt-pravno__kazalo {
	position: sticky;
	top: 24px;
	max-height: calc(100vh - 48px);
	overflow-y: auto;
}
.admin-bar .kt-pravno__kazalo { top: 56px; }
.kt-pravno__kazalo ol {
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: kt-kazalo;
}
.kt-pravno__kazalo li { counter-increment: kt-kazalo; }
.kt-pravno__kazalo a {
	display: grid;
	grid-template-columns: 32px 1fr;
	gap: 8px;
	padding: 9px 0;
	border-bottom: 1px solid var(--kt-divider);
	font-size: 14px;
	line-height: 1.4;
	text-decoration: none;
	color: color-mix(in srgb, var(--kt-text) 78%, transparent);
}
.kt-pravno__kazalo a::before {
	content: counter(kt-kazalo, decimal-leading-zero);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.08em;
	color: var(--kt-a700);
	padding-top: 1px;
}
.kt-pravno__kazalo a:hover,
.kt-pravno__kazalo a.is-active { color: var(--kt-a700); }
.kt-pravno__kazalo a.is-active { box-shadow: inset 2px 0 0 var(--kt-accent); padding-left: 10px; }

.kt-pravno__besedilo {
	max-width: 72ch;
	margin-inline: 0;
	counter-reset: kt-poglavje;
}
.kt-pravno__besedilo h2 {
	counter-increment: kt-poglavje;
	margin-top: 64px;
	padding-top: 20px;
	border-top: 1px solid var(--kt-divider);
	font-size: clamp(26px, 1.1rem + 1.2vw, 34px);
	scroll-margin-top: 24px;
}
.kt-pravno__besedilo h2::before {
	content: counter(kt-poglavje, decimal-leading-zero);
	display: block;
	margin-bottom: 10px;
	font-family: var(--kt-font);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	color: var(--kt-a700);
}
.kt-pravno__besedilo h3 { margin-top: 32px; font-size: 21px; }
.kt-pravno__besedilo ul { list-style: none; padding-left: 0; }
.kt-pravno__besedilo ul li {
	position: relative;
	padding-left: 22px;
}
.kt-pravno__besedilo ul li::before {
	content: "";
	position: absolute;
	left: 2px;
	top: 0.72em;
	width: 7px;
	height: 7px;
	background: var(--kt-accent);
}

.kt-pravno__uvod {
	font-family: var(--kt-font-naslov);
	font-size: clamp(21px, 1rem + 0.6vw, 25px);
	font-weight: 600;
	line-height: 1.3;
}
.kt-pravno__poudarek {
	padding: 18px 22px;
	border-left: 2px solid var(--kt-accent);
	background: var(--kt-surface);
}
.kt-pravno__povezave {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.kt-besedilo .kt-pravno__povezave li { margin: 0; padding: 0; }
.kt-pravno__povezave li::before { display: none; }
.kt-pravno__povezave a {
	display: inline-block;
	padding: 7px 14px;
	border: 1px solid var(--kt-divider);
	font-family: var(--kt-font-naslov);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	text-decoration: none;
}
.kt-pravno__povezave a:hover { background: color-mix(in srgb, var(--kt-accent) 10%, transparent); }
.kt-pravno__podpis {
	margin-top: 56px !important;
	font-size: 14px;
	color: var(--kt-n700);
}

@media (max-width: 900px) {
	.kt-pravno__mreza { grid-template-columns: minmax(0, 1fr); }
	.kt-pravno__kazalo { position: static; max-height: none; }
}

/* ==========================================================================
   11. Noga
   ========================================================================== */

.kt-noga { border-top: 1px solid var(--kt-divider); }
.kt-noga__vrstica {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 28px;
	max-width: var(--kt-sirina);
	margin-inline: auto;
	padding: 24px var(--kt-rob);
	font-size: 13px;
	color: var(--kt-n700);
}
.kt-noga__znamka {
	margin-right: auto;
	font-family: var(--kt-font-naslov);
	font-size: 17px;
	font-weight: 600;
	text-decoration: none;
	color: var(--kt-text);
}
.kt-noga__znamka span { color: var(--kt-a700); }
.kt-noga__nav ul { display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 0; padding: 0; list-style: none; }
.kt-noga a:not(.kt-noga__znamka) { color: var(--kt-n700); text-decoration: none; }
.kt-noga a:not(.kt-noga__znamka):hover { color: var(--kt-a700); }
.kt-noga__pravice a { margin-left: 8px; }

.kt-druzbena--noga { gap: 16px; }
.kt-druzbena--noga span {
	position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%);
}

@media (max-width: 700px) {
	.kt-noga__znamka { flex-basis: 100%; }
}

/* ==========================================================================
   12. Odzivnost in dostopnost
   ========================================================================== */

@media (max-width: 700px) {
	.kt-glava-sekcije { margin-bottom: 40px; }
	.kt-glava-sekcije--krmilje { flex-wrap: wrap; }
	.kt-hero__uvod { font-size: 17px; }
	.kt-stevilke { grid-template-columns: minmax(0, 1fr); }
	.kt-stevilke > * { padding-left: 0; }
	.kt-stevilke > * + * { margin-top: 22px; border-left: 0; }
	.wp-block-table.kt-terminal__tabela { font-size: 17px; }
}

/* --- Gibanje ---------------------------------------------------------------
   Vstop uvodnega pasu je čisti CSS (teče ob prvem izrisu, brez čakanja na
   JS). Razkrivanje ob drsenju doda main.js le elementom pod pregibom, zato
   brez JS ali ob zmanjšanem gibanju vse ostane vidno. */

:root { --kt-ease: cubic-bezier(0.16, 1, 0.3, 1); }

@keyframes kt-vstop {
	from { opacity: 0; transform: translateY(22px); filter: blur(6px); }
	to   { opacity: 1; transform: none; filter: none; }
}
@keyframes kt-vrstica {
	from { opacity: 0; transform: translateX(-8px); }
	to   { opacity: 1; transform: none; }
}
@keyframes kt-pojav { from { opacity: 0; } }

.kt-hex { animation: kt-pojav 1.8s ease-out both; }
.kt-hero__mreza > :first-child > * { animation: kt-vstop 1s var(--kt-ease) both; }
.kt-hero__mreza > :first-child > :nth-child(2) { animation-delay: 0.1s; }
.kt-hero__mreza > :first-child > :nth-child(3) { animation-delay: 0.22s; }
.kt-hero__mreza > :first-child > :nth-child(4) { animation-delay: 0.32s; }
.kt-hero__mreza > .kt-terminal { animation: kt-vstop 1.1s var(--kt-ease) 0.3s both; }
.kt-terminal__tabela tr { animation: kt-vrstica 0.7s var(--kt-ease) both; }
.kt-terminal__tabela tr:nth-child(1) { animation-delay: 0.6s; }
.kt-terminal__tabela tr:nth-child(2) { animation-delay: 0.68s; }
.kt-terminal__tabela tr:nth-child(3) { animation-delay: 0.76s; }
.kt-terminal__tabela tr:nth-child(4) { animation-delay: 0.84s; }
.kt-terminal__tabela tr:nth-child(5) { animation-delay: 0.92s; }
.kt-terminal__poziv { animation: kt-vrstica 0.7s var(--kt-ease) 1.05s both; }
.kt-hero__trak { animation: kt-pojav 1.2s ease-out 0.5s both; }

.kt-razkrij {
	opacity: 0;
	transform: translateY(28px);
	transition:
		opacity 1s var(--kt-ease) var(--kt-zamik, 0s),
		transform 1s var(--kt-ease) var(--kt-zamik, 0s);
}
.kt-razkrij.is-viden { opacity: 1; transform: none; }

/* Črta pod oznako se nariše od leve proti desni. */
.kt-oznaka.kt-razkrij {
	position: relative;
	transform: none;
	border-bottom-color: transparent;
}
.kt-oznaka.kt-razkrij::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -1px;
	height: 1px;
	background: var(--kt-divider);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 1.4s var(--kt-ease) var(--kt-zamik, 0s);
}
.kt-oznaka--brez-crte.kt-razkrij::after { display: none; }
.kt-oznaka.kt-razkrij.is-viden::after { transform: none; }

.kt-stevilke__vrednost { font-variant-numeric: tabular-nums; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*,
	*::before,
	*::after {
		animation: none !important;
		transition: none !important;
	}
}

@media print {
	.kt-glava,
	.kt-noga,
	.kt-hex,
	.kt-izziv { display: none; }
	.kt-hero { background: none; color: #000; }
}