:root {
      --madeira-escura: #3a2218;
      --madeira-mezcla: #5d4037;
      --madeira-clara: #a67c6d;
      --verde-serra: #173A1F;
      --bege-natural: #f9f4ed;
      --cinza-texto: #3e3e3e;
    }

    body {
      font-family: 'Montserrat', sans-serif;
      color: var(--cinza-texto);
      background: var(--bege-natural);
      overflow-x: hidden;
    }

    h1, h2, h3 { 
      font-family: 'Playfair Display', serif; 
      font-weight: 800; 
      color: var(--madeira-escura); 
    }
    
    h2.section-title[data-aos] {
        color: #3a2218 !important;
    }
    
  .titulo2 {
    font-family: 'Playfair Display', serif;
      font-size: calc(1.425rem + 2.1vw);
      font-weight: 300;
      line-height: 1.3;
  }
    a,
    a:visited,
    a:hover,
    a:active {
        text-decoration: none;
    }

.navbar {
  background: linear-gradient(to bottom, #f8f8f8, #cbcaca) !important;
  backdrop-filter: blur(8px);
  transition: all 0.5s;
}

/* Cor padrão (fundo claro) → texto madeira escura */
.navbar-brand,
.navbar-brand small,
.nav-link,
.navbar-nav .nav-link {
  color: #482b03 !important;
}

/* Hover/active no estado normal - mantém o teu tom escuro, sem alterar cor principal */
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus,
.navbar-nav .nav-link.active {
  color: #5d4037 !important;   /* teu destaque original */
}

/* Quando scrolled → fundo escuro + texto branco */
.navbar.scrolled {
  background: rgba(58,34,24,0.98) !important;
  padding: 0.6rem 0;
  box-shadow: 0 6px 25px rgba(0,0,0,0.25);
}

/* Texto branco quando scrolled */
.navbar.scrolled .navbar-brand,
.navbar.scrolled .navbar-brand small,
.navbar.scrolled .nav-link,
.navbar.scrolled .navbar-nav .nav-link {
  color: #ffffff !important;
}

/* Hover/active no estado scrolled - mantém o teu destaque cinza claro */
.navbar.scrolled .nav-link:hover,
.navbar.scrolled .nav-link:focus,
.navbar.scrolled .nav-link.active {
  color: #e0e0e0 !important;   /* teu destaque original */
}

/* Hamburger menu (toggler) - cor adaptada */
.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23482b03' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

.navbar.scrolled .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23ffffff' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

/* === Novo: Friso verde gradiente esbatido na parte de baixo ao hover === */
.navbar-nav .nav-link {
  position: relative;                    /* Necessário para o ::after */
  display: inline-block;                 /* Garante que o pseudo funcione bem */
  padding-bottom: 0.5rem;                /* Espaço extra em baixo para o friso */
}

.navbar-nav .nav-link::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0;
  height: 4px;                           /* Espessura do friso - ajusta para 3px/5px/6px se quiseres */
  background: linear-gradient(
    to right,
    rgba(120, 248, 98, 0.85),            /* Verde claro/neon início */
    rgba(179, 241, 171, 0.75),           /* Verde médio */
    rgba(57, 255, 20, 0.55)              /* Verde escuro/neon fim - esbate */
  );
  border-radius: 4px;
  opacity: 0;
  transform: translateX(-50%);
  transition: width 0.4s ease, opacity 0.4s ease;
  filter: blur(2px);                     /* Esbatimento suave nas pontas */
  pointer-events: none;
}

.navbar-nav .nav-link:hover::after {
  width: 85%;                            /* Cresce para quase toda a largura do link - ajusta % */
  opacity: 1;
}

/* Glow extra para reforçar o efeito esbatido/neon (opcional, mas fica bonito) */
.navbar-nav .nav-link:hover::after {
  box-shadow: 0 0 12px 4px rgba(120, 248, 98, 0.45);
}

/* Para o botão "Peça Orçamento" - mesmo friso em baixo */
.navbar .btn-outline-light {
  position: relative;
  overflow: hidden;
  transition: all 0.4s ease;
}

.navbar .btn-outline-light::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 5px;
  background: linear-gradient(to right, rgba(120, 248, 98, 0.85), rgba(179, 241, 171, 0.7));
  transition: width 0.4s ease;
  filter: blur(2.5px);
  box-shadow: 0 0 10px rgba(120, 248, 98, 0.5);
}

.navbar .btn-outline-light:hover::after {
  width: 100%;                           /* Full width no botão */
}


