/* Nowoka Services mega menu. Every rule is isolated to the project-owned marker. */

@media (min-width: 1000px) {
	.header-menu-1 .nw-services-mega-ready > .sub-menu {
		display: block;
		width: min(var(--theme-normal-container-max-width, 1290px), calc(100vw - 40px));
		max-width: min(var(--theme-normal-container-max-width, 1290px), calc(100vw - 40px));
		padding: 0;
		overflow: hidden;
		border: 1px solid color-mix(in srgb, var(--nw-border) 72%, transparent);
		border-radius: 0 0 var(--nw-radius-lg) var(--nw-radius-lg);
		background: var(--nw-card);
		box-shadow: 0 18px 44px rgba(17, 21, 24, 0.14);
	}

	.header-menu-1 .nw-services-mega-ready > .ct-menu-link {
		position: relative;
	}

	.header-menu-1 .nw-services-mega-ready.ct-active > .ct-menu-link {
		z-index: 11;
	}

	.header-menu-1 .nw-services-mega-ready > .ct-menu-link > .nw-services-mega__hover-bridge {
		position: absolute;
		top: 100%;
		inset-inline: 0;
		z-index: 1;
		display: block;
		height: var(--nw-services-hover-bridge-height, 32px);
		background: transparent;
		cursor: default;
		pointer-events: none;
	}

	.header-menu-1 .nw-services-mega-ready.ct-active > .ct-menu-link > .nw-services-mega__hover-bridge {
		pointer-events: auto;
	}

	.header-menu-1 .nw-services-mega-ready > .sub-menu > li:not(.nw-services-promo) {
		display: none !important;
	}

	.header-menu-1 .nw-services-mega-ready > .sub-menu > .nw-services-promo {
		display: block;
		width: 100%;
		min-width: 0;
		padding: 0;
		overflow: visible;
		border-radius: inherit;
	}

	.nw-services-mega-ready .nw-services-mega__shell {
		box-sizing: border-box;
		width: 100%;
		padding: 22px 22px 26px;
		color: var(--nw-ink);
	}

	.nw-services-mega-ready .nw-services-mega__tabs {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
		gap: 14px;
	}

	.nw-services-mega-ready .nw-services-mega__tab {
		display: flex;
		align-items: center;
		gap: 11px;
		min-width: 0;
		min-height: 70px;
		padding: 13px;
		border: 1px solid var(--nw-border);
		border-radius: 14px;
		background: var(--nw-card);
		box-shadow: 0 2px 8px rgba(17, 21, 24, 0.04);
		color: var(--nw-ink);
		font: inherit;
		font-size: 14px;
		font-weight: 600;
		line-height: 1.25;
		text-align: left;
		cursor: pointer;
		transition: background-color 170ms ease, border-color 170ms ease, box-shadow 170ms ease, transform 170ms ease;
	}

	.nw-services-mega-ready .nw-services-mega__tab:hover,
	.nw-services-mega-ready .nw-services-mega__tab:focus-visible {
		border-color: color-mix(in srgb, var(--nw-accent) 72%, var(--nw-border));
		box-shadow: var(--nw-shadow);
		transform: translateY(-1px);
	}

	.nw-services-mega-ready .nw-services-mega__tab[aria-selected='true'] {
		border-color: var(--nw-accent);
		background: color-mix(in srgb, var(--nw-bg) 72%, white);
		box-shadow: 0 0 0 1px color-mix(in srgb, var(--nw-accent) 45%, transparent);
	}

	.nw-services-mega-ready .nw-services-mega__tab:focus-visible,
	.nw-services-mega-ready .nw-services-mega__service-link:focus-visible,
	.nw-services-mega-ready .nw-services-mega__panel:focus-visible {
		outline: 2px solid var(--nw-pink);
		outline-offset: 3px;
	}

	.nw-services-mega-ready .nw-services-mega__category-icon {
		display: inline-flex;
		flex: 0 0 36px;
		align-items: center;
		justify-content: center;
		width: 36px;
		height: 36px;
		border-radius: 10px;
		background: var(--nw-bg-soft);
		color: var(--nw-pink);
	}

	.nw-services-mega-ready .nw-services-mega__category-icon svg {
		width: 20px;
		height: 20px;
		fill: currentColor;
	}

	.nw-services-mega-ready .nw-services-mega__category-icon.is-placeholder::before {
		width: 10px;
		height: 10px;
		border-radius: 50%;
		background: currentColor;
		content: '';
	}

	.nw-services-mega-ready .nw-services-mega__tab-label {
		min-width: 0;
		text-wrap: balance;
	}

	.nw-services-mega-ready .nw-services-mega__body {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		gap: 20px;
		margin-top: 18px;
		align-items: stretch;
	}

	.nw-services-mega-ready .nw-services-mega__body.has-promo {
		grid-template-columns: minmax(0, 1fr) minmax(270px, 320px);
	}

	.nw-services-mega-ready .nw-services-mega__panels {
		display: grid;
		min-width: 0;
		border-radius: var(--nw-radius);
		background: var(--nw-bg-soft);
		overflow: hidden;
	}

	.nw-services-mega-ready .nw-services-mega__panel {
		z-index: 0;
		grid-area: 1 / 1;
		min-width: 0;
		min-height: 270px;
		padding: 26px 28px 30px;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transform: translateY(4px);
		transition: opacity 190ms ease, transform 190ms ease, visibility 190ms step-end;
	}

	.nw-services-mega-ready.ct-active .nw-services-mega__panel.is-active {
		z-index: 1;
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: translateY(0);
		transition: opacity 190ms ease, transform 190ms ease, visibility 0ms;
	}

	.nw-services-mega-ready .nw-services-mega__panel-title {
		margin: 0 0 24px;
		color: var(--nw-ink);
		font-size: 20px;
		font-weight: 700;
		letter-spacing: -0.2px;
		line-height: 1.25;
	}

	.nw-services-mega-ready .nw-services-mega__services {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
		gap: 18px 24px;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	/* Blocksy makes mega-menu items flex containers. Reset leaf rows so the
	 * inline-flex anchors keep their natural content width. */
	.nw-services-mega-ready .nw-services-mega__panel .nw-services-mega__services > .nw-services-mega__service {
		display: block;
		min-width: 0;
		margin: 0;
	}

	.nw-services-mega-ready .nw-services-mega__service-link {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		width: fit-content;
		max-width: 100%;
		min-width: 0;
		padding: 4px 2px;
		border: 0;
		border-radius: 0;
		background: transparent;
		box-shadow: none;
		color: var(--nw-ink) !important;
		--theme-icon-hover-color: var(--nw-ink);
		text-decoration: none;
		white-space: normal;
		transition: color 170ms ease;
	}

	.nw-services-mega-ready .nw-services-mega__service-link:hover,
	.nw-services-mega-ready .nw-services-mega__service-link[aria-current='page'] {
		color: var(--nw-pink) !important;
	}

	.nw-services-mega-ready .nw-services-mega__service-icon {
		display: inline-flex;
		flex: 0 0 18px;
		align-items: center;
		justify-content: center;
		width: 18px;
		height: 18px;
		padding: 0;
		border: 0;
		border-radius: 0;
		background: transparent;
		box-shadow: none;
		color: var(--nw-pink);
		line-height: 1;
	}

	.nw-services-mega-ready .nw-services-mega__service-icon svg {
		width: 18px;
		height: 18px;
		fill: currentColor;
	}

	/* Reserved-but-invisible accent: stays in the flex flow at its final 4px
	 * width so revealing it on hover/focus never reflows the row. */
	.nw-services-mega-ready .nw-services-mega__service-icon.is-placeholder {
		display: block;
		flex: 0 0 4px;
		width: 4px;
		height: 16px;
		border-radius: 2px;
		background: var(--nw-pink);
		transform: scaleY(0);
		transition: transform 180ms ease-out;
	}

	.nw-services-mega-ready .nw-services-mega__service-link:hover .nw-services-mega__service-icon.is-placeholder,
	.nw-services-mega-ready .nw-services-mega__service-link:focus-visible .nw-services-mega__service-icon.is-placeholder {
		transform: scaleY(1);
	}

	.nw-services-mega-ready .nw-services-mega__service-title {
		min-width: 0;
		color: inherit;
		font-size: 15px;
		font-weight: 500;
		line-height: 1.3;
		overflow-wrap: anywhere;
		white-space: normal;
	}

	/* Text shift only applies when a no-icon accent precedes the title. */
	.nw-services-mega-ready .nw-services-mega__service-icon.is-placeholder ~ .nw-services-mega__service-title {
		transition: transform 180ms ease-out;
	}

	.nw-services-mega-ready .nw-services-mega__service-link:hover .nw-services-mega__service-icon.is-placeholder ~ .nw-services-mega__service-title,
	.nw-services-mega-ready .nw-services-mega__service-link:focus-visible .nw-services-mega__service-icon.is-placeholder ~ .nw-services-mega__service-title {
		transform: translateX(5px);
	}

	.nw-services-mega-ready .nw-services-mega__promo,
	.nw-services-mega-ready .nw-services-mega__promo > .entry-content,
	.nw-services-mega-ready .nw-services-mega__promo .elementor,
	.nw-services-mega-ready .nw-services-mega__promo .elementor > .e-con,
	.nw-services-mega-ready .nw-services-mega__promo .e-con-inner {
		width: 100%;
		max-width: none;
		min-width: 0;
		height: 100%;
		margin: 0;
		padding: 0;
	}

	/* Elementor container widths are custom properties. The CTA used to share
	 * this Content Block with a sibling, so its generated value can remain 28%
	 * until Elementor regenerates CSS. It is the only child here now. */
	.nw-services-mega-ready .nw-services-mega__promo .e-con-inner > .e-con {
		--width: 100% !important;
		flex: 1 1 100%;
		width: 100% !important;
		max-width: 100%;
		min-width: 0;
	}

	.nw-services-mega-ready .nw-services-mega__promo {
		overflow: hidden;
		border-radius: var(--nw-radius);
	}
}

@media (min-width: 1000px) and (max-width: 1099.98px) {
	.nw-services-mega-ready .nw-services-mega__tabs {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 999.98px) {
	/* The variant-independent drawer skin — dark-panel label colours, icon
	 * fill, root chevron rotation, submenu dots, row padding — now lives in
	 * mega-menu-drawer.css, shared with the compact variant. Only the rules
	 * that depend on this menu's three-level hierarchy remain here, because
	 * the compact variant's children are leaves and never match
	 * .menu-item-has-children. */

	/* Category rows sit collapsed by default, so their labels fall outside the
	 * shared rule, which is gated on .dropdown-active. */
	.mobile-menu .nw-services-mega > .sub-menu > .nw-services-category > .ct-sub-menu-parent > .ct-menu-link {
		color: #ffffff !important;
	}

	/* Second-level chevrons. The shared sheet only rotates the root's. */
	.mobile-menu .nw-services-mega > .sub-menu > .menu-item-has-children.dropdown-active > .ct-sub-menu-parent > .ct-toggle-dropdown-mobile svg {
		transform: rotate(-180deg);
	}

	.mobile-menu .nw-services-mega > .sub-menu > .menu-item-has-children {
		border-bottom: 1px solid color-mix(in srgb, var(--nw-border) 62%, transparent);
	}

	.mobile-menu .nw-services-mega > .sub-menu > .menu-item-has-children:last-child {
		border-bottom: 0;
	}

	.mobile-menu .nw-services-mega > .sub-menu > .menu-item-has-children > .ct-sub-menu-parent {
		min-height: 52px;
	}

	/* Down from the drawer's 20px/700 so an icon + the longest category label +
	 * the chevron all fit on one line inside the 90vw panel. */
	.mobile-menu .nw-services-mega > .sub-menu > .menu-item-has-children > .ct-sub-menu-parent > .ct-menu-link {
		font-size: 16px !important;
	}

	/* Colour-only active state — more specific (0,7,0) than the white rule
	 * above (0,6,0), so it wins regardless of order. */
	.mobile-menu .nw-services-mega > .sub-menu > .menu-item-has-children.dropdown-active > .ct-sub-menu-parent > .ct-menu-link {
		color: var(--nw-pink) !important;
	}

	.mobile-menu .nw-services-mega > .sub-menu > .menu-item-has-children > .sub-menu {
		padding: 0 12px 10px 28px;
	}

	.mobile-menu .nw-services-mega > .sub-menu > .menu-item-has-children > .sub-menu .ct-menu-link {
		padding-block: 8px;
		color: #ffffff !important;
		font-size: 15px;
		transition: color 120ms ease-out;
	}

	/* Tap feedback: .is-clicked (set in services-mega-menu.js) keeps the link
	 * pink while navigation is pending; :active is a same-effect fallback for
	 * the moment before JS attaches the class. */
	.mobile-menu .nw-services-mega > .sub-menu > .menu-item-has-children > .sub-menu .ct-menu-link:active,
	.mobile-menu .nw-services-mega > .sub-menu > .menu-item-has-children > .sub-menu .ct-menu-link.is-clicked {
		color: var(--nw-pink) !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.nw-services-mega-ready .nw-services-mega__tab,
	.nw-services-mega-ready .nw-services-mega__panel,
	.nw-services-mega-ready .nw-services-mega__service-link,
	.nw-services-mega-ready .nw-services-mega__service-icon,
	.nw-services-mega-ready .nw-services-mega__service-title,
	.mobile-menu .nw-services-mega > .sub-menu > .menu-item-has-children > .sub-menu .ct-menu-link {
		transition: none !important;
	}
}
