/* Zenesis v2 — "Services" mega menu (header, ElementsKit).
   Menu item CSS class: zn-sv-menu. Panel root (Elementor container): .zn-svm → .zn-svm-intro (light, rolling counter)
   + .zn-svm-list (four a.zn-svm-row links) + .zn-svm-stage (dark, one .zn-svm-slide per service).
   Desktop (≥1025px): opens on hover, keyboard focus or tap (svmenu.js), fade + slide; hovering / focusing a service
   makes it the featured one (row highlight, its slide in the stage, the counter rolls). Every slide is stacked in the
   same grid cell, so switching never changes the panel's size. Below 1025px ElementsKit shows the item's submenu
   (the four services) as an accordion, styled at the end of this file. */

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

/* ════════ Panel: open / close (desktop) ════════ */
@media (min-width: 1025px) {
	.ekit-wid-con .elementskit-navbar-nav-default .elementskit-navbar-nav .zn-sv-menu > .elementskit-megamenu-panel {
		max-height: calc(100vh - var(--zn-svm-top, 80px));
		max-height: calc(100dvh - var(--zn-svm-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-sv-menu:hover > .elementskit-megamenu-panel,
	.ekit-wid-con .elementskit-navbar-nav-default .elementskit-navbar-nav .zn-sv-menu.zn-sv-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-sv-menu.zn-sv-shut > .elementskit-megamenu-panel {
		opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-8px);
		transition: opacity .18s ease, visibility 0s linear .18s;
	}
}

/* ════════ Layout ════════ */
.zn-svm > .e-con-inner > .zn-svm-intro, .zn-svm > .e-con-inner > .zn-svm-stage { flex: none; }
.zn-svm > .e-con-inner > .zn-svm-list.e-con { --flex-grow: 1; --flex-shrink: 1; --flex-basis: 0%; flex: 1 1 0%; min-width: 0; } /* Elementor "grow" never shrinks */
.zn-svm .zn-svm-list > a.zn-svm-row.e-con { flex: 1 1 auto; } /* the rows share the column's height */
.zn-svm .zn-svm-row > .zn-svm-row__body.e-con { --flex-grow: 1; --flex-shrink: 1; --flex-basis: 0%; flex: 1 1 0%; min-width: 0; }
.zn-svm .elementor-widget p { margin: 0; }

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

/* a field of dots in the corner, a gold light passing over it */
.zn-svm .zn-svm-intro__deco { position: absolute; inset: 0; }
.zn-svm .zn-svm-intro__deco span {
	position: absolute; right: -10px; bottom: -10px; width: 210px; height: 210px; display: block;
	background: radial-gradient(circle, currentColor 1px, transparent 1.4px) 0 0 / 14px 14px;
	-webkit-mask: radial-gradient(circle at 100% 100%, #000 15%, transparent 70%);
	mask: radial-gradient(circle at 100% 100%, #000 15%, transparent 70%);
}
.zn-svm .zn-svm-intro__deco span:nth-child(1) { color: color-mix(in srgb, var(--zn-svm-ink) 16%, transparent); }
.zn-svm .zn-svm-intro__deco span:nth-child(2) {
	color: var(--zn-svm-gold);
	-webkit-mask: linear-gradient(120deg, transparent 40%, #000 50%, transparent 60%) 100% 0 / 300% 100% no-repeat;
	mask: linear-gradient(120deg, transparent 40%, #000 50%, transparent 60%) 100% 0 / 300% 100% no-repeat;
	animation: zn-svm-sheen 5.5s ease-in-out infinite;
	animation-play-state: paused;
}
@keyframes zn-svm-sheen { 0%, 20% { -webkit-mask-position: 100% 0; mask-position: 100% 0; } 80%, 100% { -webkit-mask-position: 0 0; mask-position: 0 0; } }

/* rolling counter of the featured service */
.zn-svm .zn-svm-intro > .zn-svm-intro__count.elementor-widget { margin-top: auto; padding-top: 10px; }
.zn-svm .zn-svm-count { display: grid; grid-template-columns: auto 1fr; align-items: end; column-gap: 10px; row-gap: 14px; }
.zn-svm .zn-svm-count__now {
	display: flex; flex-direction: column; height: 1em; overflow: hidden;
	font-family: var(--zn-svm-head); font-size: 56px; font-weight: 300; line-height: 1; letter-spacing: -.02em;
	color: transparent; -webkit-text-stroke: 1px var(--zn-svm-gold);
}
.zn-svm .zn-svm-count__now span { display: block; height: 1em; transform: translateY(calc(var(--zn-svm-i) * -100%)); transition: transform .7s var(--zn-svm-ease); }
.zn-svm .zn-svm-count__of { padding-bottom: 6px; font-family: var(--zn-svm-text); font-size: 13px; font-weight: 500; letter-spacing: .12em; color: var(--zn-svm-muted); }
.zn-svm .zn-svm-count__bars { grid-column: 1 / -1; display: flex; gap: 6px; }
.zn-svm .zn-svm-count__bars i { display: block; flex: 1 1 0; max-width: 34px; height: 2px; background: color-mix(in srgb, var(--zn-svm-ink) 14%, transparent); position: relative; overflow: hidden; }
.zn-svm .zn-svm-count__bars i::after { content: ""; position: absolute; inset: 0; background: var(--zn-svm-gold); transform: scaleX(0); transform-origin: left; transition: transform .6s var(--zn-svm-ease); }

/* ════════ Service rows ════════ */
.zn-svm a.zn-svm-row {
	position: relative;
	isolation: isolate;
	min-width: 0;
	border-bottom: 1px solid var(--zn-svm-line);
	color: var(--zn-svm-ink);
	text-decoration: none;
	cursor: pointer;
	transition: background-color .45s ease, box-shadow .5s ease;
}
.zn-svm a.zn-svm-row:first-child { border-top: 1px solid var(--zn-svm-line); }
.zn-svm a.zn-svm-row::before { /* gold bar on the left */
	content: ""; position: absolute; left: 0; top: -1px; bottom: -1px; width: 3px;
	background: var(--zn-svm-gold);
	transform: scaleY(0); transform-origin: top;
	transition: transform .55s var(--zn-svm-ease);
}
.zn-svm .zn-svm-row__icon .elementor-widget-container, .zn-svm .zn-svm-row__icon.elementor-widget { display: flex; align-items: center; gap: 14px; }
.zn-svm .zn-svm-num {
	width: 20px; font-family: var(--zn-svm-text); font-size: 12px; font-weight: 500; letter-spacing: .08em;
	color: var(--zn-svm-muted); transition: color .4s ease;
}
.zn-svm .zn-svm-ico {
	display: inline-flex; align-items: center; justify-content: center; flex: none;
	width: 50px; height: 50px;
	background: var(--zn-svm-light);
	color: var(--zn-svm-ink);
	transition: background-color .45s ease, color .45s ease;
}
.zn-svm .zn-svm-ico svg { width: 24px; height: 24px; transition: scale .6s var(--zn-svm-ease); }
.zn-svm .zn-svm-acc { stroke: var(--zn-svm-gold); stroke-dasharray: 1; stroke-dashoffset: 0; }
.zn-svm .zn-svm-row__title .elementor-heading-title { line-height: 1.3; letter-spacing: -.01em; transition: color .4s ease; }
.zn-svm .zn-svm-row__desc { color: var(--zn-svm-body); transition: color .4s ease; }
.zn-svm .zn-svm-row__desc p { font-size: 13.5px; line-height: 1.6; }
.zn-svm .zn-svm-arrow {
	display: inline-flex; align-items: center; justify-content: center; flex: none;
	width: 38px; height: 38px; border-radius: 50%;
	border: 1px solid color-mix(in srgb, var(--zn-svm-ink) 18%, transparent);
	color: var(--zn-svm-ink);
	transition: background-color .4s ease, border-color .4s ease, color .4s ease;
}
.zn-svm .zn-svm-arrow svg { width: 11px; height: 11px; transition: translate .5s var(--zn-svm-ease), rotate .5s var(--zn-svm-ease); rotate: -45deg; }

/* the service under the pointer / in focus (.is-active, set by svmenu.js) — the first one without JS */
.zn-svm:not([data-zn-active]) a.zn-svm-row:first-child, .zn-svm a.zn-svm-row.is-active, .zn-svm a.zn-svm-row:focus-visible {
	background: #fff;
	box-shadow: 0 18px 40px -22px rgba(15, 19, 43, .28);
	z-index: 1;
}
.zn-svm:not([data-zn-active]) a.zn-svm-row:first-child::before, .zn-svm a.zn-svm-row.is-active::before, .zn-svm a.zn-svm-row:focus-visible::before { transform: scaleY(1); }
.zn-svm a.zn-svm-row.is-active .zn-svm-num { color: var(--zn-svm-gold); }
.zn-svm a.zn-svm-row.is-active .zn-svm-ico { background: var(--zn-svm-dark); color: #fff; }
.zn-svm a.zn-svm-row.is-active .zn-svm-ico svg { scale: 1.06; }
.zn-svm a.zn-svm-row.is-active .zn-svm-acc { animation: zn-svm-draw .9s var(--zn-svm-ease) both; }
.zn-svm a.zn-svm-row.is-active .zn-svm-row__desc { color: var(--zn-svm-ink); }
.zn-svm a.zn-svm-row.is-active .zn-svm-arrow { background: var(--zn-svm-gold); border-color: var(--zn-svm-gold); color: #fff; }
.zn-svm a.zn-svm-row.is-active .zn-svm-arrow svg { rotate: 0deg; }
.zn-svm a.zn-svm-row:hover .zn-svm-arrow svg { translate: 3px 0; }
.zn-svm a.zn-svm-row:hover .zn-svm-row__title .elementor-heading-title { color: var(--zn-svm-ink); }
.zn-svm a.zn-svm-row:focus-visible { outline: 2px solid var(--zn-svm-gold); outline-offset: -2px; }
@keyframes zn-svm-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }

/* the counter's bar of the featured service */
.zn-svm:not([data-zn-active]) .zn-svm-count__bars i:first-child::after,
.zn-svm[data-zn-active="1"] .zn-svm-count__bars i:nth-child(1)::after,
.zn-svm[data-zn-active="2"] .zn-svm-count__bars i:nth-child(2)::after,
.zn-svm[data-zn-active="3"] .zn-svm-count__bars i:nth-child(3)::after,
.zn-svm[data-zn-active="4"] .zn-svm-count__bars i:nth-child(4)::after { transform: scaleX(1); }

/* ════════ Featured stage (dark) ════════ */
.zn-svm .zn-svm-stage.e-con { --display: grid; display: grid; grid-template: minmax(0, 1fr) / minmax(0, 1fr); position: relative; overflow: hidden; isolation: isolate; }
.zn-svm .zn-svm-stage::before { /* gold marker of the featured service along the top */
	content: ""; position: absolute; z-index: 3; left: 0; top: 0; width: 25%; height: 3px;
	background: var(--zn-svm-gold);
	transform: translateX(calc(var(--zn-svm-i) * 100%));
	transition: transform .7s var(--zn-svm-ease);
}
.zn-svm .zn-svm-stage > .zn-svm-slide.e-con {
	grid-area: 1 / 1;
	min-width: 0;
	opacity: 0;
	visibility: hidden;
	transition: opacity .45s ease, visibility 0s linear .45s;
}
.zn-svm:not([data-zn-active]) .zn-svm-stage > .zn-svm-slide:first-child,
.zn-svm .zn-svm-stage > .zn-svm-slide.is-active {
	opacity: 1;
	visibility: inherit; /* not "visible": it must stay hidden (and out of the tab order) while the panel is closed */
	z-index: 1;
	transition: opacity .55s ease, visibility 0s;
}
.zn-svm .zn-svm-photo.elementor-widget { position: relative; margin: 0; overflow: hidden; background: #2e292a; }
.zn-svm .zn-svm-photo::after { /* photo melts into the stage */
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: linear-gradient(180deg, rgba(35, 31, 32, 0) 45%, var(--zn-svm-dark) 100%);
}
.zn-svm .zn-svm-photo img {
	display: block; width: 100%; height: 200px; max-width: none; object-fit: cover; border-radius: 0;
	scale: 1.08;
	transition: scale 1.2s var(--zn-svm-ease), opacity .5s ease;
}
.zn-svm .zn-svm-photo img[data-src] { opacity: 0; }
.zn-svm .zn-svm-slide.is-active .zn-svm-photo img, .zn-svm:not([data-zn-active]) .zn-svm-slide:first-child .zn-svm-photo img { scale: 1; }
.zn-svm .zn-svm-slide__body > .elementor-widget { margin: 0; }
.zn-svm .zn-svm-slide__body { position: relative; z-index: 1; margin-top: -34px; }
.zn-svm .zn-svm-slide__num { display: inline-flex; align-items: center; gap: 12px; font-family: var(--zn-svm-text); font-size: 12px; font-weight: 500; letter-spacing: .16em; color: var(--zn-svm-gold); }
.zn-svm .zn-svm-slide__num::after { content: ""; width: 28px; height: 1px; background: currentColor; }
.zn-svm .zn-svm-slide__title .elementor-heading-title { font-size: 22px; line-height: 1.25; letter-spacing: -.01em; text-wrap: balance; }
.zn-svm .zn-svm-points .elementor-icon-list-items { display: grid; gap: 9px; }
.zn-svm .zn-svm-points .elementor-icon-list-item { align-items: flex-start; margin: 0 !important; padding: 0 !important; }
.zn-svm .zn-svm-points .elementor-icon-list-item::after { display: none; }
.zn-svm .zn-svm-points .elementor-icon-list-icon { padding-top: 5px; }
.zn-svm .zn-svm-points .elementor-icon-list-icon svg { width: 11px; height: 11px; fill: var(--zn-svm-gold); }
.zn-svm .zn-svm-points .elementor-icon-list-text { font-family: var(--zn-svm-text); font-size: 13.5px; line-height: 1.55; color: rgba(255, 255, 255, .82); padding-left: 10px; }
.zn-svm .zn-svm-more .elementor-button-icon { border-color: rgba(255, 255, 255, .28); }

/* slide content follows the switch, in order */
.zn-svm .zn-svm-slide__body > .elementor-widget { opacity: 0; transform: translateY(8px); transition: opacity .3s ease, transform .3s ease; }
.zn-svm .zn-svm-slide.is-active .zn-svm-slide__body > .elementor-widget,
.zn-svm:not([data-zn-active]) .zn-svm-slide:first-child .zn-svm-slide__body > .elementor-widget {
	opacity: 1; transform: none;
	transition: opacity .5s ease var(--zn-svm-sd, .1s), transform .7s var(--zn-svm-ease) var(--zn-svm-sd, .1s);
}
.zn-svm .zn-svm-slide__body > .elementor-widget:nth-child(2) { --zn-svm-sd: .15s; }
.zn-svm .zn-svm-slide__body > .elementor-widget:nth-child(3) { --zn-svm-sd: .2s; }
.zn-svm .zn-svm-slide__body > .elementor-widget:nth-child(4) { --zn-svm-sd: .25s; }

/* ════════ Entrance: content follows the panel in (only inside the header menu; the editor shows it as is) ════════ */
@media (min-width: 1025px) {
	.zn-sv-menu .zn-svm-intro > .elementor-widget:not(.zn-svm-intro__decowrap),
	.zn-sv-menu a.zn-svm-row,
	.zn-sv-menu .zn-svm-stage {
		opacity: 0;
		transform: translateY(10px);
		transition: opacity .2s ease, transform .2s ease, background-color .45s ease, box-shadow .5s ease;
	}
	.zn-sv-menu .zn-svm-intro__eyebrow .elementor-heading-title::before { transform: scaleX(0); }
	.zn-sv-menu:is(:hover, .zn-sv-open):not(.zn-sv-shut) .zn-svm-intro > .elementor-widget:not(.zn-svm-intro__decowrap),
	.zn-sv-menu:is(:hover, .zn-sv-open):not(.zn-sv-shut) a.zn-svm-row,
	.zn-sv-menu:is(:hover, .zn-sv-open):not(.zn-sv-shut) .zn-svm-stage {
		opacity: 1;
		transform: none;
		transition: opacity .5s ease var(--zn-svm-d, .1s), transform .7s var(--zn-svm-ease, ease) var(--zn-svm-d, .1s), background-color .45s ease, box-shadow .5s ease;
	}
	.zn-sv-menu .zn-svm-intro > .elementor-widget:nth-child(3) { --zn-svm-d: .08s; }
	.zn-sv-menu .zn-svm-intro > .elementor-widget:nth-child(4) { --zn-svm-d: .14s; }
	.zn-sv-menu .zn-svm-intro > .elementor-widget:nth-child(5) { --zn-svm-d: .2s; }
	.zn-sv-menu a.zn-svm-row:nth-child(1) { --zn-svm-d: .1s; }
	.zn-sv-menu a.zn-svm-row:nth-child(2) { --zn-svm-d: .16s; }
	.zn-sv-menu a.zn-svm-row:nth-child(3) { --zn-svm-d: .22s; }
	.zn-sv-menu a.zn-svm-row:nth-child(4) { --zn-svm-d: .28s; }
	.zn-sv-menu .zn-svm-stage { --zn-svm-d: .18s; }
	.zn-sv-menu:is(:hover, .zn-sv-open):not(.zn-sv-shut) .zn-svm-intro__eyebrow .elementor-heading-title::before { transform: scaleX(1); }
	.zn-sv-menu:is(:hover, .zn-sv-open):not(.zn-sv-shut) .zn-svm-intro__deco span { animation-play-state: running; }
}

/* ════════ Laptop (1025–1280) ════════ */
@media (max-width: 1280px) {
	.zn-svm .zn-svm-ico { width: 44px; height: 44px; }
	.zn-svm .zn-svm-ico svg { width: 22px; height: 22px; }
	.zn-svm .zn-svm-row__icon .elementor-widget-container, .zn-svm .zn-svm-row__icon.elementor-widget { gap: 10px; }
	.zn-svm .zn-svm-row__desc p { font-size: 13px; line-height: 1.55; }
	.zn-svm .zn-svm-arrow { width: 34px; height: 34px; }
	.zn-svm .zn-svm-photo img { height: 170px; }
	.zn-svm .zn-svm-slide__title .elementor-heading-title { font-size: 20px; }
	.zn-svm .zn-svm-points .elementor-icon-list-text { font-size: 13px; }
	.zn-svm .zn-svm-count__now { font-size: 48px; }
}
@media (min-width: 1025px) and (max-width: 1140px) {
	.zn-svm .zn-svm-num { display: none; }
	.zn-svm .zn-svm-arrow { width: 30px; height: 30px; }
}
@media (min-width: 1025px) and (max-height: 760px) { /* short laptop screens: keep the whole panel in view */
	.zn-svm .zn-svm-photo img { height: 140px; }
	.zn-svm .zn-svm-ico { width: 40px; height: 40px; }
	.zn-svm .zn-svm-points .elementor-icon-list-items { gap: 6px; }
}

/* ════════ Below 1025px: the panel is not used (the editor still previews it) ════════ */
@media (max-width: 1024px) {
	.zn-svm > .e-con-inner { flex-wrap: wrap; }
	.zn-svm > .e-con-inner > .zn-svm-intro, .zn-svm > .e-con-inner > .zn-svm-stage { width: 100%; }

	/* mobile accordion: the four services numbered, gold accents */
	.elementskit-navbar-nav .zn-sv-menu > .elementskit-dropdown { counter-reset: zn-sv; }
	.elementskit-navbar-nav .zn-sv-menu > .elementskit-dropdown > li { counter-increment: zn-sv; }
	.ekit-wid-con .elementskit-navbar-nav .zn-sv-menu > .elementskit-dropdown > li > a { position: relative; display: flex; align-items: center; justify-content: flex-start; gap: 14px; text-align: left; }
	.elementskit-navbar-nav .zn-sv-menu > .elementskit-dropdown > li > a::before {
		content: counter(zn-sv, decimal-leading-zero);
		flex: none; min-width: 20px;
		font-family: var(--e-global-typography-zn_eyebrow-font-family, "Inter"), sans-serif;
		font-size: 12px; font-weight: 500; letter-spacing: .08em;
		color: var(--e-global-color-primary, #C8A45D);
	}
	.elementskit-navbar-nav .zn-sv-menu > .elementskit-dropdown > li > a::after {
		content: ""; position: absolute; left: 0; top: 18%; bottom: 18%; width: 2px;
		background: var(--e-global-color-primary, #C8A45D);
		transform: scaleY(0); transition: transform .4s var(--zn-ease-out, ease);
	}
	.elementskit-navbar-nav .zn-sv-menu > .elementskit-dropdown > li > a:is(:hover, :focus-visible)::after,
	.elementskit-navbar-nav .zn-sv-menu > .elementskit-dropdown > li.current-menu-item > a::after { transform: scaleY(1); }
}

@media (prefers-reduced-motion: reduce) {
	.zn-svm *, .zn-svm *::before, .zn-svm *::after,
	.ekit-wid-con .elementskit-navbar-nav-default .elementskit-navbar-nav .zn-sv-menu > .elementskit-megamenu-panel {
		transition-duration: .01s !important; transition-delay: 0s !important; animation: none !important;
	}
	.zn-sv-menu a.zn-svm-row, .zn-sv-menu .zn-svm-stage, .zn-sv-menu .zn-svm-intro > .elementor-widget, .zn-svm .zn-svm-slide__body > .elementor-widget { transform: none !important; }
	.zn-svm .zn-svm-photo img { scale: 1 !important; }
	.ekit-wid-con .elementskit-navbar-nav-default .elementskit-navbar-nav .zn-sv-menu > .elementskit-megamenu-panel { transform: none !important; }
}