/* ==========================================================================
   Iskra Mega Menu
   --------------------------------------------------------------------------
   1. Spremenljivke
   2. Skupno
   3. Namizje — tabi
   4. Namizje — kartice
   5. Samostojna mreza kartic
   6. Karusel prispevkov
   7. CTA gumb
   8. Elementor — popravki
   9. Stanja headerja
   10. Telefon (do 767px)
   11. Tablet (768-1024px)
   --------------------------------------------------------------------------
   `!important` je uporabljen samo tam, kjer prebija Elementorjeva pravila.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Spremenljivke
   -------------------------------------------------------------------------- */

.iskra-mm {
	/* Barve */
	--iskra-mm-black: #252628;
	--iskra-mm-greige: #beb7b0;
	--iskra-mm-white-ii: #f7f6f2;
	--iskra-mm-warm-gray: #ece9e4;
	--iskra-mm-red: #cb2d30;
	--iskra-mm-accent: #e4322b;
	--iskra-mm-line: #e7e4e0;

	/* Panel */
	--iskra-mm-max-width: none;
	--iskra-mm-padding: 60px 50px;
	--iskra-mm-gap: 43px;
	--iskra-mm-radius: 10px;

	/* Tabi */
	--iskra-mm-tabs-width: minmax(337px, 1fr);
	--iskra-mm-tab-gap: 20px;
	--iskra-mm-tab-text-width: 230px;

	/* Kartice */
	--iskra-mm-cols: 4;
	--iskra-mm-card-width: 225px;
	--iskra-mm-card-height: 293px;
	--iskra-mm-card-gap: 20px;
	--iskra-mm-card-tint: #f7f6f2;
	--iskra-mm-tint-angle: 180deg;
	--iskra-mm-tint-start: 11.71%;
	--iskra-mm-tint-end: 40.59%;
	--iskra-mm-card-focus: center center;
	--iskra-mm-card-zoom: 1.18;

	/* Prispevki */
	--iskra-mm-post-width: 330px;

	/* Mobilno */
	--iskra-mm-level-width: 330px;
	--iskra-mm-divider: #ece9e4;
	--iskra-mm-divider-level3: #ffffff;
}

/* --------------------------------------------------------------------------
   2. Skupno
   -------------------------------------------------------------------------- */

.iskra-mm {
	display: grid;
	grid-template-columns: var(--iskra-mm-tabs-width) minmax(0, auto);
	gap: var(--iskra-mm-gap);
	align-items: start;
	width: 100%;
	max-width: var(--iskra-mm-max-width);
	margin-inline: auto;
	padding: var(--iskra-mm-padding);
	font-family: Inter, sans-serif;
	font-feature-settings: 'liga' off, 'clig' off;
	color: var(--iskra-mm-black);
}

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

/* Elementor in tema barvata povezave znotraj dropdowna. */
.iskra-mm .iskra-mm__tab,
.iskra-mm .iskra-mm__tab:hover,
.iskra-mm .iskra-mm__tab:focus,
.iskra-mm .iskra-mm__tab-title,
.iskra-mm .iskra-mm__tab:hover .iskra-mm__tab-title,
.iskra-mm .iskra-mm__card,
.iskra-mm .iskra-mm__card:hover,
.iskra-mm .iskra-mm__card-title,
.iskra-mm .iskra-mm__card:hover .iskra-mm__card-title {
	color: var(--iskra-mm-black) !important;
	text-decoration: none !important;
}

.iskra-mm .iskra-mm__tab-desc,
.iskra-mm .iskra-mm__tab:hover .iskra-mm__tab-desc,
.iskra-mm .iskra-mm__card-desc {
	color: var(--iskra-mm-greige) !important;
}

.iskra-mm__notice {
	padding: 12px 16px;
	border: 1px dashed #c00;
	color: #c00;
	font-size: 14px;
}

/* --------------------------------------------------------------------------
   3. Namizje — tabi
   -------------------------------------------------------------------------- */

.iskra-mm__tabs {
	display: flex;
	flex-direction: column;
	gap: var(--iskra-mm-tab-gap);
	border-right: 1px solid var(--iskra-mm-line);
}

/* Ozadja eksplicitno v vseh stanjih — tema barva :focus na <button>. */
.iskra-mm .iskra-mm__tab {
	display: flex;
	align-items: center;
	justify-content: space-between;
	align-self: stretch;
	gap: 16px;
	padding: 15px;
	margin: 0;
	border: 0;
	border-radius: var(--iskra-mm-radius);
	background-color: transparent !important;
	background-image: none !important;
	font: inherit;
	text-align: left;
	cursor: pointer;
	transition: background-color 0.2s ease;
}