/* === Sombra verde esbatida na base da navbar === */
.navbar {
  background: linear-gradient(to bottom, #f8f8f8, #cbcaca) !important;
  backdrop-filter: blur(8px);
  transition: all 0.5s ease;
  box-shadow:
    0 6px 14px rgba(120, 248, 98, 0.25),
    0 12px 28px rgba(120, 248, 98, 0.18);
}

.navbar.scrolled {
  background: rgba(58,34,24,0.98) !important;
  padding: 0.6rem 0;
  box-shadow:
    0 8px 18px rgba(120, 248, 98, 0.35),
    0 18px 40px rgba(120, 248, 98, 0.25);
}

.hero {
  min-height: 500px;
  height: 80vh; /* antes estava 100vh */
  position: relative;
  overflow: hidden;
  color: white;
  display: flex;
  align-items: center;
  text-align: center;
}

/* container do slideshow */
.slideshow {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

/* cada slide */
.slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1.5s ease-in-out;
  animation: slideshow 15s infinite;
}

/* imagem dentro do slide */
.slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;

  /* mostra o centro da imagem (evita cortar demasiado topo ou base) */
  object-position: center center;
}

/* delays (5 imagens) */
.slide:nth-child(1) { animation-delay: 0s; }
.slide:nth-child(2) { animation-delay: 3s; }
.slide:nth-child(3) { animation-delay: 6s; }
.slide:nth-child(4) { animation-delay: 9s; }
.slide:nth-child(5) { animation-delay: 12s; }

@keyframes slideshow {
  0% { opacity: 0; }
  8% { opacity: 1; }
  25% { opacity: 1; }
  33% { opacity: 0; }
  100% { opacity: 0; }
}

.hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(rgba(0,0,0,0.62), rgba(0,0,0,0.72));
  z-index: 1;
}

.hero .container {
  z-index: 2;
}

    .section-title {
      position: relative;
      display: inline-block;
      padding:0.3em 0.3em 1rem;
    }

    .section-title::after {
      content: '';
      position: absolute;
      width: 120px;
      height: 5px;
      background: var(--verde-serra);
      bottom: 0;
      left: 50%;
      transform: translateX(-50%);
      border-radius: 3px;
    }

    .card-wood {
      border: none;
      border-radius: 16px;
      overflow: hidden;
      background: white;
      box-shadow: 0 12px 40px rgba(0,0,0,0.12);
      transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1);
    }

    .card-wood:hover {
      transform: translateY(-18px) scale(1.04);
      box-shadow: 0 30px 60px rgba(0,0,0,0.22);
    }

    .card-wood img {
      transition: transform 0.8s ease;
    }

    .card-wood:hover img {
      transform: scale(1.18) rotate(1.5deg);
    }

    .cta-wave {
      background: var(--verde-serra);
      color: white;
      clip-path: polygon(0 10%, 100% 0, 100% 90%, 0 100%);
      padding: 10rem 0 10rem;
    }

    footer {
      color: #d0c0b5;
    }
    .text-beje{
      color: #C9B2A1;
    } 
    /* Faixa superior */
    .footer-top {
      background: var(--madeira-escura);
    }

    /* Faixa inferior */
    .footer-bottom {
      background: var(--madeira-mezcla);
      border-top: 1px solid rgba(255,255,255,0.15);
    }
       footer a {
        color: #252525;
        text-decoration: none;
        transition: color 0.3s ease;
    }

    @media (max-width: 992px) {
      .hero { height: 80vh; }
      h1.display-2 { font-size: 3.8rem; }
    }

    @media (max-width: 991px) {
  .navbar-brand small {
    font-size: 0.75rem; /* ou display: none; se preferires esconder */
  }
  }
  .video-wrapper {
    aspect-ratio: 16 / 9;          /* Proporção padrão de vídeo HD */
    background-color: #000;        /* Fundo preto enquanto carrega */
    max-height: 500px;             /* Limita altura em desktop para não ficar gigante */
  }

  .video-sobre {
    object-fit: cover;             /* Preenche o espaço sem distorcer */
    object-position: center;
  }

  @media (max-width: 991px) {
    .video-wrapper {
      aspect-ratio: 4 / 3;         /* Mais quadrado em mobile para melhor visualização */
      max-height: 400px;
    }
  }
/* Hover nas imagens dentro dos cards: moldura verde gradiente esbatida + zoom leve */
.card-wood {
    position: relative;               /* Necessário para posicionar o pseudo-elemento */
    overflow: hidden;                 /* Evita que o blur vaze para fora */
    transition: all 0.4s ease;
    border-radius: 16px;              /* Mantém o arredondamento dos cards */
}

.card-wood:hover,
.card-wood:hover img {
    transform: scale(1.05);           /* Zoom sutil na imagem e card */
    transition: transform 0.5s ease;
}

.card-wood:hover {
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25); /* Sombra mais forte no hover */
}

/* Moldura gradiente esbatida (suave e borrada) */
.card-wood::before {
    content: '';
    position: absolute;
    inset: -10px;                     /* Afasta para criar "borda" maior e mais esbatida */

    border-radius: 24px;              /* Maior que o card para suavizar os cantos */
    opacity: 0;
    transition: opacity 0.4s ease, transform 0.4s ease;
    filter: blur(10px);               /* Aqui está o segredo: esbatido suave! */
    z-index: -1;                      /* Fica por trás do conteúdo */
    pointer-events: none;
}

