/*
 * M-Sistemos primary navigation: accessible Products dropdown.
 * Kept separate from YellowPencil output so it can be maintained safely.
 */

body .wp-site-blocks .ms-page .ms-nav > .ms-nav-dropdown {
	position: relative !important;
	display: inline-flex !important;
	align-items: center !important;
	overflow: visible !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-services-checkbox {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	margin: -1px !important;
	padding: 0 !important;
	overflow: hidden !important;
	clip: rect(0 0 0 0) !important;
	clip-path: inset(50%) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-dropdown-trigger {
	position: relative !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 7px !important;
	padding: 10px 0 12px !important;
	color: rgba(19, 8, 5, 0.82) !important;
	font-family: "Jura", "Bai Jamjuree", Arial, sans-serif !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	letter-spacing: 0.14em !important;
	text-transform: uppercase !important;
	cursor: pointer !important;
	user-select: none !important;
	transition: color 0.3s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-dropdown-trigger::before {
	content: "" !important;
	position: absolute !important;
	left: 0 !important;
	bottom: 4px !important;
	width: 100% !important;
	height: 1px !important;
	background: currentColor !important;
	opacity: 0.35 !important;
	transform: scaleX(0) !important;
	transform-origin: left center !important;
	transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-dropdown-trigger:hover,
body .wp-site-blocks .ms-page .ms-nav .ms-nav-services-checkbox:checked + .ms-nav-dropdown-trigger {
	color: #0c0b09 !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-dropdown-trigger:hover::before,
body .wp-site-blocks .ms-page .ms-nav .ms-nav-services-checkbox:checked + .ms-nav-dropdown-trigger::before {
	transform: scaleX(1) !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-dropdown-trigger:focus-visible {
	outline: 2px solid rgba(164, 129, 53, 0.5) !important;
	outline-offset: 7px !important;
	border-radius: 2px !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-dropdown-chevron {
	width: 13px !important;
	height: 13px !important;
	flex: 0 0 13px !important;
	transition: transform 0.25s ease !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-services-checkbox:checked + .ms-nav-dropdown-trigger .ms-nav-dropdown-chevron {
	transform: rotate(180deg) !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-dropdown-panel {
	--ms-dd-left: 50vw;
	--ms-dd-top: 88px;
	position: fixed !important;
	z-index: 100010 !important;
	left: var(--ms-dd-left) !important;
	top: var(--ms-dd-top) !important;
	width: min(520px, calc(100vw - 32px)) !important;
	padding: 0 !important;
	overflow: hidden !important;
	background:
		radial-gradient(circle at 12% 15%, rgba(177, 139, 62, 0.16), transparent 33%),
		linear-gradient(145deg, #17140e 0%, #0b0b0a 58%, #070707 100%) !important;
	border: 1px solid rgba(202, 168, 88, 0.26) !important;
	border-radius: 3px !important;
	box-shadow:
		0 30px 80px rgba(8, 7, 5, 0.34),
		0 8px 28px rgba(8, 7, 5, 0.2),
		inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
	opacity: 0 !important;
	visibility: hidden !important;
	pointer-events: none !important;
	transform: translate(-50%, -8px) !important;
	transition:
		opacity 0.2s ease,
		transform 0.28s cubic-bezier(0.22, 1, 0.36, 1),
		visibility 0.2s ease !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-services-checkbox:checked ~ .ms-nav-dropdown-panel {
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto !important;
	transform: translate(-50%, 0) !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-products-head {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	min-height: 41px !important;
	padding: 0 18px !important;
	color: rgba(231, 220, 197, 0.58) !important;
	border-bottom: 1px solid rgba(202, 168, 88, 0.15) !important;
	font-family: "Jura", Arial, sans-serif !important;
	font-size: 10px !important;
	font-weight: 700 !important;
	letter-spacing: 0.18em !important;
	text-transform: uppercase !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-products-count {
	display: inline-grid !important;
	place-items: center !important;
	width: 25px !important;
	height: 20px !important;
	color: #d1b46f !important;
	border: 1px solid rgba(202, 168, 88, 0.26) !important;
	border-radius: 999px !important;
	font-size: 9px !important;
	letter-spacing: 0.08em !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-products-grid {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-link {
	display: grid !important;
	grid-template-columns: 132px minmax(0, 1fr) 24px !important;
	align-items: stretch !important;
	gap: 20px !important;
	min-height: 154px !important;
	padding: 18px !important;
	color: #f7f4ed !important;
	text-decoration: none !important;
	background: linear-gradient(90deg, rgba(202, 168, 88, 0.035), transparent 58%) !important;
	border: 0 !important;
	transition:
		background 0.22s ease,
		color 0.22s ease !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-link:hover {
	color: #fff !important;
	background: linear-gradient(90deg, rgba(202, 168, 88, 0.105), rgba(202, 168, 88, 0.025)) !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-link:focus-visible {
	outline: 2px solid rgba(208, 177, 103, 0.78) !important;
	outline-offset: -3px !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-visual {
	position: relative !important;
	display: grid !important;
	place-items: center !important;
	min-width: 0 !important;
	min-height: 118px !important;
	overflow: hidden !important;
	background:
		linear-gradient(rgba(202, 168, 88, 0.055) 1px, transparent 1px),
		linear-gradient(90deg, rgba(202, 168, 88, 0.055) 1px, transparent 1px),
		rgba(8, 7, 5, 0.54) !important;
	background-size: 18px 18px !important;
	border: 1px solid rgba(202, 168, 88, 0.2) !important;
	border-radius: 2px !important;
	box-shadow: inset 0 0 35px rgba(202, 168, 88, 0.07) !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-visual::after {
	content: "LIVE" !important;
	position: absolute !important;
	right: 8px !important;
	top: 8px !important;
	padding-left: 9px !important;
	color: rgba(232, 218, 184, 0.66) !important;
	font-family: "Jura", Arial, sans-serif !important;
	font-size: 7px !important;
	font-weight: 700 !important;
	letter-spacing: 0.14em !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-visual::before {
	content: "" !important;
	position: absolute !important;
	z-index: 2 !important;
	right: 38px !important;
	top: 11px !important;
	width: 4px !important;
	height: 4px !important;
	background: #c9a75b !important;
	border-radius: 50% !important;
	box-shadow: 0 0 9px rgba(201, 167, 91, 0.8) !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-alpr-icon {
	width: 112px !important;
	height: 82px !important;
	overflow: visible !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-scan-corner,
body .wp-site-blocks .ms-page .ms-nav .ms-nav-car,
body .wp-site-blocks .ms-page .ms-nav .ms-nav-car-detail {
	fill: none !important;
	stroke: #cfb77e !important;
	stroke-linecap: round !important;
	stroke-linejoin: round !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-scan-corner {
	stroke-width: 1.4 !important;
	opacity: 0.55 !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-car {
	fill: rgba(202, 168, 88, 0.08) !important;
	stroke-width: 1.6 !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-car-detail {
	stroke-width: 1.2 !important;
	opacity: 0.7 !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-plate {
	fill: rgba(213, 185, 116, 0.2) !important;
	stroke: #f0dfb7 !important;
	stroke-width: 1 !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-scan-line {
	fill: none !important;
	stroke: #c9a75b !important;
	stroke-width: 1.25 !important;
	opacity: 0.9 !important;
	filter: drop-shadow(0 0 4px rgba(201, 167, 91, 0.85)) !important;
	transform-origin: center !important;
	transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-link:hover .ms-nav-scan-line {
	transform: translateY(11px) !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-copy {
	display: flex !important;
	flex-direction: column !important;
	justify-content: center !important;
	align-items: flex-start !important;
	gap: 5px !important;
	min-width: 0 !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-kicker {
	color: #c4a45c !important;
	font-family: "Jura", Arial, sans-serif !important;
	font-size: 8px !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	letter-spacing: 0.15em !important;
	text-transform: uppercase !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-copy strong {
	color: #f8f5ee !important;
	font-family: "Jura", Arial, sans-serif !important;
	font-size: 20px !important;
	font-weight: 700 !important;
	line-height: 1.15 !important;
	letter-spacing: 0.035em !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-copy small {
	max-width: 270px !important;
	color: rgba(235, 228, 211, 0.68) !important;
	font-family: "Bai Jamjuree", Arial, sans-serif !important;
	font-size: 11px !important;
	line-height: 1.45 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-meta {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 5px !important;
	margin-top: 3px !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-meta span {
	padding: 3px 6px !important;
	color: rgba(230, 215, 181, 0.66) !important;
	border: 1px solid rgba(202, 168, 88, 0.17) !important;
	border-radius: 2px !important;
	font-family: "Jura", Arial, sans-serif !important;
	font-size: 7px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-arrow {
	align-self: center !important;
	color: rgba(213, 184, 115, 0.7) !important;
	font-family: Arial, sans-serif !important;
	font-size: 18px !important;
	line-height: 1 !important;
	transition:
		color 0.22s ease,
		transform 0.22s ease !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-link:hover .ms-nav-product-arrow {
	color: #f2dfb3 !important;
	transform: translate(2px, -2px) !important;
}

/*
 * Two-product mega menu matched to the approved visual reference.
 */
body .wp-site-blocks .ms-page .ms-nav .ms-nav-dropdown-panel {
	width: min(1028px, calc(100vw - 40px)) !important;
	overflow: visible !important;
	background: #fff !important;
	border: 1px solid rgba(27, 39, 52, 0.18) !important;
	border-radius: 4px !important;
	box-shadow: 0 18px 42px rgba(10, 18, 28, 0.2) !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-dropdown-panel::before {
	content: "" !important;
	position: absolute !important;
	left: 50% !important;
	top: -8px !important;
	z-index: -1 !important;
	width: 15px !important;
	height: 15px !important;
	background: #fff !important;
	border-top: 1px solid rgba(27, 39, 52, 0.18) !important;
	border-left: 1px solid rgba(27, 39, 52, 0.18) !important;
	transform: translateX(-50%) rotate(45deg) !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-products-grid {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	overflow: hidden !important;
	border-radius: inherit !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-link {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) 174px !important;
	align-items: stretch !important;
	gap: 20px !important;
	height: 214px !important;
	min-height: 214px !important;
	padding: 24px 30px !important;
	color: #1e2935 !important;
	background: #fff !important;
	border: 0 !important;
	border-right: 1px solid rgba(30, 42, 54, 0.16) !important;
	transition: background 0.2s ease !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-link:last-child {
	border-right: 0 !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-link:hover {
	color: #172330 !important;
	background: #fafaf8 !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-link:focus-visible {
	outline: 2px solid rgba(38, 61, 86, 0.55) !important;
	outline-offset: -4px !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-copy {
	display: flex !important;
	flex-direction: column !important;
	justify-content: flex-start !important;
	align-items: flex-start !important;
	gap: 0 !important;
	min-width: 0 !important;
	padding-top: 2px !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-kicker {
	margin: 0 0 15px !important;
	color: #354252 !important;
	font-family: "Jura", Arial, sans-serif !important;
	font-size: 10px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	letter-spacing: 0.18em !important;
	text-transform: uppercase !important;
	white-space: nowrap !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-copy strong {
	margin: 0 0 11px !important;
	color: #182637 !important;
	font-family: "Bai Jamjuree", Arial, sans-serif !important;
	font-size: 24px !important;
	font-weight: 400 !important;
	line-height: 1 !important;
	letter-spacing: -0.025em !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-copy small {
	max-width: 250px !important;
	margin: 0 !important;
	color: #6a7078 !important;
	font-family: "Bai Jamjuree", Arial, sans-serif !important;
	font-size: 13px !important;
	font-weight: 400 !important;
	line-height: 1.5 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-cta {
	display: inline-flex !important;
	align-items: center !important;
	gap: 18px !important;
	margin-top: auto !important;
	color: #294663 !important;
	font-family: "Jura", Arial, sans-serif !important;
	font-size: 10px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	letter-spacing: 0.14em !important;
	text-transform: uppercase !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-cta b {
	font-family: Arial, sans-serif !important;
	font-size: 17px !important;
	font-weight: 400 !important;
	line-height: 1 !important;
	transition: transform 0.2s ease !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-link:hover .ms-nav-product-cta b {
	transform: translateX(4px) !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-visual {
	position: relative !important;
	display: grid !important;
	place-items: center !important;
	min-width: 0 !important;
	min-height: 0 !important;
	overflow: visible !important;
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-visual::before,
body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-visual::after {
	content: none !important;
	display: none !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-diagram {
	width: 174px !important;
	height: 150px !important;
	overflow: visible !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-diagram-line {
	fill: none !important;
	stroke: #848a8f !important;
	stroke-width: 1.15 !important;
	stroke-linecap: round !important;
	stroke-linejoin: round !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-diagram-dash {
	fill: none !important;
	stroke: #b49a64 !important;
	stroke-width: 1 !important;
	stroke-dasharray: 3 4 !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-diagram-accent {
	fill: none !important;
	stroke: #ad8d43 !important;
	stroke-width: 3 !important;
	stroke-linecap: square !important;
	stroke-linejoin: miter !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-diagram-dot {
	fill: #55a7ca !important;
	stroke: none !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-diagram-plate {
	fill: #fff !important;
	stroke: #b49a64 !important;
	stroke-width: 1.4 !important;
}

body .wp-site-blocks .ms-page .ms-nav .ms-nav-diagram-text {
	fill: #4b5055 !important;
	font-family: "Bai Jamjuree", Arial, sans-serif !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	letter-spacing: 0.08em !important;
}

@media (max-width: 1100px) {
	body .wp-site-blocks .ms-page .ms-mobile-products {
		border-bottom: 1px solid rgba(19, 8, 5, 0.07) !important;
	}

	body .wp-site-blocks .ms-page .ms-mobile-products summary {
		position: relative !important;
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		min-height: 44px !important;
		padding: 0 14px !important;
		color: rgba(19, 8, 5, 0.88) !important;
		font-family: "Jura", "Bai Jamjuree", Arial, sans-serif !important;
		font-size: 13px !important;
		font-weight: 700 !important;
		letter-spacing: 0.12em !important;
		text-transform: uppercase !important;
		cursor: pointer !important;
		list-style: none !important;
	}

	body .wp-site-blocks .ms-page .ms-mobile-products summary::-webkit-details-marker {
		display: none !important;
	}

	body .wp-site-blocks .ms-page .ms-mobile-products summary::after {
		content: "+" !important;
		color: #8b6d2e !important;
		font-size: 18px !important;
		font-weight: 400 !important;
		transition: transform 0.2s ease !important;
	}

	body .wp-site-blocks .ms-page .ms-mobile-products[open] summary::after {
		transform: rotate(45deg) !important;
	}

	body .wp-site-blocks .ms-page .ms-mobile-products a {
		min-height: 54px !important;
		padding-left: 28px !important;
		background: #f5f2eb !important;
		font-size: 12px !important;
		letter-spacing: 0.08em !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	body .wp-site-blocks .ms-page .ms-nav .ms-nav-dropdown-panel,
	body .wp-site-blocks .ms-page .ms-nav .ms-nav-dropdown-trigger::before,
	body .wp-site-blocks .ms-page .ms-nav .ms-nav-dropdown-chevron,
	body .wp-site-blocks .ms-page .ms-nav .ms-nav-product-link {
		transition: none !important;
	}
}
