#video_inicial_multiponto {
  opacity: 20%;
}

.blink {
  animation: blinker 10s linear infinite;
  color: black;
  font-family: sans-serif;
}

@keyframes blinker {
  100% {
    opacity: 5%;
  }
}

.texto_rodape {
  font-family: Arial, sans-serif;
  font-size: 12px;
  text-align: left;
  letter-spacing: 0.3px;
  line-height: 18px;
  color: black;
}

.list-group-item_home {
  font-size: 16px;
  color: black;
}

.carousel-inner .item {
  opacity: 0;
  transition: none;
  transform: translate3d(0, 0, 0) !important;
}

.carousel-inner .active {
  transition: opacity 4s ease-in-out;
  opacity: 1;
}

.botao_orçamento {
  background-color: black;
  color: white;
  align-content: center;
  align-items: center;
  border-radius: 10px;
  width: 25%;
  height: 35px;
}

.botao_orçamento_maior {
  background-color: black;
  opacity: 80%;
  color: white;
  align-content: center;
  align-items: center;
  border-radius: 10px;
  width: 40%;
  height: 55px;
}

.botao_orçamento_mobile {
  background-color: black;
  color: white;
  align-content: center;
  align-items: center;
  border-radius: 10px;
  width: 40%;
  height: 40px;
}

.botao_orçamento_fundo {
  background-color: white;
  color: black;
  align-content: center;
  align-items: center;
  border-radius: 10px;
  border-style:groove;
  border-color: black;
  width: 40%;
  height: 55px;
}

.botao_orçamento_mobile_fundo {
  background-color: white;
  color: black;
  align-content: center;
  align-items: center;
  border-radius: 10px;
  width: 40%;
  height: 40px;
}

.sem_link {
  text-decoration: none;
  color: black;
}

/* NAVBAR */
nav {
  background-color: transparent;
}

nav li {
  display: inline-block;
}

nav li a {
  display: inline-block;
  color: white;
  text-decoration: none;
  padding: 15px;
}

nav li a:hover {
  background-color:transparent;
}

.dropdown-menu {
  position: absolute;
  box-shadow: 0 0 0px black;
  display: none;
}

.dropdown-menu a {
  display: block;
  color: black;
}

.dropdown:hover .dropdown-menu {
  display: block;
}

/* ###################### */
.container_grid_home {
  display: grid;
  width: 40%;
  height: 800px;
  gap: 15px;
  grid-template-areas:
    "item-1 item-2 item-3 item-4 "
    "item-5 item-6 item-7 item-8"
    "item-9 item-10 item-11 item-12"
    "item-13 item-14 item-15 item-16"
}

.container_grid_home_mobile {
  display: grid;
  width: 40%;
  height: 500px;
  gap: 15px;
  grid-template-areas:
    "item-1 item-2"
    "item-3 item-4"
    "item-5 item-6"
    "item-7 item-8"
}

.item-1 {
  grid-area: item-1;
  background: black;
  opacity: 20%;
}

.item-2 {
  grid-area: item-2;
  background: black;
  opacity: 20%;
}

.item-3 {
  grid-area: item-3;
  background: black;
  opacity: 20%;
}

.item-4 {
  grid-area: item-4;
  background: black;
  opacity: 20%;
}

.item-5 {
  grid-area: item-5;
  background: black;
  opacity: 20%;
}

.item-6 {
  grid-area: item-6;
  background: black;
  opacity: 20%;
}

.item-7 {
  grid-area: item-7;
  background: black;
  opacity: 20%;
}

.item-8 {
  grid-area: item-8;
  background: black;
  opacity: 20%;
}

.item-9 {
  grid-area: item-9;
  background: black;
  opacity: 20%;
}

.item-10 {
  grid-area: item-10;
  background: black;
  opacity: 20%;
}

.item-11 {
  grid-area: item-11;
  background: black;
  opacity: 20%;
}

.item-12 {
  grid-area: item-12;
  background: black;
  opacity: 20%;
}

.item-13 {
  grid-area: item-13;
  background: black;
  opacity: 20%;
}

.item-14 {
  grid-area: item-14;
  background: black;
  opacity: 20%;
}

.item-15 {
  grid-area: item-15;
  background: black;
  opacity: 20%;
}

.item-16 {
  grid-area: item-16;
  background: black;
  opacity: 20%;
}

/* ################## */
.carousel slide_meu {
  animation: moveToRight 0.5s linear;
  transition: 10ms;
  transform: translateX(100px);
}

