/* Zenesis v2 — "Knowledge Center" mega menu (header, ElementsKit).
   Menu item CSS class: zn-kc-menu. Panel root (Elementor container): .zn-kcm → .zn-kcm-intro (Elementor widgets)
   + [zn_knowledge_menu] (.zn-kcm-cards, .zn-kcm-latest; mu-plugins/zenesis-v2-knowledge-menu.php).
   Desktop (≥1025px): opens on hover, keyboard focus or tap (kcmenu.js), fade + slide, then the content comes in
   in order. Below 1025px ElementsKit shows the item's submenu (Insights / Media Mentions) instead. */

.zn-kcm {
	--zn-kcm-gut: 70px;
	--zn-kcm-gold: var(--e-global-color-primary, #C8A45D);
	--zn-kcm-dark: var(--e-global-color-secondary, #231F20);
	--zn-kcm-ink: var(--e-global-color-text, #0F132B);
	--zn-kcm-body: var(--e-global-color-zn_body, #5F6567);
	--zn-kcm-muted: var(--e-global-color-zn_muted, #8C8987);
	--zn-kcm-light: var(--e-global-color-zn_light, #F5F5F5);
	--zn-kcm-line: var(--e-global-color-zn_line, #E8E6E3);
	--zn-kcm-head: var(--e-global-typography-zn_h5-font-family, "Geologica"), sans-serif;
	--zn-kcm-text: var(--e-global-typography-zn_small-font-family, "Inter"), sans-serif;
	--zn-kcm-ease: var(--zn-ease-out, cubic-bezier(.16, 1, .3, 1));
	text-align: left;
}
.zn-kcm *, .zn-kcm *::before, .zn-kcm *::after { box-sizing: border-box; }

/* ════════ Panel: open / close (desktop) ════════ */
@media (min-width: 1025px) {
	.ekit-wid-con .elementskit-navbar-nav-default .elementskit-navbar-nav .zn-kc-menu > .elementskit-megamenu-panel {
		max-height: calc(100vh - var(--zn-kcm-top, 80px));
		max-height: calc(100dvh - var(--zn-kcm-top, 80px));
		overflow-y: auto;
		overscroll-behavior: contain;
		scrollbar-width: thin;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transform: translateY(-8px);
		clip-path: inset(0 0 12% 0);
		transition: opacity .22s ease, transform .3s ease, clip-path .3s ease, visibility 0s linear .3s;
	}
	.ekit-wid-con .elementskit-navbar-nav-default .elementskit-navbar-nav .zn-kc-menu:hover > .elementskit-megamenu-panel,
	.ekit-wid-con .elementskit-navbar-nav-default .elementskit-navbar-nav .zn-kc-menu.zn-kc-open > .elementskit-megamenu-panel {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: none;
		clip-path: inset(0 0 -60px 0); /* lets the panel shadow show */
		transition: opacity .32s ease .05s, transform .6s var(--zn-ease-out, ease) .05s, clip-path .6s var(--zn-ease-out, ease) .05s, visibility 0s linear .05s;
	}
	/* Esc closes it even while the pointer is still over the item */
	.ekit-wid-con .elementskit-navbar-nav-default .elementskit-navbar-nav .zn-kc-menu.zn-kc-shut > .elementskit-megamenu-panel {
		opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-8px);
		transition: opacity .18s ease, visibility 0s linear .18s;
	}
}

/* ════════ Layout ════════ */
.zn-kcm > .e-con-inner > .zn-kcm-dyn.elementor-widget { --flex-grow: 1; --flex-shrink: 1; --flex-basis: 0%; flex: 1 1 0%; min-width: 0; } /* Elementor "grow" never shrinks */
.zn-kcm > .e-con-inner > .zn-kcm-intro { flex: none; }
.zn-kcm .zn-kcm-dyn > .elementor-widget-container, .zn-kcm .zn-kcm-dyn .elementor-shortcode { height: 100%; }
.zn-kcm .zn-kcm-main { display: flex; flex-direction: column; gap: 28px; height: 100%; }

/* ════════ Intro (dark) ════════ */
.zn-kcm .zn-kcm-intro { position: relative; overflow: hidden; isolation: isolate; }
.zn-kcm .zn-kcm-intro > .elementor-widget { position: relative; z-index: 1; }
.zn-kcm .zn-kcm-intro > .zn-kcm-intro__decowrap.elementor-widget { position: absolute; inset: 0; z-index: 0; margin: 0; pointer-events: none; }
.zn-kcm .zn-kcm-intro__text p { margin: 0; }
.zn-kcm .zn-kcm-intro__title .elementor-heading-title { text-wrap: balance; }
.zn-kcm .zn-kcm-intro__eyebrow .elementor-heading-title { display: inline-flex; align-items: center; gap: 12px; }
.zn-kcm .zn-kcm-intro__eyebrow .elementor-heading-title::before {
	content: ""; width: 24px; height: 1px; background: currentColor;
	transform-origin: left; transition: transform .7s var(--zn-kcm-ease) .25s;
}

.zn-kcm .zn-kcm-intro__deco { position: absolute; inset: 0; }
.zn-kcm .zn-kcm-intro__deco span { position: absolute; display: block; }
.zn-kcm .zn-kcm-intro__deco span:nth-child(1),
.zn-kcm .zn-kcm-intro__deco span:nth-child(2) { /* two slow gold arcs in the corner */
	border-radius: 50%;
	border: 1px solid transparent;
	border-top-color: color-mix(in srgb, var(--zn-kcm-gold) 55%, transparent);
	border-left-color: color-mix(in srgb, var(--zn-kcm-gold) 18%, transparent);
	animation: zn-kcm-spin 26s linear infinite;
	animation-play-state: paused;
}
.zn-kcm .zn-kcm-intro__deco span:nth-child(1) { width: 260px; height: 260px; right: -110px; bottom: -120px; }
.zn-kcm .zn-kcm-intro__deco span:nth-child(2) { width: 180px; height: 180px; right: -70px; bottom: -80px; animation-direction: reverse; animation-duration: 18s; }
.zn-kcm .zn-kcm-intro__deco span:nth-child(3) { /* skewed gold light, as in the page heroes */
	right: -40px; bottom: -40%; width: 120px; height: 140%;
	background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--zn-kcm-gold) 16%, transparent));
	transform: skewX(-24deg);
	animation: zn-kcm-drift 9s ease-in-out infinite alternate;
	animation-play-state: paused;
}
@keyframes zn-kcm-spin { to { rotate: 360deg; } }
@keyframes zn-kcm-drift { from { translate: 0 0; opacity: .7; } to { translate: -28px 0; opacity: 1; } }

/* ════════ Cards ════════ */
.zn-kcm .zn-kcm-cards { display: grid; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); gap: 20px; }
.zn-kcm a.zn-kcm-card {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	min-width: 0;
	padding: 26px 26px 24px;
	background: #fff;
	border: 1px solid var(--zn-kcm-line);
	color: var(--zn-kcm-ink);
	text-decoration: none;
	overflow: hidden;
	isolation: isolate;
	transition: border-color .4s ease, box-shadow .5s ease, translate .5s var(--zn-kcm-ease);
}
.zn-kcm a.zn-kcm-card::before { /* gold line along the top */
	content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 2px;
	background: var(--zn-kcm-gold);
	transform: scaleX(0); transform-origin: left;
	transition: transform .6s var(--zn-kcm-ease);
}
.zn-kcm a.zn-kcm-card::after { /* soft gold light in the corner */
	content: ""; position: absolute; z-index: -1; width: 240px; height: 240px; right: -120px; top: -120px; border-radius: 50%;
	background: radial-gradient(circle, color-mix(in srgb, var(--zn-kcm-gold) 16%, transparent), transparent 70%);
	opacity: 0; scale: .6;
	transition: opacity .5s ease, scale .8s var(--zn-kcm-ease);
}
.zn-kcm .zn-kcm-card__icon {
	display: inline-flex; align-items: center; justify-content: center;
	width: 52px; height: 52px; margin-bottom: 6px;
	background: var(--zn-kcm-light);
	color: var(--zn-kcm-ink);
	transition: background-color .45s ease, color .45s ease;
}
.zn-kcm .zn-kcm-card__icon svg { width: 26px; height: 26px; transition: scale .6s var(--zn-kcm-ease); }
.zn-kcm .zn-kcm-acc { color: var(--zn-kcm-gold); stroke: var(--zn-kcm-gold); stroke-dasharray: 1; stroke-dashoffset: 0; }
.zn-kcm .zn-kcm-card__title {
	font-family: var(--zn-kcm-head);
	font-size: var(--e-global-typography-zn_h5-font-size, 18px);
	font-weight: var(--e-global-typography-zn_h5-font-weight, 500);
	line-height: 1.3;
	letter-spacing: -.01em;
	color: var(--zn-kcm-ink);
}
.zn-kcm .zn-kcm-card__desc { flex: 1 1 auto; font-family: var(--zn-kcm-text); font-size: 14px; line-height: 1.7; color: var(--zn-kcm-body); }
.zn-kcm .zn-kcm-card__cta {
	display: inline-flex; align-items: center; gap: 14px; margin-top: 8px;
	font-family: var(--e-global-typography-zn_cta-font-family, "Geologica"), sans-serif;
	font-size: var(--e-global-typography-zn_cta-font-size, 14px);
	font-weight: var(--e-global-typography-zn_cta-font-weight, 600);
	color: var(--zn-kcm-ink);
}
.zn-kcm .zn-kcm-card__cta-text {
	background: linear-gradient(var(--zn-kcm-gold), var(--zn-kcm-gold)) no-repeat 0 100% / 0 1px;
	padding-bottom: 2px;
	transition: background-size .5s var(--zn-kcm-ease);
}
.zn-kcm .zn-kcm-arrow {
	display: inline-flex; align-items: center; justify-content: center; flex: none;
	width: 36px; height: 36px; border-radius: 50%;
	border: 1px solid color-mix(in srgb, var(--zn-kcm-ink) 20%, transparent);
	transition: background-color .4s ease, border-color .4s ease, color .4s ease;
}
.zn-kcm .zn-kcm-arrow svg { width: 11px; height: 11px; transition: translate .5s var(--zn-kcm-ease); }

.zn-kcm a.zn-kcm-card:is(:hover, :focus-visible) { translate: 0 -4px; border-color: color-mix(in srgb, var(--zn-kcm-gold) 35%, var(--zn-kcm-line)); box-shadow: 0 22px 44px -18px rgba(15, 19, 43, .18); color: var(--zn-kcm-ink); }
.zn-kcm a.zn-kcm-card:is(:hover, :focus-visible)::before { transform: scaleX(1); }
.zn-kcm a.zn-kcm-card:is(:hover, :focus-visible)::after { opacity: 1; scale: 1; }
.zn-kcm a.zn-kcm-card:is(:hover, :focus-visible) .zn-kcm-card__icon { background: var(--zn-kcm-dark); color: #fff; }
.zn-kcm a.zn-kcm-card:is(:hover, :focus-visible) .zn-kcm-card__icon svg { scale: 1.08; }
.zn-kcm a.zn-kcm-card:is(:hover, :focus-visible) .zn-kcm-acc { animation: zn-kcm-draw .9s var(--zn-kcm-ease) both; }
.zn-kcm a.zn-kcm-card:is(:hover, :focus-visible) .zn-kcm-card__cta-text { background-size: 100% 1px; }
.zn-kcm a.zn-kcm-card:is(:hover, :focus-visible) .zn-kcm-arrow { background: var(--zn-kcm-gold); border-color: var(--zn-kcm-gold); color: #fff; }
.zn-kcm a.zn-kcm-card:is(:hover, :focus-visible) .zn-kcm-arrow svg { translate: 3px 0; }
.zn-kcm a.zn-kcm-card:focus-visible { outline: 2px solid var(--zn-kcm-gold); outline-offset: 3px; }
@keyframes zn-kcm-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }

/* ════════ Latest from Knowledge Center ════════ */
.zn-kcm .zn-kcm-latest__head { display: flex; align-items: center; gap: 20px; margin-bottom: 16px; }
.zn-kcm .zn-kcm-latest__head::after { content: ""; order: 1; flex: 1 1 auto; height: 1px; background: var(--zn-kcm-line); }
.zn-kcm p.zn-kcm-latest__title {
	margin: 0;
	font-family: var(--e-global-typography-zn_eyebrow-font-family, "Inter"), sans-serif;
	font-size: var(--e-global-typography-zn_eyebrow-font-size, 12px);
	font-weight: var(--e-global-typography-zn_eyebrow-font-weight, 500);
	letter-spacing: var(--e-global-typography-zn_eyebrow-letter-spacing, .16em);
	text-transform: uppercase;
	color: var(--zn-kcm-ink);
}
.zn-kcm a.zn-kcm-latest__all {
	order: 2; display: inline-flex; align-items: center; gap: 10px;
	font-family: var(--e-global-typography-zn_cta-font-family, "Geologica"), sans-serif; font-size: 13px; font-weight: 600;
	color: var(--zn-kcm-ink); text-decoration: none; white-space: nowrap;
	transition: color .3s ease;
}
.zn-kcm .zn-kcm-latest__all-icon svg { display: block; width: 10px; height: 10px; transition: translate .5s var(--zn-kcm-ease); }
.zn-kcm a.zn-kcm-latest__all:is(:hover, :focus-visible) { color: var(--zn-kcm-gold); }
.zn-kcm a.zn-kcm-latest__all:is(:hover, :focus-visible) .zn-kcm-latest__all-icon svg { translate: 3px 0; }

.zn-kcm .zn-kcm-latest__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin: 0; padding: 0; list-style: none; }
.zn-kcm .zn-kcm-post { position: relative; display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 16px; align-items: center; margin: 0; padding: 0; }
.zn-kcm .zn-kcm-post__thumb { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--zn-kcm-light); }
.zn-kcm .zn-kcm-post__thumb img, .zn-kcm .zn-kcm-post__ph { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.zn-kcm .zn-kcm-post__thumb img { transition: opacity .5s ease, scale .8s var(--zn-kcm-ease); }
.zn-kcm .zn-kcm-post__thumb img[data-src] { opacity: 0; }
.zn-kcm .zn-kcm-post__ph { background: linear-gradient(135deg, var(--zn-kcm-dark), #3a3435); }
.zn-kcm .zn-kcm-post__body { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; min-width: 0; }
.zn-kcm .zn-kcm-post__meta { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-family: var(--zn-kcm-text); font-size: 12px; line-height: 1.4; color: var(--zn-kcm-muted); }
.zn-kcm .zn-kcm-post__cat { font-size: 11px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--zn-kcm-gold); }
.zn-kcm .zn-kcm-post__dot { width: 3px; height: 3px; border-radius: 50%; background: currentColor; opacity: .6; }
.zn-kcm a.zn-kcm-post__link {
	display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden;
	font-family: var(--zn-kcm-head); font-size: 15px; font-weight: 500; line-height: 1.35; letter-spacing: -.01em;
	color: var(--zn-kcm-ink); text-decoration: none;
	transition: color .3s ease;
}
.zn-kcm a.zn-kcm-post__link::after { content: ""; position: absolute; inset: -6px; } /* the whole item is the link */
.zn-kcm a.zn-kcm-post__link:focus-visible { outline: none; }
.zn-kcm a.zn-kcm-post__link:focus-visible::after { outline: 2px solid var(--zn-kcm-gold); outline-offset: 0; }
.zn-kcm .zn-kcm-post__more {
	font-family: var(--e-global-typography-zn_cta-font-family, "Geologica"), sans-serif; font-size: 12px; font-weight: 600; color: var(--zn-kcm-ink);
	background: linear-gradient(var(--zn-kcm-gold), var(--zn-kcm-gold)) no-repeat 0 100% / 0 1px;
	padding-bottom: 1px;
	transition: background-size .5s var(--zn-kcm-ease), color .3s ease;
}
.zn-kcm .zn-kcm-post:is(:hover, :focus-within) .zn-kcm-post__thumb img:not([data-src]) { scale: 1.08; }
.zn-kcm .zn-kcm-post:is(:hover, :focus-within) a.zn-kcm-post__link { color: var(--zn-kcm-gold); }
.zn-kcm .zn-kcm-post:is(:hover, :focus-within) .zn-kcm-post__more { background-size: 100% 1px; }

/* ════════ Entrance: content follows the panel in (only inside the header menu; the editor shows it as is) ════════ */
@media (min-width: 1025px) {
	.zn-kc-menu .zn-kcm-intro > .elementor-widget:not(.zn-kcm-intro__decowrap),
	.zn-kc-menu a.zn-kcm-card,
	.zn-kc-menu .zn-kcm-latest__head,
	.zn-kc-menu .zn-kcm-post {
		opacity: 0;
		transform: translateY(10px);
		transition: opacity .2s ease, transform .2s ease, translate .5s var(--zn-kcm-ease, ease), border-color .4s ease, box-shadow .5s ease;
	}
	.zn-kc-menu .zn-kcm-intro__eyebrow .elementor-heading-title::before { transform: scaleX(0); }
	.zn-kc-menu:is(:hover, .zn-kc-open):not(.zn-kc-shut) .zn-kcm-intro > .elementor-widget:not(.zn-kcm-intro__decowrap),
	.zn-kc-menu:is(:hover, .zn-kc-open):not(.zn-kc-shut) a.zn-kcm-card,
	.zn-kc-menu:is(:hover, .zn-kc-open):not(.zn-kc-shut) .zn-kcm-latest__head,
	.zn-kc-menu:is(:hover, .zn-kc-open):not(.zn-kc-shut) .zn-kcm-post {
		opacity: 1;
		transform: none;
		transition: opacity .5s ease var(--zn-kcm-d, .1s), transform .7s var(--zn-kcm-ease, ease) var(--zn-kcm-d, .1s), translate .5s var(--zn-kcm-ease, ease), border-color .4s ease, box-shadow .5s ease;
	}
	.zn-kc-menu .zn-kcm-intro > .elementor-widget:nth-child(2) { --zn-kcm-d: .08s; }
	.zn-kc-menu .zn-kcm-intro > .elementor-widget:nth-child(3) { --zn-kcm-d: .14s; }
	.zn-kc-menu .zn-kcm-intro > .elementor-widget:nth-child(4) { --zn-kcm-d: .2s; }
	.zn-kc-menu a.zn-kcm-card { --zn-kcm-d: calc(.12s + var(--i, 0) * .07s); }
	.zn-kc-menu .zn-kcm-latest__head { --zn-kcm-d: .3s; }
	.zn-kc-menu .zn-kcm-post { --zn-kcm-d: calc(.36s + var(--i, 0) * .06s); }
	.zn-kc-menu:is(:hover, .zn-kc-open):not(.zn-kc-shut) .zn-kcm-intro__eyebrow .elementor-heading-title::before { transform: scaleX(1); }
	.zn-kc-menu:is(:hover, .zn-kc-open):not(.zn-kc-shut) .zn-kcm-intro__deco span { animation-play-state: running; }
	/* the hover lift must not wait for the entrance delay */
	.zn-kc-menu:is(:hover, .zn-kc-open) a.zn-kcm-card:is(:hover, :focus-visible) { transition: opacity .5s ease, transform .7s var(--zn-kcm-ease, ease), translate .5s var(--zn-kcm-ease, ease), border-color .4s ease, box-shadow .5s ease; }
}

/* ════════ Laptop (1025–1280) ════════ */
@media (max-width: 1280px) {
	.zn-kcm .zn-kcm-cards, .zn-kcm .zn-kcm-latest__list { gap: 14px; }
	.zn-kcm a.zn-kcm-card { padding: 22px 20px 20px; gap: 10px; }
	.zn-kcm .zn-kcm-card__icon { width: 46px; height: 46px; }
	.zn-kcm .zn-kcm-card__desc { font-size: 13.5px; line-height: 1.6; }
	.zn-kcm .zn-kcm-post { grid-template-columns: 84px minmax(0, 1fr); gap: 12px; }
	.zn-kcm a.zn-kcm-post__link { font-size: 14px; }
	.zn-kcm .zn-kcm-main { gap: 22px; }
}
@media (min-width: 1025px) and (max-width: 1140px) {
	.zn-kcm .zn-kcm-post { grid-template-columns: minmax(0, 1fr); }
	.zn-kcm .zn-kcm-post__thumb { display: none; }
}
@media (min-width: 1025px) and (max-height: 760px) { /* short laptop screens: keep the whole panel in view */
	.zn-kcm .zn-kcm-card__icon { width: 40px; height: 40px; margin-bottom: 0; }
	.zn-kcm .zn-kcm-card__icon svg { width: 22px; height: 22px; }
	.zn-kcm a.zn-kcm-card { padding-block: 18px 16px; }
	.zn-kcm .zn-kcm-card__cta { margin-top: 2px; }
}

/* ════════ Below 1025px the panel is not used; the editor still previews it ════════ */
@media (max-width: 1024px) {
	.zn-kcm .zn-kcm-cards, .zn-kcm .zn-kcm-latest__list { grid-template-columns: minmax(0, 1fr); }
}

@media (hover: none) {
	.zn-kcm a.zn-kcm-card:hover { translate: none; }
}
@media (prefers-reduced-motion: reduce) {
	.zn-kcm *, .zn-kcm *::before, .zn-kcm *::after,
	.ekit-wid-con .elementskit-navbar-nav-default .elementskit-navbar-nav .zn-kc-menu > .elementskit-megamenu-panel {
		transition-duration: .01s !important; transition-delay: 0s !important; animation: none !important;
	}
	.zn-kc-menu .zn-kcm-card, .zn-kc-menu .zn-kcm-post, .zn-kc-menu .zn-kcm-latest__head, .zn-kc-menu .zn-kcm-intro > .elementor-widget { transform: none !important; }
	.ekit-wid-con .elementskit-navbar-nav-default .elementskit-navbar-nav .zn-kc-menu > .elementskit-megamenu-panel { transform: none !important; }
}