.iskra-mm .iskra-mm__tab:hover,
.iskra-mm .iskra-mm__tab:focus,
.iskra-mm .iskra-mm__tab:focus-visible,
.iskra-mm .iskra-mm__tab:active,
.iskra-mm .iskra-mm__tab.is-active {
	background-color: var(--iskra-mm-white-ii) !important;
}

.iskra-mm__tab:focus-visible {
	outline: 2px solid var(--iskra-mm-black);
	outline-offset: -2px;
}

.iskra-mm__tab-text {
	display: block;
	flex: 0 1 auto;
	width: var(--iskra-mm-tab-text-width);
	max-width: var(--iskra-mm-tab-text-width);
	white-space: normal;
}

/* Desktop/Text 2 Desktop Medium */
.iskra-mm__tab-title {
	display: block;
	font-size: 17px;
	font-weight: 500;
	line-height: 27px;
}

/* Desktop/Text 3 Desktop Regular */
.iskra-mm__tab-desc {
	display: block;
	max-width: var(--iskra-mm-tab-text-width);
	white-space: normal;
	font-size: 14px;
	font-weight: 400;
	line-height: 17px;
}

.iskra-mm__tab-arrow {
	flex: 0 0 auto;
	width: 8px;
	height: 8px;
	border-top: 1.5px solid currentColor;
	border-right: 1.5px solid currentColor;
	transform: rotate(45deg);
	transition: transform 0.25s ease;
}

/* --------------------------------------------------------------------------
   4. Namizje — kartice
   -------------------------------------------------------------------------- */

.iskra-mm__panels,
.iskra-mm__panel {
	min-width: 0;
}

.iskra-mm__panel[hidden] {
	display: none;
}

.iskra-mm__cards {
	display: grid;
	grid-template-columns: repeat(var(--iskra-mm-cols), minmax(0, var(--iskra-mm-card-width)));
	justify-content: end;
	gap: var(--iskra-mm-card-gap);
}

/* Slika je ozadje kartice, gradient lezi cez njo, naslov nad obojim. */
.iskra-mm .iskra-mm__card {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 30px;
	width: 100%;
	height: var(--iskra-mm-card-height);
	padding: 30px 20px;
	overflow: hidden;
	border-radius: var(--iskra-mm-radius);
	background-color: var(--iskra-mm-card-tint) !important;
	transition: box-shadow 0.25s ease;
}

.iskra-mm__card.is-wide {
	grid-column: span 2;
}

.iskra-mm__card::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(
		var(--iskra-mm-tint-angle),
		var(--iskra-mm-card-tint) var(--iskra-mm-tint-start),
		transparent var(--iskra-mm-tint-end)
	);
	transition: background 0.25s ease;
}

.iskra-mm__card-media {
	position: absolute;
	inset: 0;
	z-index: 0;
	display: block;
	overflow: hidden;
	border-radius: inherit;
}

.iskra-mm__card-img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: var(--iskra-mm-card-focus);
	transition: transform 0.45s ease;
}

.iskra-mm__card-body {
	position: relative;
	z-index: 2;
	align-self: stretch;
	display: block;
}

/* Desktop/Text 2 Desktop Semibold */
.iskra-mm__card-title {
	display: block;
	font-size: 17px;
	font-weight: 600;
	line-height: 20px;
}

.iskra-mm__card-desc {
	display: block;
	margin-top: 6px;
	font-size: 14px;
	font-weight: 400;
	line-height: 17px;
}

.iskra-mm__card:hover {
	box-shadow: 2px 4px 4px 0 rgba(0, 0, 0, 0.25);
}

.iskra-mm__card:hover::before {
	background: linear-gradient(
		var(--iskra-mm-tint-angle),
		var(--iskra-mm-white-ii) 0%,
		rgba(247, 246, 242, 0) 47.27%
	);
}

.iskra-mm__card:hover .iskra-mm__card-img {
	transform: scale(var(--iskra-mm-card-zoom));
}