.carousel slide_meu_02 {
  animation: moveToRight 3s linear;
  transition: 30ms;
  transform: translateX(100px);
}

.carousel slide_meu_02 {
  animation: moveToRight 1.5s linear;
  transition: 20ms;
  transform: translateX(100px);
}

/* ##################### */
.logos{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  }
  
  .logos .logo{
  height: 200px;
  background-size: cover !important;
  -webkit-transition: all 0.7s ease;
 transition: all 6s ease;
  }
  
  .logos .logo img {
  height: 200px;
  width: 300px;
  }

/* MOBILE */
.logos_mobile{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
  
  .logos_mobile .logo_mobile{
  height: 200px;
  background-size: cover !important;
  -webkit-transition: all 0.7s ease;
 transition: all 6s ease;
  }
  
  .logos_mobile .logo_mobile img {
  height: 200px;
  width: 300px;
  }

    .hr1 {
      border: 0px;
      border-top: 1px solid #A4A4A4;
    }
    
    .meia_linha {
      line-height: 5px;
    }

    .contorno_produtos {
      border: 2px groove rgb(246, 246, 246);
      border-left: 0px;
      border-right: 0px;
      border-top: 0px;
      border-radius: 2px;
      width: 60%;
      background-color: rgb(250, 250, 250);
    }

    .contorno_produtos_cima_baixo {
      border: 2px groove rgb(246, 246, 246);
      border-left: 0px;
      border-right: 0px;
      border-radius: 2px;
      width: 60%;
      background-color: rgb(250, 250, 250);
    }

    .contorno_produtos_v2 {
      border: 2px groove rgb(246, 246, 246);
      border-left: 0px;
      border-right: 0px;
      border-top: 0px;
      border-radius: 2px;
      width: 60%;
    }

/* ________________ */
details {
  height: auto;
  overflow: hidden;
  transition: max-height ease-in-out;
  transition-duration: var(--duration, 0.3s);
}

summary {
  cursor: pointer;
}

/* ______________ */
.wraper {
  height: auto;
  width: 100%;
  margin: 0 auto;
  display: flex;
  overflow: hidden;
}
.scroller {
  display: flex;
  width: 100%;
  animation: slidy1 20000ms infinite;
}
.wraper .scroller img {
  min-width: calc(100% / 3);
  flex: 1;
  padding: 2rem;
  border-radius: 40px;
}
@keyframes slidy1 {
 0%{margin-left:0%;}
20%{margin-left:0%;}

25%{margin-left:-100%;}
45%{margin-left:-100%;}

50%{margin-left:-200%;}
70%{margin-left:-200%;}

75%{margin-left:-100%;}
95%{margin-left:-100%;}

100%{margin-left:0%;}
}

/* 1 IMAGEM */
.wraper_1_img {
  height: auto;
  width: 40%;
  margin: 0 auto;
  display: flex;
  overflow: hidden;
}
.scroller_1_img {
  display: flex;
  width: 100%;
  animation: slidy 15000ms infinite;
}
.wraper_1_img .scroller_1_img img {
  min-width: calc(100% / 1);
  flex: 1;
  padding: 0rem;
}

@keyframes slidy {
 0%{margin-left:0%;}
10%{margin-left:0%;}

15%{margin-left:-100%;}
20%{margin-left:-100%;}

25%{margin-left:-200%;}
30%{margin-left:-200%;}

35%{margin-left:-300%;}
40%{margin-left:-300%;}

45%{margin-left:-400%;}
50%{margin-left:-400%;}

55%{margin-left:-500%;}
60%{margin-left:-500%;}


65%{margin-left:-400%;}
70%{margin-left:-400%;}

75%{margin-left:-300%;}
80%{margin-left:-300%;}

85%{margin-left:-200%;}
90%{margin-left:-200%;}

95%{margin-left:-100%;}
97%{margin-left:-100%;}

100%{margin-left:0%;}
}

/* 2 IMAGEM MAIS LENTO IMAGEM */
.wraper_2_img {
  height: auto;
  width: 40%;
  margin: 0 auto;
  display: flex;
  overflow: hidden;
}
.scroller_2_img {
  display: flex;
  width: 100%;
  animation: slidy 20000ms infinite;
}
.wraper_2_img .scroller_2_img img {
  min-width: calc(100% / 1);
  flex: 1;
  padding: 0rem;
}

@keyframes slidy {
 0%{margin-left:0%;}
10%{margin-left:0%;}

15%{margin-left:-100%;}
20%{margin-left:-100%;}

25%{margin-left:-200%;}
30%{margin-left:-200%;}

35%{margin-left:-300%;}
40%{margin-left:-300%;}

45%{margin-left:-400%;}
50%{margin-left:-400%;}

55%{margin-left:-500%;}
60%{margin-left:-500%;}


65%{margin-left:-400%;}
70%{margin-left:-400%;}

75%{margin-left:-300%;}
80%{margin-left:-300%;}

85%{margin-left:-200%;}
90%{margin-left:-200%;}

95%{margin-left:-100%;}
97%{margin-left:-100%;}

100%{margin-left:0%;}
}

/* 
SITE RESPONSIVO
_____________________- */
.titulo-rigor {
  text-transform: uppercase;
  font-size:40px; /* mobile padrão */
}

@media (min-width: 768px) {
  .titulo-rigor {
    font-size: 45px;
  }
}

@media (min-width: 992px) {
  .titulo-rigor {
    font-size: 65px;
    letter-spacing: 1px;
    margin-top: 30px;
    line-height: 75px;
    text-align: center;
  }
}

.titulo-desde {
  text-transform: uppercase;
  font-size:20px; /* mobile padrão */
}

@media (min-width: 768px) {
  .titulo-desde {
    font-size: 26px;
  }
}

@media (min-width: 992px) {
  .titulo-desde {
    font-size: 25px;
    letter-spacing: 1px;
    line-height: 50px;
  }
}

@media (max-width: 768px) {
  .logo-mobile {
    max-height: 40px;
  }
}

@media (min-width: 769px) {
  .logo-mobile {
    max-height: 100px;
  }
}

@media (max-width: 575.98px) {
  .btn-mobile {
    font-size: 18px !important;
  }
}

/* PRODUTOS EFEITOS */
/* Estilos para o card principal */
.product-card {
  width: 100%; /* Define que o card ocupe 60% da largura do elemento pai */
  margin: 0 auto; /* Centraliza o card horizontalmente */
  border: 0px;
}

/* Estilos para a lista */
.product-list {
  list-style: none;
  position: relative;
  left: -20px; /* Ajuste ou remova se não for necessário */
}

/* Estilos para o título */
.product-title {
  margin-bottom: 40px;
  font-weight: 100;
  font-size: clamp(30px, 5vw, 60px);
  letter-spacing: 3px;
  opacity: 0.15;
  text-transform: uppercase;
  text-align: center;
}

/* Estilos para as imagens dentro do slider */

/* Este CSS garante que as setas (que são position: absolute) 
   fiquem posicionadas em relação ao seu contêiner pai mais próximo. */
.slider-imagens {
    /* Esta linha é a mais crítica para o posicionamento correto */
    position: relative; 
}

.slider-imagens img {
  width: 100%;
  height: auto; /* Altura fixa para as imagens, ajuste conforme necessário */
  object-fit: contain; /* Para garantir que as imagens cabem sem cortar */
  padding: 5px; /* Espaçamento entre as imagens no slider */
  border-radius: 0px; /* Bordas arredondadas */

  transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
  transform: scale(0.5); /* Imagens que não estão no centro começam ligeiramente menores */
  opacity: 0.3; /* Imagens que não estão no centro ficam com 40% de opacidade */
}

/* ESTILO CHAVE: Efeito para a imagem ativa (no centro) */
.slick-center img {
  opacity: 1; /* A imagem do centro fica totalmente visível */
  transform: scale(1.10); /* Aumenta a imagem do centro em 5% */
  /* Pode ajustar para 1.1 ou 1.2 para um efeito mais dramático */
}

/* Ajustes responsivos para o slider */
@media (max-width: 768px) {
  .product-card {
    width: 95%; /* Em telas menores, ocupe mais largura para melhor visualização */
    margin: 0 auto;
  }
  .slider-imagens img {
    height: 180px; /* Ajusta a altura da imagem para dispositivos móveis */
  }
 .slider-imagens .slick-prev {
    left: 0px; /* Move para a borda no celular */
  }
  .slider-imagens .slick-next {
    right: 0px; /* Move para a borda no celular */
  }
  /* Opcional: Diminuir o tamanho das setas no celular */
  .slider-imagens .slick-prev::before,
  .slider-imagens .slick-next::before {
    font-size: 20px;
  }
}


/* Estilo geral das setas */
.slider-imagens .slick-prev,
.slider-imagens .slick-next {
  font-size: 0; /* Oculta o texto padrão */
  line-height: 0;
  position: absolute;
  top: 50%; /* Centraliza verticalmente */
  transform: translate(0, -50%);
  display: block;
  width: 40px; /* Largura do botão */
  height: 40px; /* Altura do botão */
  padding: 0;
  cursor: pointer;
  color: transparent;
  border: none;
  outline: none;
  background: transparent;
  z-index: 10; /* Garante que as setas estejam acima das imagens */
}

/* Seta Anterior (<-) */
.slider-imagens .slick-prev {
  left: -50px; /* Distância da borda esquerda (ajuste conforme necessário) */
  z-index: 999; /* Força a seta a ficar em cima de todos os outros elementos */
}

/* Seta Próxima (->) */
.slider-imagens .slick-next {
  right: -50px; /* Distância da borda direita (ajuste conforme necessário) */
  z-index: 999; /* Força a seta a ficar em cima de todos os outros elementos */
}

/* Adicionando ícones (usando conteúdo CSS, você pode usar Font Awesome ou ícones de imagem) */
.slider-imagens .slick-prev::before,
.slider-imagens .slick-next::before {
  font-family: Arial, sans-serif; /* Usar uma fonte padrão */
  font-weight: 900; /* Negrito para o caractere */
  font-size: 25px; /* Aumentar o tamanho para serem vistos */
  line-height: 1;
  opacity: 0.5; 
  color: black; /* Cor dos ícones */
}

.slider-imagens .slick-prev::before {
  content: " \2039 "; /* Seta Unicode Simples */
}

.slider-imagens .slick-next::before {
  content: " \203A "; /* Seta Unicode Simples */
}


/* SOBRE NOS (Responsivo) */
/* --- ESTILOS PARA ECRÃS PEQUENOS (Mobile, Tablet Retrato) --- */

/* Estilos para a secção principal (container-fluid) */
.history-section-sm {
  background-color: rgb(250, 250, 250); /* Fundo cinza claro */
  margin-top: 0px; /* Garante que não há margem extra no topo */
  /* Largura controlada pelas classes col-12 col-md-10 no HTML */
}

/* Estilos para o invólucro do conteúdo dentro da coluna */
.history-content-wrapper-sm {
  padding-bottom: 20px; /* Espaçamento na parte inferior do conteúdo */
  /* O padding-top já está definido pela classe Bootstrap py-4 no HTML */
}

/* Estilo para o título principal */
.history-title-sm {
  font-size: 26px; /* Tamanho da fonte para ecrãs pequenos */
  text-align: center;
  letter-spacing: 0.5px;
  font-weight: bold;
  margin-bottom: 0px; /* Controla o espaçamento abaixo do título */
}

/* Estilo para o subtítulo */
.history-subtitle-sm {
  font-size: 16px; /* Tamanho da fonte para ecrãs pequenos */
  text-align: center;
  letter-spacing: 0.25px;
  color: #A4A4A4;
  opacity: 0.8;
  line-height: 1.2;
  margin-top: 5px; /* Pequena margem acima do subtítulo */
}

/* Estilo para os parágrafos de texto */
.history-text-block-sm p {
  font-size: 16px; /* Tamanho da fonte para os parágrafos */
  text-align: justify;
  line-height: 28px; /* Altura da linha para melhor legibilidade */
  margin-bottom: 0.8rem; /* Espaçamento entre parágrafos */
}

/* Estilo para a imagem dentro do texto */
.history-image-sm {
  width: 100%; /* A imagem ocupa 100% da largura do seu contêiner de coluna */
  opacity: 0.9;
  margin-top: 0px;
  margin-bottom: 0px;
}

.organization-image-wrapper-sm {
  /* O padding já é controlado pelas classes pt-4 pb-4 no HTML */
}

/* Estilo para a imagem do diagrama de organização */
.organization-diagram-sm {
  width: 100%; /* A imagem ocupa 100% da largura do seu contêiner de coluna */
  height: auto; /* Mantém a proporção da imagem */
}

.policy-content-sm {
  /* O padding já é controlado pelas classes pt-4 pb-4 no HTML */
}

/* Estilo para os parágrafos de texto */
.policy-content-sm p {
  font-size: 16px; /* Tamanho da fonte para os parágrafos */
  text-align: justify;
  line-height: 26px; /* Altura da linha para melhor legibilidade */
  margin-bottom: 0.8rem; /* Espaçamento entre parágrafos */
}

/* Estilo para as listas dentro dos parágrafos (se houver) */
.policy-content-sm p strong {
  font-weight: bold; /* Garante que o negrito se mantém */
}

.policy-content-sm .certification-codes {
  font-size: 14px; /* Um pouco menor para os códigos */
  line-height: 22px;
  text-align: left; /* Pode ser justificado ou à esquerda */
}

/* PAGINA SERVIÇOS ECRAS PEQUENOS */
/* --- ESTILOS PARA ECRÃS PEQUENOS (Mobile, Tablet Retrato) --- */
/* Estilos para a secção principal */
.pre-impressao-section-sm {
  background-color: rgb(250, 250, 250); /* Fundo cinza claro */
  margin-top: 0px; 
  padding-bottom: 10px; /* Padding no fundo da secção */
}

/* Estilo para o título */
.pre-impressao-title-sm {
  font-weight: 300;
  font-size: 32px; /* Ajustado para ecrãs pequenos */
  letter-spacing: 0.5px;
  margin-bottom: 30px; /* Espaçamento abaixo do título */
  margin-top: 50px;
}

/* Estilos para o invólucro do carrossel */
.pre-impressao-carousel-wrapper-sm {
  margin-top: 40px; /* Margem acima do carrossel */
  margin-bottom: 20px; /* Margem abaixo do carrossel */
  max-width: 80%;
}

/* Estilos para o carrossel em si */
#preImpressaoCarouselSmall {
  max-height: 250px; /* Altura máxima para o carrossel, ajuste conforme necessário */
  overflow: hidden; /* Esconde o que transbordar */
}

