:root {
    --primaryColor: #EDC534;
    --secondaryColor: #333333;
    --thirdColor: #E4BD32;
    --fourthColor: #C8C8C8;
    --fifthColor: #E5E5E5;
    --successColor: #00C9A1;
    --primaryColorRGB: 237, 197, 52;
    --secondaryColorRGB: 51, 51, 51;
    --textColor: #6a7483;
    --whatsappColor: #25D366;
    --headerHeight: 70px;
    --module: 60px 0;
}

h1, h2, h3, h4, h5, h6, p, a, span, input, textarea, select, li, label, table, button, mark, .breadcrumbm, #resultado {font-family:"DM Sans", sans-serif;}

html, body {height:100vh;}
body {overflow-x:hidden; background-color:#fff;}

::selection {color:#fff; background-color:var(--primaryColor); text-shadow:none;}
::-moz-selection {color:#fff; background-color:var(--primaryColor); text-shadow:none;}
a {text-decoration:none;}

.modulo {width:100%; padding:var(--module); position:relative;}

/* Botões */
.botao {width:215px; height:54px; font-size:18px; background-color:var(--primaryColor); color:#fff; font-weight:bold; border:none; border-radius:8px; box-shadow:3px 3px 3px rgba(0,0,0,0.1); display:flex; justify-content:center; align-items:center; gap:7.5px; cursor:pointer; position:relative; transition:background-color.15s, color.15s,box-shadow .15s, transform .15s;}

.botao-principal {background-color:var(--primaryColor); color:#fff;}
.botao-principal:hover {box-shadow:6px 6px 0 rgba(var(--secondaryColorRGB),0.8);}

.botao-secundario {background-color:var(--secondaryColor); color:#fff;}
.botao-secundario:hover {box-shadow:6px 6px 0 rgba(var(--primaryColorRGB),0.8);}

.botao-terciario {background-color:#fff; color:#404040;}
.botao-terciario:hover {box-shadow:6px 6px 0 rgba(var(--secondaryColorRGB),0.8);}

.botao-quaternario {background-color:var(--fourthColor); color:#fff;}
.botao-quaternario:hover {box-shadow:6px 6px 0 rgba(172, 172, 172, 1);}

.botao-sucesso {background-color:var(--successColor); color:#fff;}
.botao-sucesso:hover {box-shadow:6px 6px 0 rgba(0, 154, 123, 0.8);}

.botao-menor {width:180px;height:42px; font-weight:bold; font-size:14px;}
.botao-maior {width:280px;}
.botao-full {width:100%;}
.botao-centralizado {position:relative; left:50%; transform:translateX(-50%);}

/* Cabeçalho */
.cabecalho {width:100%; height:var(--headerHeight); position:relative; position:fixed; top:0; left:0; z-index:9000;}
.cabecalho-container {display:flex; justify-content:space-between; padding:0 15px;}
.logo {width:144px; height:50px; background-image:url('../img/logo@2x.png'); background-size:contain; background-repeat:no-repeat; background-position:center; margin-top:10px; transition:all 150ms linear;}
.cabecalho h1 {display:none;}
.cabecalho-fix {height:var(--headerHeight); width:100%;}

.cabecalho-abaixo {height:50px; top:0; transition:all 150ms linear; background-color:rgba(255,255,255,.8);}
.cabecalho-abaixo .cabecalho-fix {height:50px;}
.cabecalho-abaixo .logo {width:115.2px; height:40px; margin-top:5px;}
.cabecalho-abaixo .menu-principal ul li a {line-height:50px;}
.cabecalho-abaixo .menu-principal ul li ul>li>a {line-height:20px !important;}

/* Menu */
.menu-principal {position:relative;}
.menu-principal ul {padding-left:0; margin:0;}
.menu-principal ul li {list-style:none; display:inline-block; position:relative;}
.menu-principal ul li a {color:var(--secondaryColor); text-decoration:none; font-size:16px; padding:0 10px; line-height:var(--headerHeight); float:left; position:relative; transition:all 150ms linear;}
.menu-principal ul li a::after {content:""; width:0; height:4px; background-color:var(--secondaryColor); position:absolute; top:0; left:0; transition:all 150ms linear;}
.menu-principal ul li a:hover::after {width:100%;}
.menu-principal ul li.menu-destaque a {background-color:var(--secondaryColor); color:var(--primaryColor);}
.menu-principal ul li.current-menu-item a::after {content:""; width:100%; height:4px; background-color:var(--primaryColor); position:absolute; top:0; left:0; transition:all 150ms linear;}

.menu-lista {display:block;}

.menu-overlay {width:100%; height:100%; position:fixed; top:0; left:0; background:transparent; z-index:1000; border:0; visibility:hidden; opacity:0;}
.overlay-aberto {visibility:visible; opacity:1;}

/* Menu Responsivo */
.menu-botao-responsivo {width:64px; height:64px; position:fixed; top:10px; right:15px; border-radius:50%; background-color:var(--secondaryColor); opacity:0; visibility:hidden; cursor:pointer; z-index:8700; transition:all 150ms linear;}
.menu-hamburguer {width:28px; float:left; position:relative; left:50%; top:14px; transform:translateX(-50%);}
.menu-hamburguer p {color:#242424; text-transform:uppercase; font-size:9px; margin:0; text-align:center;}
.icone-barra {width:28px; height:3px; margin:2px 0; float:left; background-color:#fff; transition:all 150ms linear;}
.menu-texto {width:100%; text-align:center; position:absolute; top:28px; font-size:14px; color:#fff;}
.menu-texto p {font-size:12px; color:#fff; font-weight:normal; margin: 6px 0 0; text-transform:uppercase;}

/* Barras do menu hamburguer */
.menu-botao-responsivo .icone-barra {transition:all 200ms linear;}
.menu-botao-responsivo .top-bar {transform:rotate(45deg); transform-origin:10% 10%; margin-left:5px;}
.menu-botao-responsivo .middle-bar {opacity:0; margin-left:5px;}
.menu-botao-responsivo .bottom-bar {transform:rotate(-45deg); transform-origin:10% 90%; margin-left:5px;}
.menu-botao-responsivo.colapsado .top-bar {transform:rotate(0); margin-left:0;}
.menu-botao-responsivo.colapsado .middle-bar {opacity:1; margin-left:0;}
.menu-botao-responsivo.colapsado .bottom-bar {transform: rotate(0); margin-left:0;}

/* Submenu */
.menu-principal ul li ul {position:absolute; top:100%; left:0; z-index:1000; padding-left:0; padding-right:0; float:left; /*min-width:160px;*/ text-align:left; visibility:hidden; opacity:0; background:#fff; box-shadow:0 0 15px rgba(0,0,0,.3); list-style:none; transform:translate(-10px,0); transition:all 200ms linear;}
.menu-principal ul li:hover ul {visibility:visible; opacity:1; transform:translate(0,0);}
.menu-principal ul li ul>li {width:100%; float:left; overflow:hidden;}
.menu-principal ul li ul>li>a {height:auto; background:#fff; line-height:normal; display:block; padding:10px; float:left; clear:both; width:100%; color:var(--primaryColor); text-shadow:none; white-space:nowrap;}
.menu-principal ul li ul>li>a::after {display:none;}
.menu-principal ul li ul>li>a:hover {background-color:var(--primaryColor); color:#fff;}
.menu-principal ul li ul>li.current-menu-item::after {content:""; width:0; height:0;}
.menu-principal ul li ul>li.current-menu-item a {background-color:#fff; color:var(--primaryColor);}
.menu-principal ul li ul>li.current-menu-item a:hover {color:var(--primaryColor);}

/* Rodapé */
.rodape {width:100%; background-color:var(--secondaryColor); background-image:linear-gradient(135deg, var(--secondaryColor), var(--secondaryColor), var(--primaryColor)); position:relative; padding:70px 0;}
.rodape-container {max-width:1170px; margin:0 auto; padding-left:15px; padding-right:15px; box-sizing:border-box; width:100%; display:flex; justify-content:center; gap:60px; flex-wrap:wrap;}
.rodape-logo {width:173px; height:60px; position:relative; background-image:url(../img/logo_branco@2x.png); background-repeat:no-repeat; background-size:cover; margin-bottom:30px; transition:all 150ms linear;}
.rodape-item {max-width:360px; position:relative;}
.rodape-item h3 {font-size:22px; color:#fff; margin-top:0;}

.rodape-item p {font-size:15px; color:#fff;}
.rodape-filiais-endereco, .rodape-filiais-contato {display:flex; gap:10px; align-items:center;}
.rodape-filiais-endereco-icone {color:var(--gradientLighterColor); font-size:48px;}
.rodape-filiais-contato-icone {color:var(--gradientLighterColor); font-size:28px;}
.rodape-filiais-endereco h3 {margin:0;}
.rodape-filiais-endereco p {margin:0;}

.rodape-filial:not(:last-child) {border-bottom:1px solid #fff; padding-bottom:12px; margin-bottom:20px;}
 
.rodape ul {padding-left:0;}
.rodape ul li {list-style:none; padding:3px 0;}
.rodape ul li a {color:#fff; font-size:14px;}
.rodape ul li a:hover {text-decoration:underline;}

.rodape-sociais ul {padding-left:0; margin-top:0;}
.rodape-sociais ul li {list-style:none; display:inline-block;}
.rodape-sociais ul li a {width:54px; height:54px; background-color:var(--primaryColor); color:#fff; font-size:32px; border-radius:50%; display:flex; justify-content:center; align-items:center; transition:all 150ms linear;}
.rodape-sociais ul li a:hover {text-decoration:none; transform:scale(1.1);}

.rodape-assinatura {text-align:center; padding:30px 0;}
.rodape-assinatura p {font-size:14px; margin:0; color:var(--textColor);}
.rodape-assinatura a {color:#00BAC4;}
.rodape-assinatura a:hover {text-decoration:underline;}

/* Whatsapp */
.whatsapp {width:60px; height:60px; background-color:var(--successColor); color:#fff; font-size:32px; border-radius:50%; display:flex; justify-content:center; align-items:center; position:fixed; bottom:15px; right:15px; z-index:9000; transition:all 150ms linear;}
.whatsapp a {width:100%; height:100%; display:flex; justify-content:center; align-items:center; color:#fff;}

/* Banner */
.banner {width:100%; padding:90px 0; position:relative;}
.banner::before {content:""; width:70%; height:100%; position:absolute; top:0; left:0; background-color:var(--primaryColor); background-image:url(../img/elemento_fundo_simbolo.png); background-repeat:no-repeat; background-position:bottom 15px center; left:15px; border-radius:50px; z-index:1; border-bottom:16px solid #E4BD32;}
.banner-container {display:flex; gap:30px; padding:0 15px; position:relative; z-index:5;}
.banner-texto {width:40%; padding-left:60px;}
.banner-texto h2 {font-size:52px; line-height:calc(100% + 10px); letter-spacing:-1px; color:#404040; margin-top:0; margin-bottom:15px;}
.banner-texto p {color:#404040; margin-bottom:15px;}
.banner-texto h2::selection, .banner-texto p::selection {color:#fff; background-color:var(--secondaryColor); text-shadow:none;}
.banner-botoes {display:flex; gap:15px; flex-wrap:wrap; margin-top:15px;}
.banner-cards {width:60%; display:flex; justify-content:center; gap:30px;}

/* Card */
.card {width:100%; max-width:400px; background:#ffffff; border-radius:16px;box-shadow:0px 10px 30px rgba(0, 0, 0, 0.08); overflow:hidden; transition:all 150ms linear;}
.card:hover {box-shadow:0px 10px 30px rgba(0, 0, 0, 0.2); transform:translateY(-5px);}
.card-texto {padding:15px;}
.card-texto h3 {font-size:22px; color:var(--secondaryColor); margin-top:0; margin-bottom:10px;}
.card-texto-infos {display:flex; flex-direction:column; gap:10px;}
.card-texto-info {display:flex; justify-content:space-between; gap:10px; border-bottom:1px solid #E5E5E5; padding-bottom:10px;}
.card-texto-info p {color:#A2A2A2; font-size:14px; margin:0;}
.card-texto-valor p {color:var(--secondaryColor); font-size:18px; font-weight:bold;}
.card-texto-botoes {display:flex; gap:10px; margin-top:15px;}
.card-texto-botoes button {box-shadow:none;}

/* Título do módulo */
.modulo-titulo {width:100%; max-width:1180px; margin:0 auto; padding-left:15px; padding-right:15px; box-sizing:border-box; margin-bottom:30px;}
.modulo-titulo h2 {font-size:38px; letter-spacing:-1px; color:var(--secondaryColor); margin-top:0; text-align:center;}

/* Marcas */
.marcas {width:100%; padding:var(--module); background-color:#fff;}
.marcas-container {width:100%; max-width:1180px; margin:0 auto; padding-left:15px; padding-right:15px; box-sizing:border-box; width:100%; display:flex; justify-content:center; gap:15px; flex-wrap:wrap;}
.marca-item {width:220px; height:220px; background-image:linear-gradient(135deg, rgba(var(--secondaryColorRGB),0.1), rgba(var(--secondaryColorRGB),0)); border-radius:20px; transition:all 150ms linear;}
.marca-item:hover {box-shadow:0px 10px 30px rgba(0, 0, 0, 0.2); transform:translateY(-5px);}
.marca-item a {width:100%; height:100%; display:flex; justify-content:center; align-items:center; padding:20px; box-sizing:border-box;}

/* Serviços */
.servicos {width:100%; padding:0 0 60px; background-color:#fff;}
.servicos-container {width:100%; max-width:1600px; padding-left:15px; padding-right:15px; display:flex; justify-content:center; gap:30px; margin:0 auto}
.servicos-item-texto h2 {line-height:100%; letter-spacing:-1px;}
.servico-item {border-radius:20px; padding:30px; position:relative; overflow:hidden; transition:all 150ms linear;}
.servico-item::before {content:""; width:100%; height:calc(100% - 150px); position:absolute; bottom:0; left:0; border-radius:20px; background-image:linear-gradient(135deg, rgba(var(--secondaryColorRGB),0.1), rgba(var(--secondaryColorRGB),0.03)); z-index:1;}
.servico-item-icone {margin-bottom:30px; position:relative; z-index:5;}
.servico-item-icone img {max-height:230px;}
.servico-item-texto {position:relative; z-index:5;}
.servico-item-texto h3 {font-size:42px; color:var(--secondaryColor); margin-top:0; margin-bottom:10px; line-height:calc(100% + 5px); letter-spacing:-2px;}

.servico-item .botao {position:relative; z-index:5; margin-top:15px;}

/* Unidades */
.unidades {width:100%; padding:var(--module); background-color:#fff;}
.unidades-container {width:100%; max-width:1180px; margin:0 auto; padding-left:15px; padding-right:15px; display:flex; justify-content:center; gap:30px;}
.unidade-item {display:flex; gap:15px;}
.unidade-textos h3 {font-size:32px; color:var(--secondaryColor); margin-top:0; margin-bottom:10px; letter-spacing:-1px;}
.unidade-textos p {color:var(--textColor); font-size:15px; margin-top:0; margin-bottom:10px;}
.unidade-textos p:first-of-type {font-size:20px;}

/* Institucional */
.institucional {width:100%; padding:120px 0 0; background-color:#fff;}
.institucional-container {width:100%; max-width:1600px; margin:0 auto; padding-left:15px; padding-right:15px;}
.institucional-numeros {display:flex; gap:30px; flex-wrap:wrap; margin-left:30px; margin-bottom:30px;}
.institucional-numeros-item {text-align:center;}
.institucional-numeros-item p {font-size:15px; color:var(--secondaryColor); margin:0;}
.institucional-numeros-item p:nth-of-type(2) {font-size:42px; font-weight:bold;}

.institucional-conteudo {width:100%; background-color:var(--secondaryColor); border-radius:20px;}
.institucional-conteudo-container {display:flex; justify-content:space-between; gap:30px;}
.institucional-texto-container {display:flex; flex-direction:column; justify-content:center;}
.institucional-texto {padding:30px 0 30px 30px;}
.institucional-texto p {font-size:56px; color:#fff; margin-top:0; margin-bottom:15px; font-weight:bold; line-height:calc(100% + 5px); letter-spacing:-3px;}
.institucional-imagem {margin-top:-250px; margin-bottom:30px;}
.institucional-imagem img {max-width:768px;}

/* Página */
.pagina {margin:30px 0 60px;}
.pagina-container {width:100%; max-width:800px; margin:0 auto; padding-left:15px; padding-right:15px;}
.pagina-container h1 {color:var(--secondaryColor); font-size:56px; margin:0 0 15px; line-height:calc(100% + 5px); letter-spacing:-2px;}

/* Quem somos */
.empresa-container {width:100%; max-width:1600px; margin:0 auto; padding-left:15px; padding-right:15px; display:flex; gap:30px;}
.empresa-container h1 {color:var(--secondaryColor); font-size:56px; margin:0 0 15px; line-height:calc(100% + 5px); letter-spacing:-2px;}
.empresa-item {flex:1; width:50%;}
.empresa-imagem {position:relative;}
.empresa-imagem img {overflow:hidden; border-radius:24px; position:relative;}
.empresa-imagem::before {content:""; width:100%; height:100%; background-color:var(--primaryColor); position:absolute; top:10px; left:10px; border-radius:30px;}

.empresa-galeria {
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    overflow: hidden; /* Esconde a barra de rolagem horizontal */
    padding: 40px 0;
}

/* Evita o FOUC (imagens empilhadas enquanto o JS carrega) */
#empresa-owl-gallery:not(.owl-loaded) {
    display: flex;
    gap: 20px;
    overflow: hidden;
}
#empresa-owl-gallery:not(.owl-loaded) .empresa-galeria-item:not(:first-child) {
    display: none;
}

/* Item Interno */
.empresa-galeria-item a {
    position: relative;
    display: block;
    aspect-ratio: 16 / 10; /* Proporção moderna para fotos horizontais */
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
}

.empresa-galeria-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Overlay de Zoom */
.empresa-galeria-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 0, 0, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 28px;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.empresa-galeria-item:hover .empresa-galeria-overlay { opacity: 1; }
.empresa-galeria-item:hover img { transform: scale(1.05); }

/* Customização Setas do Owl (Estilo Netflix) */
#empresa-owl-gallery .owl-nav button.owl-prev,
#empresa-owl-gallery .owl-nav button.owl-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.9) !important;
    color: #000 !important;
    width: 48px;
    height: 48px;
    border-radius: 50% !important;
    box-shadow: 0 4px 10px rgba(0,0,0,0.15);
    font-size: 24px !important;
    transition: all 0.2s ease;
}

#empresa-owl-gallery .owl-nav button.owl-prev { left: 20px; }
#empresa-owl-gallery .owl-nav button.owl-next { right: 20px; }
#empresa-owl-gallery .owl-nav button:hover { background: #000 !important; color: #fff !important; }

.direcionamento {width:100%; padding:40px 0;}
.direcionamento-container {width:100%; max-width:1180px; margin:0 auto; display:flex; justify-content:center; gap:30px; padding-left:15px; padding-right:15px;}
.direcionamento-item {flex:1; border:1px solid #e2e2e2; padding:25px; border-radius:16px; background-color:#fff;}
.direcionamento-item h3 {font-size:32px; color:var(--secondaryColor); margin:0 0 6px;}
.direcionamento-item p {color:var(--textColor);}

/* Grid de veículos */
.pagina-grid-container {width:100%; max-width:1600px; margin:0 auto; padding-left:15px; padding-right:15px; display:flex; justify-content:space-between; gap:30px;}
.veiculos-sidebar {width:100%; max-width:280px; position:relative;}
.veiculos-container {width:100%; display:grid; grid-template-columns:repeat(3, 1fr); gap:30px; justify-content:center;}
.veiculos-container-grid {padding-left:0; padding-right:0;}

/* Single de veículo */
.veiculo-single-container {width:100%; max-width:1600px; margin:0 auto; padding-left:15px; padding-right:15px; display:flex; justify-content:space-between; gap:30px;}
.single-veiculos-galeria {flex:1; width:50%;}
.single-veiculos-textos {flex:1; width:50%;}
.single-veiculos-textos h1, .servicos-item-texto h1 {color:var(--secondaryColor); font-size:56px; margin:0 0 15px; line-height:calc(100% + 5px); letter-spacing:-2px;}

/* Galeria de imagens */
.truck-gallery-container {width:100%; min-width:0; max-width:800px; margin:0 auto;}
#truck-main-slider {width:100%; margin-bottom:10px; border-radius:8px; overflow:hidden; display:block !important;}
#truck-main-slider .item-main-img {width:100%; display:block;}

#truck-main-slider .item-main-img img {
    width: 100% !important;
    max-width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
}

/* Grid de Thumbnails abaixo */
.truck-thumbnails-grid {
    display: flex;
    gap: 8px;
    margin-top: 8px;
    overflow-x: auto; /* Se houver muitas fotos, cria um scroll horizontal suave no mobile */
    padding-bottom: 4px;
}

.thumb-btn {
    background: none;
    border: 2px solid transparent;
    padding: 0;
    cursor: pointer;
    border-radius: 6px;
    overflow: hidden;
    flex-shrink: 0; /* Impede que o thumbnail esmague caso tenha muitos itens */
    transition: border-color 0.2s ease, opacity 0.2s ease;
}

.thumb-btn img {
    display: block;
    width: 90px;
    height: 68px;
    object-fit: cover;
}

/* Estado Ativo e Hover (Estilo Nike) */
.thumb-btn.active {
    border-color: var(--primaryColor);
}

.thumb-btn:hover {
    opacity: 0.8;
}

/* Suaviza a barra de rolagem dos thumbnails em navegadores modernos */
.truck-thumbnails-grid::-webkit-scrollbar {
    height: 5px;
}
.truck-thumbnails-grid::-webkit-scrollbar-thumb {
    background-color: #ccc;
    border-radius: 4px;
}

#truck-main-slider .owl-nav button.owl-prev,
#truck-main-slider .owl-nav button.owl-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    background: rgba(255, 255, 255, 0.7) !important; 
    color: var(--secondaryColor) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0;
    cursor: pointer;
    font-size: 50px !important;
    transition: all 0.25s ease !important;
    z-index: 10;
    border: none !important;
}

/* Posicionamento individual */
#truck-main-slider .owl-nav button.owl-prev {
    left: 10px;
}

#truck-main-slider .owl-nav button.owl-next {
    right: 10px;
}

/* Efeito de Hover (Estilo Nike / Apple) */
#truck-main-slider .owl-nav button.owl-prev:hover,
#truck-main-slider .owl-nav button.owl-next:hover {
    background: var(--primaryColor) !important; /* Inverte a cor no hover */
    color: #ffffff !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
    transform: translateY(-50%) scale(1.05); /* Leve pulsação */
}

/* Estado desativado (quando chega na primeira ou última foto, já que loop está false) */
#truck-main-slider .owl-nav button.owl-prev.disabled,
#truck-main-slider .owl-nav button.owl-next.disabled {
    opacity: 0;
    cursor: not-allowed;
    pointer-events: none; /* Some suavemente se não houver mais fotos naquela direção */
}

#truck-main-slider:not(.owl-loaded) {
    display: block;
    overflow: hidden;
    width: 100%;
}

/* 2. O SEGREDO: 
   Antes de carregar, pega todos os itens da galeria EXCETO o primeiro (:not(:first-child)) e esconde-os */
#truck-main-slider:not(.owl-loaded) > .item-main-img:not(:first-child) {
    display: none !important;
}

/* 3. Garante que a primeira imagem ocupe o espaço correto sozinha no loading */
#truck-main-slider:not(.owl-loaded) > .item-main-img:first-child img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

.veiculos-tabela-info {display:flex; justify-content:space-between; align-items:center; gap:10px; border-bottom:1px dashed #E5E5E5; padding:10px;}
.veiculos-tabela-info p {color:#A2A2A2; font-size:16px; display:flex; align-items:center; gap:5px; margin:0;}
.veiculos-tabela-info p:nth-child(2) {text-align:right;}
.single-veiculos-tabela .veiculos-tabela-info:nth-child(even){background:#f7f7f7;}
.single-veiculos-tabela .veiculos-tabela-info:nth-child(odd){background:#ffffff;}
.single-veiculos-valor {margin:20px 0 0;}
.single-veiculos-valor p {color:var(--secondaryColor); font-size:32px; font-weight:bold; margin:0;}

.single-veiculos-botao {margin:20px 0; z-index:9005;}

.single-veiculos-mapa {padding:15px 0; border-top:1px solid #E5E5E5; border-bottom:1px solid #E5E5E5; margin-bottom:15px; display:flex; justify-content:space-between; align-items:center; gap:30px;}
.single-veiculos-mapa h4 {font-size:16px; color:var(--secondaryColor); margin:0;}
.single-veiculos-mapa p {font-size:14px; color:var(--secondaryColor); margin:0;}
.single-veiculos-mapa-telefone p {display:flex; align-items:center; gap:5px; font-size:16px; color:var(--secondaryColor); margin:5px 0 0;}

.single-veiculos-icones-container {width:100%; max-width:1180px; margin:0 auto; padding-left:15px; padding-right:15px; display:flex; justify-content:center; gap:30px; flex-wrap:wrap;}
.single-veiculos-icones-item {flex:1; text-align:center;}
.single-veiculos-icones-item i {font-size:48px; color:var(--secondaryColor); margin-bottom:10px;}
.single-veiculos-icones-item h4 {font-size:22px; color:var(--secondaryColor); margin-top:0; margin-bottom:5px;}
.single-veiculos-icones-item p {font-size:14px; color:var(--textColor); margin:0;}

.outros-veiculos {width:100%; padding:var(--module); background-color:#fff;}
.outros-veiculos-container {width:100%; max-width:1600px; margin:0 auto; display:flex; justify-content:center; gap:30px; padding-left
:15px; padding-right:15px;}

/* Sidebar de filtros */
.sidebar-search-group {width:100%; margin-bottom:30px; position:relative; overflow:hidden;}
.sidebar-search-input {width:100%; height:48px; padding:0; background-color:#fff; color:#242424; font-size:18px; text-indent:0; border-radius:24px; border:1px solid var(--secondaryColor); text-indent:15px;}
.sidebar-search-button {width:42px; height:42px; border-radius:21px; background-color:var(--primaryColor); color:var(--secondaryColor); border:0; position:absolute; right:3px; top:3px; display:flex; justify-content:center; font-size:18px; align-items:center; transition:all 150ms linear;}
.sidebar-widget ul {padding-left:0;}
.sidebar-widget ul li {list-style:none; padding:3px 0;}
.sidebar-widget ul li a {color:#444; transition:all 150ms linear;}
.sidebar-widget ul li a:hover {text-decoration:underline;}
.btn-toggle-filtros, .btn-close-filtros-mobile {display:none;}
.search-term-header h2 {margin:15px 0 0; font-size:38px; color:var(--secondaryColor); letter-spacing:-1px; line-height:100%;}

/* Breadcrumb */
.breadcrumb {margin:5px 0; font-size:14px; padding-left:10px; padding-right:10px;}
.breadcrumb ol {display:flex; flex-wrap:wrap; gap:8px; list-style:none; padding:0; margin:0;}
.breadcrumb li {display:flex; align-items:center;}
.breadcrumb li:not(:last-child)::after {content:">"; margin-left:8px; opacity:.5;}
.breadcrumb a {color:var(--secondaryColor); text-decoration:none;}
.breadcrumb a:hover {text-decoration:underline;}

/* Modal */
/* Fundo escuro que cobre a tela (Backdrop) */
.truck-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px); /* Efeito glassmorphism moderno */
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.truck-modal-overlay.active {
    opacity: 1;
    visibility: visible;
}

/* Caixa branca do modal */
.truck-modal-content {
    background: #ffffff;
    width: 90%;
    max-width: 450px;
    border-radius: 12px;
    padding: 24px;
    position: relative;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
    transform: translateY(20px);
    transition: transform 0.3s ease;
    border-bottom: 8px solid #ccc;
}

.truck-modal-overlay.active .truck-modal-content {
    transform: translateY(0);
}

/* Botão de Fechar (X) */
.truck-modal-close {
    position: absolute;
    top: 16px;
    right: 16px;
    background: none;
    border: none;
    font-size: 44px;
    line-height: 1;
    color: #666;
    cursor: pointer;
    transition: color 0.2s;
}

.truck-modal-close:hover {
    color: #000;
}

/* Tipografia interna */
.truck-modal-title {
    margin: 0 0 8px;
    font-size: 28px;
    letter-spacing: -1px;
    color: var(--secondaryColor);
}

.truck-modal-subtitle {
    margin: 0 0 18px;
    font-size: 14px;
    color: #888;
    line-height: 1.4;
}

/* Formulário */
.truck-form-group {
    margin-bottom: 16px;
    text-align: left;
}

.truck-form-group label {
    display: block;
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #333;
}

.truck-form-group input {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 16px;
    text-indent: 0;
    outline: none;
    transition: border-color 0.2s;
    box-sizing: border-box;
}

.truck-form-group select {
    width: 100%;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 16px;
    text-indent: 8px;
    outline: none;
    transition: border-color 0.2s;
    box-sizing: border-box;
}

.truck-form-group input:focus {
    border-color: #000;
}

.truck-form-group select:focus {
    border-color: #000;
}

/* Input readonly destacado */
.truck-form-group input[readonly] {
    background-color: #f5f5f5;
    color: #555;
    cursor: not-allowed;
    border-color: #eee;
}

/* Botão Enviar */
.truck-btn-submit-ws {
    width: 100%;
    background: var(--successColor);
    color: #fff;
    border: none;
    padding: 14px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: background 0.2s;
    margin-top: 24px;
}

.truck-btn-submit-ws:hover {
    background: #1ebc5a;
}

/* Página de serviços */
.servicos-container {margin-top:60px;}
.servicos-item {flex:1; width:50%;}
.servicos-icones {width:100%; padding:30px 0 100px;}
.servicos-galeria {display:flex; gap:15px; margin-top:30px;}
.servicos-galeria a {border-radius:8px; position:relative; overflow:hidden; display:block;}
.galeria-overlay {position:absolute; top:5px; right:5px; color:#fff; font-size:22px; text-shadow:0 0 10px rgba(0,0,0,.5); transition:all 150ms linear;}
.icones-destaque-container {width:100%; max-width:1180px; margin:0 auto; padding-left:15px; padding-right:15px; display:flex; justify-content:center; gap:15px; flex-wrap:wrap;}
.icones-destaque-item p {text-align:center; font-size:16px; color:var(--secondaryColor); margin-top:10px;}
.icones-destaque-item-quadro {width:160px; height:160px; background-color:var(--primaryColor); background-image:linear-gradient(135deg, var(--primaryColor), #F39E2B); border-radius:16px; display:flex; justify-content:center; align-items:center; font-size:54px; transition:all 150ms linear;}
.icones-destaque-item-quadro i {color:var(--secondaryColor);}

.erro404 {width:100%; padding:40px 0;}
.erro404-container {width:100%; max-width:1180px; margin:0 auto; padding-left:15px; padding-right:15px; display:flex; justify-content:center; flex-direction:column; text-align:center;}
.erro404 h1 {font-size:190px; margin:0; line-height:100%; color:var(--secondaryColor);}
.erro404 h2 {font-size:42px; color:var(--secondaryColor); margin-top:0; margin-bottom:10px; line-height:calc(100% + 5px); letter-spacing:-2px;}
.erro404 p {color:var(--textColor);}


/* Aviso de cookie */
.cookie-aviso {width:1180px; padding:20px; box-sizing:border-box; background-color:#fff; position:fixed; bottom:30px; left:50%; transform:translateX(-50%); z-index:2000; border-radius:8px; box-shadow:0 0 15px rgba(0,0,0,.1);}
.cookie-aviso p {margin:0; font-size:14px;}
.cookie-aviso a {color:var(--primaryColor); text-decoration:none;}
.cookie-aviso a:hover {text-decoration:underline;}
.cookie-aviso-container {width:calc(100% - 240px); float:left;}
.cookie-aviso-botao {width:220px; float:right;}
.cookie-aviso-aceite {width:100%; height:40px; background:linear-gradient(to right, var(--primaryColor), var(--secondaryColor)); border:0; color:#fff; font-size:18px; border-radius:3px;}
.cookie-aviso-aceite:hover {background:var(--primaryColor);}
.cookie-aviso-aceite:focus {outline:none;}

@media (max-width:1380px){
.banner {padding:70px 0;}
.banner-texto h2 {font-size:42px;}
.banner-cards {gap:15px;}
.institucional-imagem img {max-width:580px;}
.cookie-aviso {width:calc(100% - 30px); left:15px; transform:translateX(0);}
}

@media (max-width:1180px){
.banner::before {content:""; width:calc(100% - 30px); height:70%;}
.banner-container {flex-direction:column; gap:30px;}
.banner-texto {width:100%; padding-left:30px; padding-right:30px; text-align:center;}
.banner-botoes {justify-content:center;}
.banner-cards {width:100%; padding-left:30px; padding-right:30px;}
.servico-item-icone img {max-height:200px;}
.institucional-imagem {margin-top:-137px;}
.institucional-imagem img {max-width:420px;}
.single-veiculos-textos h1, .servicos-item-texto h1, .pagina-container h1, .empresa-container h1 {font-size:48px;}
.erro404 h1 {font-size:140px;}
}

@media (max-width:990px){
.menu-botao-responsivo {opacity:1; visibility:visible;}
.menu-lista {width:225px; height:100%; visibility:hidden; opacity:0; position:fixed; top:60px; right:-225px; background-color:var(--secondaryColor); background-image:linear-gradient(to top, #121212, var(--secondaryColor)); transition:all 150ms linear;}
.menu-caminhao {width:260px; height:183.3333px; background-image:url(../img/caminhao_euro_menu.png); background-repeat:no-repeat; background-size:cover; position:absolute; bottom:50px; right:-30px; opacity:0; transition:all 500ms ease;}
.cabecalho-abaixo .menu-lista {top:60px;}
.menu-aberto {visibility:visible; opacity:1; right:0; z-index:8600;}
.menu-aberto .menu-caminhao {right:0; opacity:1; transition-delay:150ms;}
.menu-principal-conteudo {margin-top:40px;}
.menu-lista ul li {width:100%; position:relative;}
.menu-lista ul li a {width:100%; color:#fff; text-align:right; font-size:20px; line-height:28px; font-weight:bold; padding:10px 20px; box-sizing:border-box;}
.cabecalho-abaixo .menu-lista ul li a {line-height:28px;}
.menu-principal ul li ul>li>a {font-size:16px;}
.menu-principal ul li a::after {display:none;}
.titulo-pagina h1, .titulo-pagina h2 {font-size:48px;}
.servico-item-icone img {max-height:160px;}
.servico-item-texto h3 {font-size:36px; letter-spacing:-1px;}
.institucional {padding:0;}
.institucional-conteudo-container {flex-direction:column; align-items:flex-end;}
.institucional-numeros {margin-left:0; justify-content:center;}
.institucional-texto {padding:30px; text-align:center; display:flex; flex-direction:column; align-items:center;}
.institucional-texto p {font-size:38px; letter-spacing:-1px;}
.institucional-imagem {margin-top:0; width:calc(100% - 30px);}
.institucional-imagem img {max-width:100%;}
.veiculos-container-grid {grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));}
.veiculos-container {grid-template-columns:1fr;}
.veiculos-sidebar {position:relative; top:0; margin-top:30px; margin-bottom:30px;}
.single-veiculos-textos h1, .servicos-item-texto h1, .pagina-container h1, .empresa-container h1 {font-size:38px;}
.single-veiculos-valor p {font-size:24px;}
.outros-veiculos-container {flex-wrap:wrap;}
.erro404 h1 {font-size:120px;}
}

@media (max-width:768px){
.cabecalho, .cabecalho-fix {height:50px;}
.menu-principal ul li a:after {line-height:60px;}
.cabecalho-abaixo .menu-lista, .menu-lista {top:50px;}
.logo, .cabecalho-abaixo .logo {width:115.2px; height:40px; margin-top:5px;}
.cookie-aviso-container {width:100%; float:left; text-align:center;}
.cookie-aviso-botao {width:100%; float:left; margin-top:20px;}
.cookie-aviso-aceite {width:220px; float:left; position:relative; left:50%; transform:translateX(-50%); font-weight:bold;}
.barra-lateral {margin-top:60px;}
.curso-banner::before, .curso-faq::before {width:100%; left:-15px; padding-left:15px; padding-right:15px;}
.rodape-item {width:100%; max-width:100%;}
.rodape-container {justify-content:center; text-align:center;}
.rodape-logo {left:50%; transform:translateX(-50%);}
.rodape-assinatura {text-align:center; padding:30px 0 100px;}
.banner::before {height:32%;}
.banner-cards {flex-direction:column; align-items:center; padding-left:15px; padding-right:15px;}
.servicos-container {flex-direction:column;}
.servico-item-texto h3 {font-size:28px;}
.unidades-container {flex-direction:column;}
.marca-item {width:160px; height:160px;}
.veiculo-single-container {flex-direction:column; gap:30px;}
.single-veiculos-galeria, .single-veiculos-textos {width:100%;}
.single-veiculos-mapa {flex-direction:column; gap:15px;}
.single-veiculos-mapa-endereco {text-align:center;}
.single-veiculos-mapa-telefone p {justify-content:center;}
.modulo-titulo h2 {line-height:calc(100% + 5px); font-size:32px; letter-spacing:-1px;}
#truck-main-slider .owl-nav {display:none !important;}
.servicos-container {margin-top:30px;}
.servicos-item {width:100%;}
.empresa-container {flex-direction:column-reverse;}
.empresa-item {width:100%;}
.direcionamento-container {flex-direction:column;}
.veiculos-sidebar {margin:0;}
.pagina-grid-container {flex-direction:column; gap:10px;}
.veiculos-container {place-items:center;}
.erro404 h1 {font-size:90px;}
.banner::before {background-image:url(../img/elemento_fundo_simbolo_vertical.png); background-position:top 15px right 15px;}
.banner-container h2 {line-height:100%;}
.search-term-header h2 {margin-top:0; font-size:26px;}

.btn-toggle-filtros {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding: 14px;
    background-color: var(--secondaryColor); /* Use a cor de destaque do seu tema */
    color: #ffffff;
    border: none;
    border-radius: 6px;
    font-weight: 600;
    font-size: 16px;
    margin-bottom: 10px;
    cursor: pointer;
}

/* Transforma a Sidebar numa Gaveta Escondida na Esquerda */
.veiculos-sidebar {
    position: fixed;
    top: 0;
    left: -100%; /* Totalmente escondida para fora da tela */
    width: 85%;
    max-width: 320px;
    height: 100vh;
    background-color: #ffffff;
    z-index: 99999; /* Fica acima de tudo */
    box-shadow: 0 0 30px rgba(0,0,0,0.2);
    padding: 60px 24px 24px 24px; /* Espaço para o botão de fechar */
    overflow-y: auto; /* Permite scroll se o filtro for longo */
    transition: left 0.35s ease; /* Transição suave de deslize */
}

/* Classe ativa que o JavaScript vai injetar para abrir a gaveta */
.veiculos-sidebar.open {
    top:50px;
    left:0; /* Desliza para dentro da tela */
}

/* Botão de Fechar (X) dentro da gaveta */
.btn-close-filtros-mobile {
    display: block;
    position: absolute;
    top: 15px;
    right: 20px;
    background: none;
    border: none;
    font-size: 32px;
    line-height: 1;
    color: #333;
    cursor: pointer;
}

/* Opcional: Efeito de blur ou escurecer o fundo do site quando aberto */
body.sidebar-aberta::after {
    content: "";
    position: fixed;
    top: 0; left: 0; width: 100vw; height: 100vh;
    background: rgba(0,0,0,0.4);
    z-index: 99998;
}

}

@media (max-width:480px){
.menu-principal ul li a:after {line-height:55px;}
.cabecalho-abaixo .menu-lista, .menu-lista {top:50px;}
:root {--module: 40px 0;}
.banner {padding:50px 0;}
.banner-texto h2 {font-size:38px;}
.single-veiculos-icones-container {flex-direction:column; gap:30px;}
.single-veiculos-botao {width:100%; position:fixed; bottom:0; left:15px;}
.single-veiculos-botao button {width:calc(100% - 100px);}
.icones-destaque-item-quadro {width:140px; height:140px;}
.single-veiculos-valor {margin:20px 0;}
}