.iskra-mm__card:focus-visible {
	outline: 2px solid var(--iskra-mm-black);
	outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   5. Samostojna mreza kartic — [iskra_mega_cards]
   -------------------------------------------------------------------------- */

.iskra-mm--cards {
	display: block;
	text-align: left;
}

.iskra-mm--cards .iskra-mm__cards {
	justify-content: var(--iskra-mm-cards-align, start);
	justify-items: start;
	margin-inline: 0;
}

/* --------------------------------------------------------------------------
   6. Karusel prispevkov
   -------------------------------------------------------------------------- */

.iskra-mm__posts {
	display: flex;
	flex-direction: column;
	gap: 24px;
	min-width: 0;
}

.iskra-mm__posts-heading {
	margin: 0;
	font-size: 17px;
	font-weight: 600;
	line-height: 20px;
	color: var(--iskra-mm-black);
}

.iskra-mm__carousel {
	overflow: hidden;
	min-width: 0;
}

.iskra-mm__track {
	display: flex;
	gap: var(--iskra-mm-card-gap);
	overflow-x: auto;
	scroll-behavior: smooth;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.iskra-mm__track::-webkit-scrollbar {
	display: none;
}

.iskra-mm__post {
	flex: 0 0 var(--iskra-mm-post-width);
	max-width: var(--iskra-mm-post-width);
	min-width: 0;
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	gap: 16px;
	color: inherit;
	text-decoration: none;
}

.iskra-mm__post-media {
	display: block;
	overflow: hidden;
	border-radius: var(--iskra-mm-radius);
	aspect-ratio: 16 / 10;
	background: var(--iskra-mm-white-ii);
}

.iskra-mm__post-img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.iskra-mm__post:hover .iskra-mm__post-img {
	transform: scale(1.04);
}

/* Naslov zapolni prostor med sliko in "Read More", zato je gumb pri vseh
   karticah poravnan na isti visini, tudi ce je naslov dolg eno ali dve vrstici.
   Daljse naslove odrezemo, da kartice ostanejo enako visoke. */
.iskra-mm__post-title {
	flex: 1 1 auto;
	display: -webkit-box;
	-webkit-line-clamp: var(--iskra-mm-post-title-lines, 2);
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 20px;
	font-weight: 600;
	line-height: 26px;
	color: var(--iskra-mm-black);
}

.iskra-mm__post-more {
	margin-top: auto;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 15px;
	font-weight: 500;
	color: var(--iskra-mm-accent);
}

.iskra-mm__post-arrow {
	width: 0;
	height: 0;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-left: 6px solid currentColor;
	transition: transform 0.25s ease;
}

.iskra-mm__post:hover .iskra-mm__post-arrow {
	transform: translateX(3px);
}

/* --------------------------------------------------------------------------
   7. CTA gumb — [iskra_mega_button] in postavka z ID iskra-cta
   -------------------------------------------------------------------------- */

.iskra-mm-btn-wrap {
	display: flex;
	justify-content: var(--iskra-mm-btn-align, start);
}

.iskra-mm-btn {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-width: 82px;
	height: 30px;
	padding: 0 10px;
	border-radius: 3px;
	background: #cb2d30;
	color: #fff !important;
	font-family: Inter, sans-serif;
	font-feature-settings: 'liga' off, 'clig' off;
	font-size: 14px;
	font-weight: 500;
	line-height: 17px;
	text-decoration: none !important;
	white-space: nowrap;
	transition: opacity 0.2s ease;
}

.iskra-mm-btn:hover,
.iskra-mm-btn:focus {
	color: #fff !important;
	opacity: 0.9;
}

#iskra-cta .e-n-menu-title-container {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	box-sizing: border-box;
	min-width: 82px;
	height: 30px;
	padding: 0 10px;
	border-radius: 3px;
	background: #cb2d30 !important;
	transition: opacity 0.2s ease;
}

#iskra-cta .e-n-menu-title-container:hover {
	opacity: 0.9;
}

#iskra-cta .e-n-menu-title-text,
body.iskra-menu-open #iskra-cta .e-n-menu-title-text {
	color: #fff !important;
	font-weight: 500;
	white-space: nowrap;
}

/* --------------------------------------------------------------------------
   8. Elementor — popravki
   -------------------------------------------------------------------------- */

/* Dropdown container ne sme rezati panela */
.e-n-menu-content > .e-con,
.e-n-menu-content > .e-con > .e-con-inner {
	height: auto;
	min-height: 0;
	max-height: none;
}

.e-n-menu-content .elementor-widget-shortcode,
.e-n-menu-content .elementor-shortcode {
	width: 100%;
}

/* Entrance animacije v dropdownu povzrocajo drsenje kartic */
.e-n-menu-content .animated,
.e-n-menu-content .animated-fast,
.e-n-menu-content .animated-slow {
	animation: none !important;
}

.e-n-menu-content .elementor-invisible {
	visibility: visible !important;
}

/* Hamburger: Elementorjeve ikone so SVG brez width/height */
.e-n-menu-toggle {
	width: var(--iskra-mm-toggle-size, 40px);
	height: var(--iskra-mm-toggle-size, 40px);
	font-size: var(--iskra-mm-toggle-icon, 28px);
	line-height: 1;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
}