.card-wood:hover::before {
    opacity: 1;
    transform: scale(1.08);           /* Leve expansão para mais dinamismo */
}

/* Glow extra para reforçar o efeito esbatido/neon */
.card-wood:hover {
    box-shadow: 
        0 0 25px 10px #78f862,
        inset 0 0 20px #daf0d7;
}


/* Fundo verde semi-transparente nas caixas/cards ao hover (ajustado para combinar) */
.card-wood:hover,
.card.border-0:hover {  /* cards dos serviços/certificações */
    background-color: rgb(204, 228, 200) !important; /* Verde muito claro e harmonioso */
}
.btn-forest {
  background-color: #1e4d2b;
  color: white;
  border: none;
}
.btn-forest:hover {
  background-color: #3c2400;
  color: white;
}


  .cookieConsent {
	z-index: 999;
	width: 350px;
	min-height: 20px;
	border-radius: 20px;
	padding: 20px 20px 20px 30px;
	background: #044410;
	opacity: 0.85;
	overflow: hidden;
	position: fixed;
	bottom: 30px;
	left: 30px;
	display: none;
}

.cookieConsent .cookieTitle a {
	font-family: OpenSans, arial, sans-serif;
	color: #FFFFFF;
	font-size: 22px;
	line-height: 20px;
	display: block;
}

.cookieConsent .cookieDesc p {
	margin: 0;
	padding: 0;
	font-family: OpenSans, arial, sans-serif;
	color: #FFFFFF;
	font-size: 13px;
	line-height: 20px;
	display: block;
	margin-top: 10px;
}

.cookieConsent .cookieDesc a {
	font-family: OpenSans, arial, sans-serif;
	color: #FFFFFF;
	text-decoration: underline;
}

.cookieConsent .cookieButton a {
	display: inline-block;
	font-family: OpenSans, arial, sans-serif;
	color: #FFFFFF;
	font-size: 14px;
	font-weight: bold;
	margin-top: 14px;
	background: #064e3b;
	border-radius: 20px;
	padding: 10px 30px;
	text-align: center;
	transition: background 0.3s;
}

.cookieConsent .cookieButton a:hover {
	cursor: pointer;
	background: #94F053;
}

@media (max-width: 980px) {
	.cookieConsent {
		bottom: 0 !important;
		left: 0 !important;
		width: 100% !important;
	}
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}

.livro-reclamacoes img {
  max-width: 80px;   /* ajuste livre: 80px, 100px, 120px, etc. */
  width: 100%;
  height: auto;
}
.section-offset {
  margin-top: 100px; /* ajuste fino: 120–160px conforme a navbar */
}

.product-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  border: none;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 25px rgba(0,0,0,0.1);
  background: white;
}

.product-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 15px 35px rgba(0,0,0,0.15);
}

.product-card img {
  transition: transform 0.5s ease;
  width: 100%;
  height: 220px; /* altura fixa para uniformidade */
  object-fit: cover;
}

.product-card:hover img {
  transform: scale(1.08);
}

.product-title {
  font-family: 'Playfair Display', serif;
  color: var(--madeira-escura); /* usa a tua variável de cor madeira, ou #3a2218 */
  font-weight: 700;
}

.modal-img-full {
  max-width: 100%;
  max-height: 80vh;
  object-fit: contain;
}

    .centrar {
      text-align: center;
    }

.titulo3 {
  font-size: calc(1.3rem + .6vw);
  }

.titulo4 {
  font-size: calc(1.275rem + .2vw);
}

.titulo5 {
  font-size: 1.275rem;
}

@media (max-width: 576px) {
  .ratio {
    --bs-aspect-ratio: 56%;
  }
}

/* ==========================================================
   OTIMIZAÇÕES ESPECÍFICAS PARA TELEMÓVEIS (Mobile View)
   ========================================================== */
@media (max-width: 767.98px) {
  
  /* 1. Ajustar Títulos Principais */
  h1.display-2 { 
    font-size: 2.2rem !important; 
  }
  
  /* 2. Reduzir a altura da secção de imagens iniciais (Hero) */
  .hero { 
    height: 70vh !important; 
  }
  
  /* 3. Ajustar os títulos das secções */
  h2.display-4, h2.display-5, .section-title {
    font-size: 2rem !important;
  }
  
  /* 4. Ajustar parágrafos e subtítulos para melhor legibilidade */
  .titulo2 {
    font-size: 1.8rem !important;
  }
  .lead {
    font-size: 1.05rem !important;
    line-height: 1.6;
  }

  /* 5. Ajustar o tamanho do logotipo na Navbar para dar mais espaço de navegação */
  .navbar-brand img {
    height: 45px !important;
    max-width: 140px !important;
  }

  /* 6. Esconder o texto secundário do logótipo no telemóvel para não encavalar o menu */
  .navbar-brand small {
    display: none !important;
  }

  /* 7. Dar um ligeiro respiro lateral aos conteúdos num telemóvel */
  .container {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
}