/* WP360 Vendors Menu: VENDORS and INSPIRATION dropdown panels (see wp360-vendors-menu.php). Pixels: the theme sets html to 10px. */
.wp360-vm {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 320px;
	gap: 28px 40px;
	width: 100%;
	box-sizing: border-box;
	padding: 4px 0 2px;
	font-family: Montserrat, "Helvetica Neue", Arial, sans-serif;
	text-align: left;
}
.wp360-vm__main { min-width: 0; }
.wp360-vm__kicker {
	margin: 0 0 10px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: #C9961E;
}
.wp360-vm__cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 32px; }
.wp360-vm__cols--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.wp360-vm ul.wp360-vm__list { margin: 0; padding: 0; list-style: none; }
.wp360-vm ul.wp360-vm__list li { margin: 0; padding: 0; list-style: none; }
.wp360-vm ul.wp360-vm__list a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 8px 0;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.35;
	color: #203D67;
	text-decoration: none;
	border-bottom: 1px solid rgba(32, 61, 103, .08);
}
.wp360-vm ul.wp360-vm__list li:last-child a { border-bottom: 0; }
.wp360-vm ul.wp360-vm__list a span {
	flex: none;
	min-width: 26px;
	padding: 2px 8px;
	border-radius: 999px;
	background: #EAF0F7;
	font-size: 12px;
	font-weight: 700;
	text-align: center;
	color: #203D67;
}
.wp360-vm ul.wp360-vm__list a:hover,
.wp360-vm ul.wp360-vm__list a:focus-visible { color: #16294A; text-decoration: underline; text-underline-offset: 3px; }
.wp360-vm__foot {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 20px;
	margin-top: 18px;
	padding-top: 16px;
	border-top: 1px solid rgba(32, 61, 103, .12);
}
.wp360-vm a.wp360-vm__btn {
	display: inline-flex;
	align-items: center;
	min-height: 48px;
	padding: 0 22px;
	border-radius: 999px;
	background: #203D67;
	color: #FFFFFF;
	font-size: 15px;
	font-weight: 700;
	text-decoration: none;
	transition: background .2s ease;
}
.wp360-vm a.wp360-vm__btn:hover, .wp360-vm a.wp360-vm__btn:focus-visible { background: #16294A; color: #FFFFFF; }
.wp360-vm__note { font-size: 14px; color: #5C6676; }
.wp360-vm a.wp360-vm__card {
	display: flex;
	flex-direction: column;
	align-self: start;
	border-radius: 16px;
	overflow: hidden;
	background: #16294A;
	color: #FFFFFF;
	text-decoration: none;
	box-shadow: 0 16px 40px rgba(22, 41, 74, .18);
}
.wp360-vm .wp360-vm__photo { display: block; width: 100%; height: 180px; max-width: none; margin: 0; border-radius: 0; object-fit: cover; object-position: 50% 40%; }
.wp360-vm__card-body { display: flex; flex-direction: column; gap: 8px; padding: 18px 20px 20px; }
.wp360-vm__card-kicker { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #F1BC4A; }
.wp360-vm__card-title { font-family: "Cormorant Garamond", Georgia, serif; font-size: 25px; font-weight: 600; line-height: 1.15; color: #FFFFFF; }
.wp360-vm__card-text { font-size: 14px; line-height: 1.45; color: #C9D4E3; }
.wp360-vm__card-btn {
	align-self: flex-start;
	margin-top: 6px;
	padding: 11px 18px;
	border-radius: 999px;
	background: #F1BC4A;
	color: #16294A;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	transition: background .2s ease;
}
.wp360-vm a.wp360-vm__card:hover .wp360-vm__card-btn, .wp360-vm a.wp360-vm__card:focus-visible .wp360-vm__card-btn { background: #FFFFFF; }
/* The ElementsKit panel wrapper: let the panel be wide enough for the grid and lose its default padding box. */
.elementskit-megamenu-panel .wp360-vm { min-width: 0; }
@media (max-width: 1199px) {
	.wp360-vm { grid-template-columns: minmax(0, 1fr); }
	.wp360-vm a.wp360-vm__card { flex-direction: row; align-items: stretch; }
	.wp360-vm .wp360-vm__photo { width: 42%; height: auto; min-height: 170px; }
}
@media (max-width: 1023px) {
	.wp360-vm { gap: 18px; padding: 4px 0 8px; }
	.wp360-vm__cols, .wp360-vm__cols--2 { grid-template-columns: minmax(0, 1fr); }
	.wp360-vm ul.wp360-vm__list li:last-child a { border-bottom: 1px solid rgba(32, 61, 103, .08); }
	.wp360-vm ul.wp360-vm__list a { padding: 10px 0; }
	.wp360-vm a.wp360-vm__card { flex-direction: column; }
	.wp360-vm .wp360-vm__photo { width: 100%; height: 180px; }
	.wp360-vm__foot { flex-direction: column; align-items: flex-start; }
	.wp360-vm__note { font-size: 15px; }
}
/* The ElementsKit panel itself: the old Elementor sections carried the white background, so the panel needs its own now. */
.elementskit-megamenu-panel:has(.wp360-vm) { background: #FFFFFF; padding: 28px 0 30px; border-top: 1px solid rgba(32, 61, 103, .10); box-shadow: 0 24px 48px -20px rgba(22, 41, 74, .35); }
.elementskit-megamenu-panel:has(.wp360-vm) > .elementor { max-width: 1140px; margin: 0 auto; padding: 0 20px; }
/* Phone and tablet: the panel sits inside the navy off-canvas menu, so the text goes light. */
@media (max-width: 1023px) {
	.elementskit-megamenu-panel:has(.wp360-vm) { background: transparent; padding: 6px 0 14px; border-top: 0; box-shadow: none; }
	.elementskit-megamenu-panel:has(.wp360-vm) > .elementor { padding: 0; }
	.elementskit-menu-offcanvas-elements .wp360-vm ul.wp360-vm__list a { color: #FFFFFF; border-bottom-color: rgba(255, 255, 255, .14); }
	.elementskit-menu-offcanvas-elements .wp360-vm ul.wp360-vm__list a span { background: rgba(255, 255, 255, .16); color: #FFFFFF; }
	.elementskit-menu-offcanvas-elements .wp360-vm ul.wp360-vm__list a:hover { color: #F1BC4A; }
	.elementskit-menu-offcanvas-elements .wp360-vm__foot { border-top-color: rgba(255, 255, 255, .16); }
	.elementskit-menu-offcanvas-elements .wp360-vm a.wp360-vm__btn { background: #F1BC4A; color: #16294A; }
	.elementskit-menu-offcanvas-elements .wp360-vm__note { color: #C9D4E3; }
	.elementskit-menu-offcanvas-elements .wp360-vm a.wp360-vm__card { border: 1px solid rgba(255, 255, 255, .16); box-shadow: none; }
	/* ElementsKit's default placeholder logo in the off-canvas header has no business showing. */
	.elementskit-nav-identity-panel img[src*="placeholder"] { display: none; }
}
/* Phones and tablets: this install's root scrolls 67px wider than the screen (body clips, html does not), so mobile
   Chrome lays every page out at 457px and zooms it down. Clipping at the root keeps the layout at the real width. */
@media (max-width: 1023px) {
	html { overflow-x: hidden; }
}