/* Estilos para as imagens dentro do carrossel */
#preImpressaoCarouselSmall .carousel-item img {
  
  height: 200px; /* Altura fixa para as imagens no carrossel pequeno */
  width: auto; /* Mantém a proporção */
  object-fit: contain; /* Ajusta a imagem dentro da área sem cortar */
  display: block; /* Garante que a imagem se comporta como bloco */
  margin: 0 auto; /* Centraliza a imagem */
}

/* Estilos para os controlos do carrossel (setas) */
#preImpressaoCarouselSmall {
  position: relative;
  overflow: hidden;
}

#preImpressaoCarouselSmall .carousel-control-prev,
#preImpressaoCarouselSmall .carousel-control-next {
  width: 30px;
  height: 30px;
  top: 50%;
  transform: translateY(-50%);
  background-color:#A4A4A4;
  border-radius: 50%;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
}

#preImpressaoCarouselSmall .carousel-control-prev {
  left: 10px;
}

#preImpressaoCarouselSmall .carousel-control-next {
  right: 10px;
}

#preImpressaoCarouselSmall .carousel-control-prev-icon,
#preImpressaoCarouselSmall .carousel-control-next-icon {
  width: 20px;
  height: 20px;
  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;
  filter: invert(1);
}

/* Estilos para o bloco de texto */
.pre-impressao-text-sm {
  padding-bottom: 0px; /* Padding no fundo do bloco de texto */
  margin-top: 60px; /* Margem no topo do bloco de texto */
}