.e-n-menu-toggle .e-n-menu-toggle-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1em;
	height: 1em;
}

.e-n-menu-toggle svg {
	width: 1em;
	height: 1em;
	fill: currentColor;
}

/* Logo je visji od vrstice z menijem in gleda cez spodnji rob svojega
   containerja, panel pa se odpre tocno na tem robu. Zato panel potisnemo
   nizje, namesto da bi se prerivali za sloje. */
@media (min-width: 1025px) {

	.e-n-menu-content > .e-con {
		margin-top: var(--iskra-mm-panel-offset, 24px);
	}
}

.elementor-location-header .iskra-logo,
.elementor-location-header .elementor-widget-theme-site-logo {
	position: relative;
	z-index: var(--iskra-mm-logo-z, 1000);
}

/* --------------------------------------------------------------------------
   9. Stanja headerja
   JS doda .iskra-menu-open (odprt dropdown) in .iskra-drawer-open (predal).
   -------------------------------------------------------------------------- */

body.iskra-menu-open .elementor-location-header,
body.iskra-menu-open .elementor-location-header > .e-con,
body.iskra-menu-open .elementor-location-header > .e-con > .e-con,
body.iskra-menu-open .elementor-location-header > .e-con > .e-con > .e-con-inner,
body.iskra-drawer-open .elementor-location-header,
body.iskra-drawer-open .elementor-location-header > .e-con,
body.iskra-drawer-open .elementor-location-header > .e-con > .e-con,
body.iskra-drawer-open .elementor-location-header > .e-con > .e-con > .e-con-inner {
	background-color: #fff !important;
	background-image: none !important;
	transition: background-color 0.25s ease;
}

body.iskra-menu-open .e-n-menu-title-text,
body.iskra-drawer-open .e-n-menu-title-text {
	color: #252628 !important;
	transition: color 0.25s ease;
}

body.iskra-menu-open .e-n-menu-dropdown-icon svg,
body.iskra-menu-open .e-n-menu-dropdown-icon i,
body.iskra-drawer-open .e-n-menu-toggle,
body.iskra-drawer-open .e-n-menu-toggle svg {
	color: #252628 !important;
	fill: #252628 !important;
}

/* Inline SVG logo — CSS premaga fill="white" v atributih.
   Prebarvamo samo bele dele (napis MEDICAL in crtice); rdeca ISKRA
   (#CB2D30) ostane rdeca, zato ciljamo po atributu fill, ne po elementu. */
body.iskra-menu-open .iskra-logo svg [fill="white"],
body.iskra-menu-open .iskra-logo svg [fill="#fff"],
body.iskra-menu-open .iskra-logo svg [fill="#FFF"],
body.iskra-menu-open .iskra-logo svg [fill="#ffffff"],
body.iskra-menu-open .iskra-logo svg [fill="#FFFFFF"],
body.iskra-drawer-open .iskra-logo svg [fill="white"],
body.iskra-drawer-open .iskra-logo svg [fill="#fff"],
body.iskra-drawer-open .iskra-logo svg [fill="#FFF"],
body.iskra-drawer-open .iskra-logo svg [fill="#ffffff"],
body.iskra-drawer-open .iskra-logo svg [fill="#FFFFFF"] {
	fill: #252628 !important;
	transition: fill 0.25s ease;
}

/* Logo brez prehoda barve ob prvem izrisu ni potreben — prehod dodamo
   tudi na osnovno stanje, da se barva vrne v belo enako mehko. */
.iskra-logo svg [fill="white"],
.iskra-logo svg [fill="#fff"],
.iskra-logo svg [fill="#FFF"],
.iskra-logo svg [fill="#ffffff"],
.iskra-logo svg [fill="#FFFFFF"] {
	transition: fill 0.25s ease;
}

