/* importando o arquivo de Variáveis Globais - design-system.css */
@import url('design-system.css');

/* importando o arquivo de Menu - menu.css */
@import url('menu.css');

/* Importando o csss de Sessão - sessao.css */
@import url('sessao.css');

/* Importando o css do diferencial - diferencial.css */
@import url('diferencial.css');

/* Importando o css do footer - footer.css */
@import url('footer.css');

/* Importando o css do social - social.css */
@import url('social-section.css');


/* Importando o css do quem-somos - quem-somos.css */
@import url('quem-somos.css');

/* Importando o css do quem-somos - quem-somos-texto.css*/
@import url('quem-somos-texto.css');

/* Importando o css do mpa - mapa.css */
@import url('mapa.css');

/* Importando o css de seviços - servicos.css */
@import url('servicos.css');

/* Importando o css de download - download.css */
@import url('download.css');

/* Importando o css de contato - contato.css */
@import url('contato.css');

/* Importando o css de cidades - cidade.css */
@import url('cidade.css');

/* Importando o css do WhatsApp - whatsapp.css */
@import url('whatsapp.css');

/* Importando o css de restrição de carga - restricao.css */
@import url('restricao.css');

/* Importando o css da pagina*/
@import url('formatacao-pagina.css');

/* Importando o css da privacidade.css*/
@import url('privacidade.css');

body{
  margin: 0px;
  padding:0px;
  background-color: var(--cor-de-fundo);
}

/* Div do topo */
.topo {
  display: flex;
  align-items: center; /* Centraliza verticalmente o conteúdo */
  background-color: var(--cor-de-fundo);
  justify-content: space-between; /* Espaça o logo e o menu */
  color: var(--cor-secundaria-texto);
  font-size: var(--fonte-grande);
  height: 60px;
  padding: 8px;
  text-transform: uppercase;
}

#logo {
  flex-shrink: 0; /* Garante que o logo mantenha o tamanho definido */
  width: 100%; /* Ocupa toda a largura disponível */
  max-width: 300px; /* Limite máximo */
  height: 100%; /* Ajusta a altura para caber no container */
  background-image: url('../Logo_AMG_Transportes.png');
  background-repeat: no-repeat;
  background-position: left center; /* Alinha a imagem à esquerda */
  background-size: contain; /* Ajusta a imagem mantendo a proporção */
}

/* Div do banner */
.banner {
  position: relative;
  background-color: var(--cor-secundaria);
  color: var(--cor-primaria-texto);
  font-size: var(--fonte-grande);
  height: 600px;
  overflow: hidden; /* Esconde qualquer parte do vídeo que ultrapasse a div */
}

.video-banner {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; /* Faz o vídeo cobrir completamente a div */
}


/* Div da sessão */
.sessao {
  background-color: var(--cor-de-fundo);
  color: var(--cor-secundaria-texto);
  font-size: var(--fonte-grande);
  height: 100%;
}