.pre-impressao-text-sm p {
  font-size: 16px; /* Tamanho da fonte para parágrafos */
  line-height: 26px; /* Altura da linha para melhor legibilidade */
  text-align: justify;
  margin-bottom: 2rem; /* Espaçamento entre parágrafos */
}

.pre-impressao-text-sm p strong {
  font-weight: bold;
}

/* PÁGINA PRODUTOS PARA MOBILE */
/* ######################## */
/* --- ESTILOS GERAIS PARA AS SECÇÕES DE PRODUTOS (Mobile, Tablet Retrato) --- */
.produtos-section-sm {
  background-color: rgb(250, 250, 250); /* Fundo cinza claro */
  padding-top: 0px; /* Espaçamento superior para cada seção */
  padding-bottom: 10px; /* Espaçamento inferior para cada seção */
  margin-top: 0; /* Garante que não há margem extra no topo */
}

/* Estilos para a row do cabeçalho (título) */
.produtos-header-row-sm {
  margin-bottom: 0px; /* Espaçamento abaixo do título */
}

/* Estilo para o título de cada seção */
.produtos-title-sm {
  font-weight: 300;
  font-size: 32px; /* Tamanho da fonte para ecrãs pequenos */
  letter-spacing: 0.5px;
  text-transform: uppercase;
  margin-bottom: 30px; /* Espaçamento abaixo do título */
  margin-top: 50px;
}