/* --------------------------------------------------------------------------
   10. Telefon (do 767px)
   Navpicni predal: brez slik, vse se odpira navzdol.
   1. nivo: razmik 20px, odprta postavka dobi podlago #F7F6F2
   2. nivo: blok #F7F6F2, locilnice #ECE9E4
   3. nivo: blok #ECE9E4, bele locilnice, 10px zgoraj in spodaj

   Tablet (768-1024px) je po Figmi drugacen — glej poglavje 11.
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {

	/* --- Predal --- */

	.e-n-menu-wrapper {
		background: var(--iskra-mm-drawer-bg, #fff) !important;
	}

	/* Widget ima item_position: stretch — v navpicnem nacinu bi postavke
	   razporedil cez vso visino predala in `gap` ne bi imel ucinka. */
	.e-n-menu-heading {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start !important;
		height: auto !important;
		gap: var(--iskra-mm-drawer-gap, 20px) !important;
		padding: var(--iskra-mm-drawer-padding, 30px) !important;
		background: transparent !important;
	}

	.e-n-menu-heading .e-n-menu-item,
	.e-n-menu-heading .e-n-menu-title,
	.e-n-menu-heading .e-n-menu-title-container {
		width: 100%;
		background: transparent !important;
		border: 0 !important;
	}

	.e-n-menu-heading .e-n-menu-item {
		--n-menu-title-distance-from-content: 0px;
		display: block;
		flex: 0 0 auto !important;
		margin: 0 !important;
		padding: 0 !important;
		min-height: 0 !important;
		height: auto !important;
	}

	.e-n-menu-heading .e-n-menu-title {
		position: relative;
		display: flex;
		align-items: center;
		padding: 0 !important;
		margin: 0 !important;
	}

	/* Gumb za dropdown ikono je dodajal ~34px visine, tudi brez izbrane
	   ikone. Absolutno ga polozimo cez vrstico: v postavitvi ne zavzame
	   nic, klikna povrsina pa postane celoten naslov. */
	.e-n-menu-heading .e-n-menu-dropdown-icon {
		position: absolute;
		inset: 0;
		width: 100% !important;
		height: 100% !important;
		min-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		font-size: 0 !important;
		line-height: 0 !important;
		background: transparent !important;
		border: 0 !important;
	}

	.e-n-menu-heading .e-n-menu-content {
		margin: 0 !important;
		padding: 0 !important;
		height: auto !important;
		min-height: 0 !important;
	}

	/* Zaprt dropdown se popolnoma sesede -> enakomeren razmik */
	.e-n-menu-heading .e-n-menu-item:not(:has(.e-n-menu-dropdown-icon[aria-expanded="true"])) .e-n-menu-content {
		display: none !important;
	}

	.e-n-menu-heading .e-n-menu-title-text {
		color: var(--iskra-mm-drawer-text, #252628) !important;
		font-size: 14px;
		font-weight: 500;
		line-height: 17px;
	}

	.e-n-menu-heading .e-n-menu-dropdown-icon svg,
	.e-n-menu-heading .e-n-menu-dropdown-icon i {
		color: var(--iskra-mm-drawer-text, #252628) !important;
		fill: var(--iskra-mm-drawer-text, #252628) !important;
	}

	/* Odprta postavka 1. nivoja */
	.e-n-menu-item:has(.e-n-menu-dropdown-icon[aria-expanded="true"]) > .e-n-menu-title > .e-n-menu-title-container {
		display: inline-flex !important;
		align-items: center;
		width: auto !important;
		padding: 10px 20px !important;
		border-radius: var(--iskra-mm-radius, 10px) !important;
		background: #f7f6f2 !important;
	}

	/* Odmik med odprto postavko 1. nivoja in blokom 2. nivoja */
	.e-n-menu-item:has(.e-n-menu-dropdown-icon[aria-expanded="true"]) > .e-n-menu-content {
		margin-top: var(--iskra-mm-level-gap, 15px) !important;
	}

	#iskra-cta .e-n-menu-title-container {
		width: auto !important;
		background: #cb2d30 !important;
	}

	#iskra-cta .e-n-menu-title-text {
		color: #fff !important;
	}

	/* --- Panel --- */

	.iskra-mm {
		display: block;
		padding: 0;
	}

	.iskra-mm__panel {
		padding: 0 20px 10px;
	}

	/* --- 2. nivo --- */

	.iskra-mm__tabs {
		display: block;
		width: 100%;
		max-width: var(--iskra-mm-level-width);
		padding: 0;
		border: 0;
		border-radius: var(--iskra-mm-radius);
		background: var(--iskra-mm-white-ii);
	}

	.iskra-mm .iskra-mm__tab {
		padding: 15px 20px;
		border-radius: 0;
		border-bottom: 1px solid var(--iskra-mm-divider);
	}

	.iskra-mm .iskra-mm__tab:last-child {
		border-bottom: 0;
	}

	.iskra-mm__tab-text {
		width: auto;
		max-width: none;
	}

	.iskra-mm__tab-title {
		font-size: 14px;
		font-weight: 500;
		line-height: 17px;
	}

	.iskra-mm__tab-desc {
		max-width: none;
		font-size: 12px;
		line-height: 15px;
	}

	.iskra-mm__tab.is-active .iskra-mm__tab-arrow {
		transform: rotate(135deg);
	}

	/* --- 3. nivo --- */

	.iskra-mm__cards {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 0;
		width: 100%;
		max-width: var(--iskra-mm-level-width);
		padding: 0;
		border-radius: var(--iskra-mm-radius);
		background: var(--iskra-mm-warm-gray);
	}

	.iskra-mm .iskra-mm__card {
		width: 100%;
		height: auto;
		min-height: 0;
		gap: 0;
		padding: 10px 20px;
		border-radius: 0;
		background-color: transparent !important;
		box-shadow: none;
	}

	.iskra-mm .iskra-mm__card:not(:last-child) {
		border-bottom: 1px solid var(--iskra-mm-divider-level3);
	}

	.iskra-mm__card::before,
	.iskra-mm__card-media {
		display: none;
	}

	.iskra-mm__card-title {
		font-size: 14px;
		font-weight: 500;
		line-height: 17px;
	}

	.iskra-mm__card-desc {
		font-size: 12px;
		line-height: 15px;
	}

	/* --- Prispevki: navpicni seznam brez avtomatike --- */

	.iskra-mm__track {
		flex-direction: column;
		overflow: visible;
		scroll-snap-type: none;
		gap: 15px;
	}

	.iskra-mm__post {
		flex-basis: auto;
		width: 100%;
		max-width: var(--iskra-mm-level-width);
	}

	.iskra-mm__post-title {
		font-size: 16px;
		line-height: 22px;
	}
}

/* --------------------------------------------------------------------------
   11. Tablet (768-1024px)
   Po Figmi ("Menu Tablet"): zaprt header ima logo levo in hamburger desno.
   Klik na hamburger odpre bel panel z VODORAVNO vrstico menija (in X namesto
   hamburgerja), klik na postavko pa pod njo odpre isti split panel kot na
   namizju, le s karticami v mrezi 2 x 2.

   Elementor v tem obsegu preklopi widget v `data-layout=dropdown`, kjer je
   `.e-n-menu-wrapper` ze absoluten panel cez celo sirino pod headerjem.
   Zato tu samo prepovemo navpicni predal iz poglavja 10 in vsebino postavke
   raztegnemo cez celo vrstico.
   -------------------------------------------------------------------------- */

@media (min-width: 768px) and (max-width: 1024px) {

	/* --- Zaprt header: logo levo, hamburger desno --- */

	.elementor-location-header .e-con:has(> .e-con-inner > .iskra-logo) {
		padding: var(--iskra-mm-tablet-header-padding, 0 30px);
	}

	.elementor-location-header .e-con-inner:has(> .iskra-logo) {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		gap: 20px;
		height: var(--iskra-mm-tablet-header-height, 100px);
	}

	/* --- Odprt predal ---
	   Elementorjeva pravila za `[data-layout=dropdown]` imajo specificnost
	   0,4,0 (npr. `.e-n-menu-item { flex-direction: column; width: ... }`),
	   zato jih moramo prebiti z enako gnezdenim selektorjem. */

	/* Brez tega se gumb v navpicnem flexu widgeta raztegne cez vso sirino
	   in ikona pristane na sredini namesto ob desnem robu. */
	.elementor-widget-n-menu {
		--n-menu-toggle-align: flex-end;
	}

	/* Ikona hamburgerja / X po Figmi. Gumb ostane 40px zaradi klikne
	   povrsine, pomanjsa se samo ikona. Elementor sili `height: 100%` na
	   SVG zaprtega stanja (specificnost 0,4,0), zato oba nastavimo izrecno. */
	.elementor-location-header .elementor-widget-n-menu .e-n-menu-toggle {
		--iskra-mm-toggle-icon: var(--iskra-mm-tablet-toggle-icon, 20px);
		--n-menu-toggle-icon-size: var(--iskra-mm-tablet-toggle-icon, 20px);
	}

	.elementor-location-header .elementor-widget-n-menu .e-n-menu-toggle svg,
	.elementor-location-header .elementor-widget-n-menu .e-n-menu-toggle span.e-close svg {
		width: var(--iskra-mm-tablet-toggle-icon, 20px);
		height: var(--iskra-mm-tablet-toggle-icon, 20px);
	}

	.e-n-menu-wrapper {
		background: var(--iskra-mm-drawer-bg, #fff) !important;

		/* Elementorjevi lastni spremenljivki za barvo naslovov v dropdown
		   nacinu — tako ne povozimo hover/active stanj. */
		--n-menu-title-normal-color-dropdown: #252628;
		--n-menu-title-active-color-dropdown: #cb2d30;
	}

	/* Predal se sicer odpre tik pod hamburgerjem (114,5px), logo pa sega do
	   117px — panel ima z-index 2147483640, zato logo prereze ne glede na
	   `--iskra-mm-logo-z`. Potisnemo ga na spodnji rob headerja (132px).

	   Selektor mora biti gnezden: Elementor postavi `margin: 0` s
	   specificnostjo 0,3,0, zato goli `.e-n-menu-wrapper` tu ne zaleze. */
	.elementor-widget-n-menu .e-n-menu[data-layout="dropdown"] .e-n-menu-wrapper {
		margin-block-start: var(--iskra-mm-tablet-drawer-offset, 18px);
	}

	/* Postavke ostanejo vodoravne. `display: contents` na <li> naredi naslov
	   in vsebino za neposredna flex elementa seznama — tako lahko vsebina z
	   `flex-basis: 100%` pade v svojo vrstico cez celo sirino panela. */
	.e-n-menu-wrapper .e-n-menu-heading {
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		column-gap: var(--iskra-mm-tablet-nav-gap, 20px);
		row-gap: 14px;
		padding: var(--iskra-mm-tablet-nav-padding, 26px 30px 24px) !important;
	}

	.elementor-widget-n-menu .e-n-menu[data-layout="dropdown"] .e-n-menu-heading > .e-n-menu-item {
		display: contents;
	}

	/* Figma: Desktop/Text 3 Desktop Medium. Elementor ima 400 in
	   line-height 2em (28px), kar vrstico po nepotrebnem razpira. */
	.elementor-location-header .e-n-menu-wrapper .e-n-menu-title-text {
		font-family: Inter, sans-serif !important;
		font-feature-settings: 'liga' off, 'clig' off;
		font-size: 14px !important;
		font-weight: 500 !important;
		line-height: 17px !important;
	}

	/* Elementor da postavkam `flex-grow: 1`. Sedem naslovov tako posrka ves
	   prosti prostor, Contact pa pade v svojo vrstico in se v njej raztegne
	   cez celo sirino. Brez raztezanja Contact obdrzi svojih 82px. */
	.elementor-widget-n-menu .e-n-menu[data-layout="dropdown"] .e-n-menu-heading .e-n-menu-title {
		width: auto;
		flex-grow: 0;
		background-color: transparent;
	}

	.elementor-widget-n-menu .e-n-menu[data-layout="dropdown"] .e-n-menu-heading .e-n-menu-content {
		flex: 0 0 100%;
		order: 2;
		width: auto;
		margin: 0;
		padding: 0;
		overflow: visible;
	}

	.elementor-widget-n-menu .e-n-menu[data-layout="dropdown"] .e-n-menu-heading .e-n-menu-content > .e-con {
		width: 100%;
		margin-block-start: var(--iskra-mm-tablet-panel-gap, 20px);
	}

	/* Zaprte vsebine bi kot flex elementi ustvarile prazne vrstice. */
	.e-n-menu-wrapper .e-n-menu-item:not(.iskra-mm-item-open) .e-n-menu-content {
		display: none;
	}

	/* Odprta postavka: rdeca in podcrtana. Razred `.iskra-mm-item-open`
	   postavi JS — poglavje 9 sicer vse naslove pobarva temno. */
	.e-n-menu-wrapper .iskra-mm-item-open .e-n-menu-title-text {
		color: #cb2d30 !important;
	}

	.e-n-menu-wrapper .iskra-mm-item-open .e-n-menu-title-container {
		border-bottom: 1px solid #cb2d30;
	}

	/* --- Panel: ozji stolpec s tabi, kartice v mrezi 2 x 2 --- */

	.iskra-mm--split {
		--iskra-mm-padding: 0 30px 40px;
		--iskra-mm-gap: 30px;
		--iskra-mm-tabs-width: clamp(180px, 24vw, 224px);
		--iskra-mm-tab-text-width: 150px;
		--iskra-mm-card-gap: 30px;
		--iskra-mm-card-height: 145px;

		/* Kartica je nizka in siroka, zato gre tint vodoravno — slika ostane
		   vidna na desni strani kartice. */
		--iskra-mm-tint-angle: 90deg;
		--iskra-mm-tint-start: 40%;
		--iskra-mm-tint-end: 68%;

		grid-template-columns: var(--iskra-mm-tabs-width) minmax(0, 1fr);
	}

	.iskra-mm--split .iskra-mm__cards {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.iskra-mm--split .iskra-mm__card {
		gap: 0;
		padding: 20px;
		height: auto;
		min-height: var(--iskra-mm-card-height);
	}

	.iskra-mm--split .iskra-mm__card-body {
		align-self: flex-start;
		max-width: var(--iskra-mm-tablet-card-text, 52%);
	}

	/* Cez celo kartico bi `cover` izrezal le ozek pas, zato sliko omejimo na
	   desni del, kjer je razmerje blizu izvirniku. */
	.iskra-mm--split .iskra-mm__card-media {
		left: var(--iskra-mm-tablet-media-left, 48%);
		border-radius: 0 var(--iskra-mm-radius) var(--iskra-mm-radius) 0;
	}

	/* [iskra_mega_cards] ima na namizju 5 stolpcev — na 1024px bi to
	   prelivalo cez rob. */
	.iskra-mm--cards {
		--iskra-mm-padding: 0 30px 40px;
	}

	.iskra-mm--cards .iskra-mm__cards {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		justify-content: stretch;
	}
}

/* Ozji tablet: osem postavk se v eno vrstico ne izide. Naslovi merijo skupaj
   769px, kar z 7 x 20px razmikov in 60px paddinga zahteva 969px — pod to
   sirino je prelom neizogiben (manjsa pisava bi morala pasti na ~11px).
   Pri tocno 969px podpiksli vrstico se vedno prelomijo, zato je zgornja meja
   979px (nekaj rezerve), ne 1024px in ne 900px.

   Prelomljen flex z `justify-content: space-between` zadnjo vrstico razlije
   cez celo sirino (»Digital Hub … Global … Contact«), zato tu preklopimo na
   mrezo 4 x 2: postavke se poravnajo v stolpce, prelom je namerni 4 + 4.
   Razmik je tu 16px namesto 20px: pri 20px meri stolpec 162px, najsirsi
   naslov (Health & Physiotherapy) pa 161px — ena sama pika rezerve. Pri
   16px je stolpec 165px. `nowrap` poskrbi, da bi daljsi naslov v prihodnje
   raje malo zarezal v razmik, kot da se tiho prelomi v dve vrstici. */
@media (min-width: 768px) and (max-width: 979px) {

	.elementor-widget-n-menu .e-n-menu[data-layout="dropdown"] .e-n-menu-heading {
		display: grid;
		grid-template-columns: repeat(var(--iskra-mm-tablet-nav-cols, 4), minmax(0, 1fr));
		column-gap: var(--iskra-mm-tablet-nav-gap-narrow, 16px);
		row-gap: var(--iskra-mm-tablet-nav-row-gap, 18px);
	}

	.elementor-location-header .e-n-menu-wrapper .e-n-menu-title-text {
		white-space: nowrap;
	}

	/* V mrezi bi `stretch` raztegnil naslov (in rdeci gumb Contact) cez celo
	   celico; podcrtaj odprte postavke se mora drzati besedila. */
	.elementor-widget-n-menu .e-n-menu[data-layout="dropdown"] .e-n-menu-heading .e-n-menu-title {
		justify-self: start;
	}

	/* `flex-basis` v mrezi ne deluje — panel razpnemo cez vse stolpce. */
	.elementor-widget-n-menu .e-n-menu[data-layout="dropdown"] .e-n-menu-heading .e-n-menu-content {
		grid-column: 1 / -1;
	}
}

@media (max-width: 560px) {

	.iskra-mm--cards .iskra-mm__cards {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (prefers-reduced-motion: reduce) {

	.iskra-mm *,
	.iskra-mm *::before,
	.iskra-mm *::after {
		transition-duration: 0.01ms !important;
	}
}

/* --------------------------------------------------------------------------
   12. Prevlada nad temo/Elementorjem — slike vedno zapolnijo okvir
   --------------------------------------------------------------------------
   Elementor ima pravilo `.elementor img { height: auto; }` (specificnost 0,1,1),
   ki premaga nase `.iskra-mm__post-img { height: 100% }` (0,1,0). Posledica:
   slika se ne raztegne cez okvir s fiksnim razmerjem, zato so pri sirokih
   sliCicah spodaj prazni pasovi, pri pokoncnih pa je slika odrezana od spodaj.
   Kartice so tako videti razlicno visoke, ceprav so okvirji enaki.

   Ta blok ima specificnost 0,2,0 in poskrbi, da je izrez vedno enak ne glede
   na to, kaksne dimenzije slike nalozijo uredniki.
   -------------------------------------------------------------------------- */

.iskra-mm .iskra-mm__post-img,
.iskra-mm .iskra-mm__card-img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
}

.iskra-mm .iskra-mm__post-img {
	object-position: center;
}