.menu-pro {display: flex; justify-content: center; width: 100%; position: relative;}
.menu-pro ul {margin: 0;}
.menu-pro .nivel1 {display: flex; gap: 40px; flex-wrap: wrap;}
.menu-pro a {transition: ease all .5s;}
.menu-pro a:hover {color: var(--primary);}
.menu-pro .grupo-vip {color: var(--green);}

.menu-pro .submenu {position: absolute; width: 100%; left: 0; top: 100%; padding: 40px; background: #fff; gap: 12px; transform: translateY(10px); opacity: 0; visibility: hidden; display: flex; box-shadow: rgb(0 0 0 / .08) 0 10px 24px;}
.menu-pro .column-menu {width: auto; padding: 16px; white-space: nowrap;}
.menu-pro .column-menu ul {display: flex; flex-direction: column; gap: 8px;}
.menu-pro .nivel1-item h5 a {font-family: var(--font-secondary); font-weight: 600; text-transform: uppercase; font-size: 14px; display: flex; align-items: center; gap: 5px; padding: 32px 0;}
.menu-pro .nivel1-item i {font-size: 12px;}
.menu-pro .nivel1-item:hover > .submenu {display: flex; transform: translateY(0); opacity: 1; visibility: visible; transition: ease all .5s;}
.menu-pro .nivel1-item:hover > .position-relative .column-menu {display: flex; transform: translateY(0); opacity: 1; visibility: visible;}

.menu-pro .nivel2 {flex: 1; display: grid; gap: 56px; grid-template-columns: repeat(3, 1fr);}
.menu-pro .nivel2 > li {flex: 1; white-space: nowrap;}
.menu-pro .nivel2 > li > a {font-size: 14px; font-weight: 600; text-transform: uppercase; font-family: var(--font-secondary); }
.menu-pro .nivel2 > li > a:first-child {border-bottom: 1px solid #E6E5E5; padding-bottom: 16px; margin-bottom: 16px; display: block;}

.menu-pro .nivel3 {display: flex; flex-direction: column; gap: 16px;}

@media (max-width: 1400px) {
	.menu-pro .nivel2 {gap: 24px;}
}

@media (max-width: 991px) {
	.menu-pro {flex-direction: column;}
	.menu-pro .title-category {font-size: 18px; margin-bottom: 12px; font-weight: 600;}
	.menu-pro .menu-pro-item {font-size: 14px; font-weight: 500; padding: 6px 0; display: flex; align-items: center;}
	.menu-pro .accordion-button::after {width: 14px; height: 14px; background-size: contain;}
	.menu-pro .accordion-button:not(.collapsed) {color: var(--primary);}
	.menu-pro .accordion-body {padding: 8px; background: #eee;}
	.menu-pro .submenu-item h4 {font-size: 14px; font-weight: 600;}
	.menu-pro .submenu-items {display: flex; flex-direction: column; gap: 8px;}
}