/* Estilos para a row do carrossel */
.produtos-carousel-row-sm {
  margin-top: 0; /* Ajusta a margem superior para o carrossel */
}

/* Estilos para o carrossel em si (aplicado a todos os carrosséis) */
.carousel.slide {
  width: 100%; /* Ocupa 100% da largura da coluna */
  max-height: 350px; /* Altura máxima para o carrossel em ecrãs pequenos */
  overflow: hidden; /* Esconde o que transbordar */
}

/* Estilos para as imagens dentro do carrossel (aplicado a todas as imagens) */
.carousel.slide .carousel-item img {
  height: 300px; /* Altura fixa para as imagens no carrossel pequeno */
  width: auto; /* Mantém a proporção */
  object-fit: contain; /* Ajusta a imagem dentro da área sem cortar */
  display: block; /* Garante que a imagem se comporta como bloco */
  margin: 0 auto; /* Centraliza a imagem */
}

/* --- ESTILOS PARA AS SETAS DOS CARROSSÉIS (Versão Corrigida) --- */
/* --- Ajustes para os Controles do Carrossel (Botões e Setas) --- */
.carousel-control-prev,
.carousel-control-next {
  width: 15%; /* Reduz a largura da área clicável para que as setas fiquem mais próximas do centro */
  /* Remove qualquer background-color aqui se estiver presente */
  background: none !important; /* Remove qualquer fundo dos botões */
  opacity: 1; /* Garante que os botões não estão transparentes */
}

