/* Whistleblowing product mega menu */
@media (min-width: 1025px) {
	.tt-main-navigation:not(.tt-vertical-navigation) #main-menu > li:first-child {
		position: relative;
	}

	.tt-main-navigation:not(.tt-vertical-navigation) #main-menu > li:first-child > .sub-menu {
		left: 0 !important;
		width: 780px !important;
		min-width: 780px !important;
		max-width: calc(100vw - 48px) !important;
		margin-left: 0 !important;
		margin-top: 0 !important;
		padding: 28px 24px !important;
		border: 1px solid rgba(13, 42, 82, 0.08);
		border-radius: 8px;
		box-shadow: 0 14px 36px rgba(15, 23, 42, 0.14);
		transform: none;
		box-sizing: border-box;
	}

	.tt-main-navigation:not(.tt-vertical-navigation) #main-menu > li:first-child:hover > .sub-menu,
	.tt-main-navigation:not(.tt-vertical-navigation) #main-menu > li:first-child > .sub-menu[aria-hidden="false"] {
		display: flex !important;
	}

	.tt-main-navigation:not(.tt-vertical-navigation) #main-menu > li:first-child > .sub-menu:before {
		content: "";
		position: absolute;
		top: -8px;
		left: 88px;
		width: 14px;
		height: 14px;
		background: #fff;
		border-top: 1px solid rgba(13, 42, 82, 0.08);
		border-left: 1px solid rgba(13, 42, 82, 0.08);
		transform: rotate(45deg);
	}

	.tt-main-navigation:not(.tt-vertical-navigation) #main-menu > li:first-child > .sub-menu > li {
		flex: 1 1 220px;
		width: auto !important;
		min-width: 220px;
		padding: 0 28px;
		border-right: 1px solid #e3e8f0;
		box-sizing: border-box;
	}

	.tt-main-navigation:not(.tt-vertical-navigation) #main-menu > li:first-child > .sub-menu > li:last-child {
		border-right: 0;
	}

	.tt-main-navigation:not(.tt-vertical-navigation) #main-menu > li:first-child > .sub-menu > li > a {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 20px;
		height: 100%;
		padding: 14px 0 !important;
		white-space: normal !important;
	}

	.tt-main-navigation:not(.tt-vertical-navigation) #main-menu > li:first-child > .sub-menu > li:nth-child(1) > a:before {
		content: "";
		display: block;
		width: 100%;
		height: 53px;
		border-radius: 12px;
		background-color: #f5f8fb;
		background-position: center;
		background-repeat: no-repeat;
		background-size: contain;
		background-image: url("https://whistleblowing-form.de/wp-content/uploads/2026/06/whistleblowing_plugin_product_starter-1.svg");
	}

	.tt-main-navigation:not(.tt-vertical-navigation) #main-menu > li:first-child > .sub-menu > li:nth-child(2) > a:before {
		content: "";
		display: block;
		width: 100%;
		height: 53px;
		border-radius: 12px;
		background-color: #f5f8fb;
		background-position: center;
		background-repeat: no-repeat;
		background-size: contain;
		background-image: url("https://whistleblowing-form.de/wp-content/uploads/2026/06/whistleblowing_plugin_product_business-1.svg");
	}

	.tt-main-navigation:not(.tt-vertical-navigation) #main-menu > li:first-child > .sub-menu > li:nth-child(3) > a:before {
		content: "";
		display: block;
		width: 100%;
		height: 53px;
		border-radius: 12px;
		background-color: #f5f8fb;
		background-position: center;
		background-repeat: no-repeat;
		background-size: contain;
		background-image: url("https://whistleblowing-form.de/wp-content/uploads/2026/06/visual-bilder-for-contact-form-7-1.svg");
	}

	.tt-main-navigation:not(.tt-vertical-navigation) #main-menu > li:first-child > .sub-menu > li > a > span {
		padding: 0 !important;
		font-size: 16px;
		line-height: 1.45;
		font-weight: 600;
		color: #004aad;
	}

	.tt-main-navigation:not(.tt-vertical-navigation) #main-menu > li:first-child > .sub-menu > li > a > span:after {
		padding-left: 0;
		margin-top: 18px !important;
		font-size: 15px;
		line-height: 2.2;
		white-space: pre-line !important;
		word-break: keep-all;
		background-image: linear-gradient(to right, #b2b9c8 100%, rgba(255,255,255,0) 0), linear-gradient(to right, #b2b9c8 100%, rgba(255,255,255,0) 0) !important;
		background-size: calc(100% - 10px) 1px, calc(100% - 10px) 1px !important;
		background-position: 0px 1.85em, 5px 4.1em !important;
		background-repeat: no-repeat;
	}

	.tt-main-navigation:not(.tt-vertical-navigation) > div > ul > li:not(.cesis_megamenu) .sub-menu li > a > span:hover {
		box-shadow: none !important;
		color: inherit !important;
		background: transparent !important;
	}

	body:not(.rtl) .tt-main-navigation:not(.tt-vertical-navigation) > div > ul > li:not(.cesis_megamenu) .sub-menu li.current-menu-item > a > span {
		box-shadow: none !important;
	}

	.tt-main-navigation:not(.tt-vertical-navigation) #main-menu > li:first-child > .sub-menu > li:nth-child(1) > a > span:after {
		content: "Einfache Integration\A" "Flexibel anpassbar\A" "Sofort einsatzbereit";
		display: block;
		position: static !important;
		width: auto !important;
		height: auto !important;
		left: auto !important;
		bottom: auto !important;
		white-space: pre-line !important;
		padding-left: 0;
		margin-top: 20px;
		font-size: 15px;
		font-weight: 400;
		color: #5a6d87;
		line-height: 2.05;
		background-image: linear-gradient(to right, #b2b9c8 100%, rgba(255,255,255,0) 0), linear-gradient(to right, #b2b9c8 100%, rgba(255,255,255,0) 0) !important;
		background-size: calc(100% - 10px) 1px, calc(100% - 10px) 1px !important;
		background-position: 5px 2.1em !important, 5px 4.3em !important;
		background-repeat: no-repeat;
	}

	.tt-main-navigation:not(.tt-vertical-navigation) #main-menu > li:first-child > .sub-menu > li:nth-child(2) > a > span:after {
		content: "Einfache Integration\A" "Flexibel anpassbar\A" "Sofort einsatzbereit";
		display: block;
		position: static !important;
		width: auto !important;
		height: auto !important;
		left: auto !important;
		bottom: auto !important;
		white-space: pre-line !important;
		padding-left: 0;
		margin-top: 20px;
		font-size: 15px;
		font-weight: 400;
		color: #5a6d87;
		line-height: 2.05;
		background-image: linear-gradient(to right, #b2b9c8 100%, rgba(255,255,255,0) 0), linear-gradient(to right, #b2b9c8 100%, rgba(255,255,255,0) 0) !important;
		background-size: calc(100% - 10px) 1px, calc(100% - 10px) 1px !important;
		background-position: 5px 2.1em !important, 5px 4.3em !important;
		background-repeat: no-repeat;
	}

	.tt-main-navigation:not(.tt-vertical-navigation) #main-menu > li:first-child > .sub-menu > li:nth-child(3) > a > span:after {
		content: "Intuitives Drag-und-Drop\A" "Echtzeit-Vorschau\A" "Integrierter Einsendungs-Viewer";
		display: block;
		position: static !important;
		width: auto !important;
		height: auto !important;
		left: auto !important;
		bottom: auto !important;
		white-space: pre-line !important;
		padding-left: 0;
		margin-top: 20px;
		font-size: 15px;
		font-weight: 400;
		color: #5a6d87;
		line-height: 2.05;
		background-image: linear-gradient(to right, #b2b9c8 100%, rgba(255,255,255,0) 0), linear-gradient(to right, #b2b9c8 100%, rgba(255,255,255,0) 0) !important;
		background-size: calc(100% - 10px) 1px, calc(100% - 10px) 1px !important;
		background-position: 5px 2.1em !important, 5px 4.3em !important;
		background-repeat: no-repeat;
	}
}

@media (max-width: 1024px) {
	.tt-main-navigation #main-menu > li:first-child > .sub-menu > li > a:before {
		display: none;
	}

	.tt-main-navigation #main-menu > li:first-child > .sub-menu {
		padding: 18px 16px !important;
	}

	.tt-main-navigation #main-menu > li:first-child > .sub-menu > li {
		padding: 12px 0;
		border-right: 0;
		border-bottom: 1px solid #e3e8f0;
	}

	.tt-main-navigation #main-menu > li:first-child > .sub-menu > li:last-child {
		border-bottom: 0;
	}

	.tt-main-navigation #main-menu > li:first-child > .sub-menu > li > a {
		gap: 12px;
		padding: 14px 0 !important;
	}

	.tt-main-navigation #main-menu > li:first-child > .sub-menu > li > a > span:after {
		margin-top: 10px;
		font-size: 14px;
		line-height: 1.7;
		padding-left: 42px;
		background-position: left 0.2em top 0.15em, left 0.2em top 1.7em, left 0.2em top 3.3em;
		background-size: 18px 18px, 18px 18px, 18px 18px;
	}
}