.header-parent .top-bg {background: var(--cor1); z-index: 999;}
.top-bg .top {display: flex; align-items: center;font: 400 14px montserrat; color: var(--branco); justify-content: space-between; padding: 4.5px 0;}
.top .item {display: flex; align-items: center; gap: 5px;font: 400 12.43px montserrat;}
.top .item b {font: 700 15.54px montserrat;}
.top .redes {display: flex; align-items: center; gap: 10px;}

.header-parent .nav-bg {padding: 15.5px 0;}
.header-parent .nav {display: flex; align-items: center; justify-content: space-between; gap: 60px;}
.header-parent .nav > * {display: flex; align-items: center;}
.header-parent .nav .pages {display: flex; align-items: center; justify-content: space-between; width: 100%;}
.header-parent .pagina .nome {font: 500 14px montserrat;}
.header-parent .pagina.loja-virtual {background-color: #FF7A33; color: var(--branco); padding: 5px 10px; border-radius: 14px; line-height: normal;}
.header-parent .pagina.loja-virtual .nome {line-height: normal;}

.header-parent .mobile,
.header-parent .close,
.header-parent .bx {display: none;}

.header-parent .top-bg .item p {transition: var(--transition2);}
.header-parent .top-bg .item.whats-href:hover p {color: #24CD65;}
.header-parent .top-bg .item:hover p {color: var(--cor2);}
.header-parent .subpages {display: none;}

.header-parent .pagina {position: relative; cursor: pointer;}
.header-parent .pagina:not(.loja-virtual)::after {content: ''; position: absolute; width: 0; transition: var(--transition2) ease; height: 2px;background: var(--cor2);}
.header-parent .pagina:hover::after,
.header-parent .pagina:has(.ativo)::after,
.header-parent .pagina.ativo::after {width: 100%;}

.header-parent .subpages {position: absolute;z-index: 999; box-sizing: border-box; transition: opacity var(--transition2) ease;top: 100%; left: -75%; background: var(--branco); border-radius: 0 0 20px 20px; display: none; white-space: nowrap; display: flex; pointer-events: none;opacity: 0; flex-direction: column; gap: 10px;}
.header-parent .subpages .subpagina {cursor: pointer; padding: 10px;box-sizing: border-box; }

.header-parent .pagina:has(.subpages):hover .subpages {display: flex; opacity: 1; pointer-events: all;}

@media(max-width: 1250px){
    .top .item b {font-size: 13px;}
    .header-parent .pagina .nome {font-size: 12px;}
    .header-parent .nav {gap: 15px;}

}

@media(max-width: 990px){
    body:has(.nav-bg.ativo) {overflow: hidden;}
    .header-parent .pagina:not(.loja-virtual)::after {display: none;}
    .header-parent .pagina {padding: 10px 0;}
    .header-parent .close {display: flex;z-index: 999999; align-items: center; transition: var(--transition2); justify-content: center; position: fixed; color: var(--branco); font: 700 20px montserrat; top: 0; right: -200%; background: #FF0000; width: var(--close); aspect-ratio: 1/1; height: auto;}
    .header-parent .close.ativo {right: 0;}
    .header-parent .nav .pages {display: flex; transition: var(--transition2); align-items: flex-start; justify-content: flex-start; flex-direction: column; position: fixed; background: var(--branco); top: 0; left: -200%; width: calc(100% - var(--close)); height: 100%; z-index: 9999;}
    .header-parent .nav .pages.ativo {left: 0;}
    .header-parent .mobile {display: flex; justify-content: center; align-items: center; padding: 20px 0;}
    .header-parent .pages > * {border-bottom: 1px solid var(--cor3); width: 100%;}
    .header-parent .pages > * .nome {padding: 0 0 0 20px;}
    .header-parent .nav-bg::after {width: 100vw;transition: var(--transition2); z-index: 99; background: #00000091; content: ''; position: fixed; height: 100vh; right: -200%; top: 0;}
    .header-parent .nav-bg.ativo::after {right: 0;} 
    .header-parent .pages > a:last-child, 
    .header-parent .pages > a:nth-last-child(2),
    .header-parent .pages > a:nth-child(1) {border: none;}
    .header-parent .pagina:has(.subpages) .subpages {display: none !important;}
    .header-parent .nav-bg {position: relative;overflow: hidden;}
    .header-parent .pagina.loja-virtual {max-width: 130px; display: flex; align-items: center; justify-items: center; margin: 15px;}
    .header-parent .pagina.loja-virtual .nome {padding: 0; text-align: center; margin: 0 auto;}
    .header-parent .bx {content: ''; display: flex; position: relative; background: var(--cor3); width: 20px; height: 2px;}
    .bx::after,
    .bx::before {content: ''; position: absolute; background: var(--cor3); width: 20px; height: 2px;}
    .bx::after {top: 5px;}
    .bx::before {bottom: 5px;}  
    .top-bg {display: none;}
}