/* Remove qualquer background-color ou background-image dos ícones padrão do Bootstrap */
.carousel-control-prev-icon,
.carousel-control-next-icon {
  background-color: transparent !important; /* Assegura que não há fundo sólido */
  background-image: none !important; /* Remove a imagem de fundo padrão do Bootstrap */
  
  /* Mantém um tamanho razoável para a área do ícone */
  width: 2rem; 
  height: 2rem;
}

/* Força a cor preta nas setas usando SVG embutido nos pseudo-elementos */
.carousel-control-prev-icon::before {
  content: "";
  display: inline-block;
  width: 100%;
  height: 100%;
  /* SVG de seta esquerda preta */
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 100% 100%;
  z-index: 10; /* Garante que está acima de outros elementos */
}

.carousel-control-next-icon::before {
  content: "";
  display: inline-block;
  width: 100%;
  height: 100%;
  /* SVG de seta direita preta */
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 100% 100%;
  z-index: 10; /* Garante que está acima de outros elementos */
}

/* Opcional: Estilo ao passar o mouse para dar feedback visual */
.carousel-control-prev:hover .carousel-control-prev-icon::before,
.carousel-control-next:hover .carousel-control-next-icon::before {
    opacity: 0.7; /* Torna as setas ligeiramente transparentes ao passar o mouse */
}

/* PARA A PÁGINA CONTACTOS MOBILE */
/* --- ESTILOS PARA INFORMAÇÕES DE CONTACTO (Mobile, Tablet Retrato) --- */
.contacto-info-sm {
  padding-top: 0px; /* Margem no topo, ajustada como padding para o bloco */
  padding-bottom: 20px; /* Adicionei um padding inferior para espaço */
}

.contacto-address-line-1 {
  margin-top: 0px; /* Ajustado via CSS */
  font-size: 28px; /* Reduzido um pouco para mobile */
  letter-spacing: 0px;
  text-align: center;
  line-height: 1.2; /* Para garantir espaçamento adequado */
}

.contacto-address-line-2 {
  margin-top: 0px; /* Ajustado via CSS */
  font-size: 28px; /* Reduzido um pouco para mobile */
  letter-spacing: 0px;
  text-align: center;
  line-height: 1.2; /* Para garantir espaçamento adequado */
}

.contacto-phone {
  margin-top: 0px; /* Mantém a margem do original */
  font-size: 26px; /* Reduzido um pouco para mobile */
  letter-spacing: 0px;
  text-align: center;
  line-height: 1.2;
}

.contacto-phone-detail {
  font-size: 14px; /* Reduzido um pouco para mobile */
  letter-spacing: 0px;
  margin-top: 5px; /* Mantém a margem do original */
  line-height: 1; /* Ajustado para espaçamento adequado */
  text-align: center;
  color: #555; /* Uma cor um pouco mais suave para o detalhe */
}

.contacto-gps {
  margin-top: 20px; /* Mantém a margem do original */
  font-size: 16px; /* Reduzido um pouco para mobile */
  letter-spacing: 0px;
  text-align: center;
  line-height: 1;
}

/* PAGINA CONTACTOS PARA VERSAO MOBILE */
/* ######################## */
/* --- ESTILOS PARA O MAPA (Mobile, Tablet Retrato) --- */
.mapa-section-sm {
  padding-top: 10px; /* Margem no topo, como padding para o bloco */
  padding-bottom: 20px; /* Adicionei um padding inferior para espaço */
  background-color: transparent; /* Se quiser um fundo diferente, defina aqui */
}

/* Container para tornar o iframe responsivo e manter a proporção */
.map-responsive {
  overflow: hidden;
  padding-bottom: 75%; /* Proporção de 4:3 (300/400 = 0.75 ou 75%). Ajuste conforme a proporção desejada. */
  position: relative;
  height: 0;
}

.map-responsive iframe {
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  position: absolute;
  border: 0; /* Removendo a borda padrão do iframe */
}

/* OUTROS CONTACTOS */
/* --- ESTILOS PARA SECÇÕES DE DEPARTAMENTOS (Mobile, Tablet Retrato) --- */
.departamentos-section-sm {
  /* Pode adicionar um background-color se desejar, como no original */
  /* background-color: rgb(250, 250, 250); */
  padding-top: 60px; /* Padding superior para o bloco geral */
  padding-bottom: 0px; /* Padding inferior para o bloco geral */
}

.departamento-title-sm {
  font-size: 20px; /* Tamanho da fonte para o título em ecrãs pequenos */
  letter-spacing: 0px;
  text-align: center;
  text-transform: uppercase;
  font-weight: bold;
  margin-top: 0; /* Bootstrap's mt-5 handle spacing between sections */
  margin-bottom: 10px; /* Espaçamento abaixo do título */
}

.departamento-contact-sm p {
  font-size: 18px; /* Tamanho da fonte para os contactos em ecrãs pequenos */
  letter-spacing: 0px;
  text-align: center;
  line-height: 1.3; /* Espaçamento entre as linhas de contacto */
  margin-bottom: 10; /* Remove a margem inferior padrão dos parágrafos para linhas mais próximas */
}

/* PAGINA POLITICA DE PRIVACIDADE
################## */
/* --- ESTILOS PARA POLÍTICA DE PRIVACIDADE (Mobile, Tablet Retrato) --- */
.politica-privacidade-sm,
.politica-cookies-sm,
.condicoes-venda-sm
{
  padding-top: 5px; /* Mantém a margem do original como padding superior */
  padding-bottom: 40px; /* Adiciona um padding inferior para o bloco geral */
  background-color: transparent; /* Se quiser um fundo diferente, defina aqui */
}

.politica-paragrafo-sm {
  font-size: 16px; /* Tamanho da fonte para parágrafos em ecrãs pequenos */
  text-align: justify;
  line-height: 28px; /* Espaçamento entre as linhas para melhor legibilidade */
  margin-bottom: 1.5rem; /* Adiciona espaçamento entre parágrafos, ajustável */
}

.politica-paragrafo-sm:first-of-type {
    margin-top: 0; /* Remove margem extra no primeiro parágrafo se houver */
}

/* Estilo para os subtítulos (ex: 1. OS SEUS DADOS PESSOAIS) */
.politica-subtitulo-sm {
  font-size: 16px; /* Tamanho da fonte para subtítulos */
  font-weight: bold;
  text-transform: uppercase;
  margin-top: 2.5rem; /* Espaçamento acima do subtítulo */
  margin-bottom: 1rem; /* Espaçamento abaixo do subtítulo */
  text-align: left; /* Alinha os títulos à esquerda para consistência com o corpo */
}

.politica-tipo-cookie-sm {
  font-size: 16px; /* Um pouco menor para subcategorias */
  font-weight: bold;
  text-align: left;
  margin-top: 1.5rem; /* Espaçamento acima do tipo de cookie */
  margin-bottom: 0.5rem; /* Espaçamento abaixo do tipo de cookie */
}

/* Estilo para a lista principal (ex: • estar consciente...) */
.politica-lista-sm {
  list-style: disc; /* Ícone de lista padrão */
  padding-left: 20px; /* Indentação para a lista */
  margin-bottom: 1.5rem; /* Espaçamento abaixo da lista */
}

.politica-lista-sm li {
  font-size: 16px; /* Tamanho da fonte para itens da lista */
  line-height: 28px;
  margin-bottom: 0.5rem; /* Espaçamento entre itens da lista */
}

/* Estilo para a sub-lista (ex: - melhorar o funcionamento...) */
.politica-sublista-sm {
  list-style: none; /* Remove o ícone padrão da sub-lista */
  padding-left: 20px; /* Indentação adicional para a sub-lista */
  margin-top: 0.5rem; /* Espaçamento acima da sub-lista */
  margin-bottom: 0.5rem; /* Espaçamento abaixo da sub-lista */
  font-size: 16px; /* Tamanho da fonte para itens da lista */
  line-height: 28px;
}

.politica-sublista-sm li {
  font-size: 16px; /* Tamanho da fonte para itens da sub-lista */
  line-height: 28px;
  margin-bottom: 0.5rem;
  /* Simula a itálico do <i> original, se desejar */
  font-style: italic;
}

.condicoes-intro-sm {
  font-size: 16px; /* Tamanho da fonte para parágrafos em ecrãs pequenos */
  text-align: justify;
  line-height: 28px;
  margin-bottom: 1.5rem; /* Espaçamento abaixo da introdução */
}

/* Estilo para a lista ordenada das condições */
.condicoes-lista-sm {
  list-style-type: decimal; /* Garante numeração com pontos (1., 2., etc.) */
  padding-left: 25px; /* Indentação para a lista numerada */
  margin-bottom: 1.5rem; /* Espaçamento abaixo da lista */
}

.condicoes-lista-sm li {
  font-size: 16px; /* Tamanho da fonte para os itens da lista */
  text-align: justify;
  line-height: 28px;
  margin-bottom: 1rem; /* Espaçamento entre cada item da condição */
}


/* PORFOLIO */
/* DESKTOP */
   /* Contenção principal que agrupa o título e o carrossel */
   .portfolio-section-wrapper {
    width: 60vw; /* Exemplo: mantido de 80vw, ajuste se necessário */
    margin: 20px auto;
    text-align: center;
  }

  /* Contenção principal do carrossel */
  .custom-carousel-container {
    position: relative;
    overflow: hidden;
  }

  /* Div que contém todos os slides */
  .custom-carousel-track {
    display: flex;
    transition: transform 0.5s ease-in-out;
  }

  /* Cada slide individual */
  .custom-carousel-slide {
    min-width: 100%;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .custom-carousel-slide img {
    max-width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
  }

  /* Controles de navegação (setas) */
  .custom-carousel-control {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #333; /* Cor das setas */
    opacity: 10%;
    font-size: 3em; /* Tamanho das setas */
    cursor: pointer;
    padding: 0; /* Removido o padding para 'colar' a seta à borda do seu box model */
    width: 40px; /* Largura fixa para o botão da seta */
    height: 40px; /* Altura fixa para o botão da seta */
    display: flex; /* Para centralizar o ícone dentro da área do botão */
    justify-content: center;
    align-items: center;
    z-index: 10;
    user-select: none;
  }

  .custom-carousel-control:hover {
    color: #007bff;
  }

  .custom-carousel-control.prev {
    left: 0; /* Alinha a borda esquerda do botão com a borda esquerda do carrossel */
    /* Se quiser que a seta 'entre' na imagem, pode usar left: -20px; por exemplo */
  }

  .custom-carousel-control.next {
    right: 0; /* Alinha a borda direita do botão com a borda direita do carrossel */
    /* Se quiser que a seta 'entre' na imagem, pode usar right: -20px; por exemplo */
  }

  .uniform-image {
    width: 250px;
    height: 250px;
    object-fit: cover; /* Garante que a imagem cubra a área sem distorção */
  }

  hr.spacer {
    border: none; /* Remove a linha */
    height: 40px; /* Aumenta a altura para criar um espaço maior */
    background-color: transparent; /* Garante que não haja cor de fundo */
  }

  input, textarea {
    border-radius: 8px;
    border: 1px solid #ccc;
  }
  
  button.btn-dark {
    background-color: #000;
    font-weight: bold;
    letter-spacing: 0.5px;
  }

  

  /* FORMULARIO CONTACTOS */
  form {
    background: white;
    padding: 20px;
    border-radius: 8px;
    max-width: 400px;
    margin: auto;
    box-shadow: 0 0 15px rgba(0,0,0,0.1);
}
label {
    display: block;
    margin-top: 10px;
    font-weight: bold;
}
input, textarea {
    width: 100%;
    padding: 8px;
    margin-top: 5px;
    border-radius: 4px;
    border: 1px solid #ccc;
}
button {
    margin-top: 15px;
    padding: 10px;
    background: #333;
    color: white;
    border: none;
    cursor: pointer;
    border-radius: 4px;
}
button:hover {
    background: #555;
}