/* =====================
   RESET & BASE
   ===================== */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: Arial, Helvetica, sans-serif;
  background: #f8f9fa;
  color: #2a2a2a;
  line-height: 1.7;
}

/* =====================
   NAVBAR (logo à esquerda + nome)
   ===================== */
.navbar {
  position: sticky; top: 0; z-index: 1000;
  width: 100%;
  display: flex; align-items: center; flex-wrap: wrap;
  gap: 14px; padding: 10px 24px;
  background: #707944; color: #fff;
}
/* Suporte a duas estruturas: com .nav-left/.nav-links ou itens soltos dentro da .navbar */
.nav-left { display: flex; align-items: center; gap: 12px; }
.nav-links { display: flex; align-items: center; gap: 18px; margin-left: auto; }

/* Logo do topo */
.logo-navbar, .nav-left img {
  max-height: 50px; /* logo maior no topo */
  height: auto; width: auto;
  display: block; object-fit: contain;
}

/* Nome/Marca ao lado do logo */
.brand, .nav-left .brand {
  color: #fff; font-weight: 700; letter-spacing: .2px;
  font-size: 1.25rem; /* ~20px */
  white-space: nowrap;
}

/* Links do topo (para OUTRAS páginas) */
.navbar .nav-link, .nav-links .nav-link, .navbar > a.nav-link {
  color: #fff; text-decoration: none; font-weight: 600;
  padding: 6px 10px; border-radius: 6px;
  transition: background .2s ease, color .2s ease;
}
.navbar .nav-link:hover { background: rgba(255,255,255,0.16); }

/* Dropdown (Projetos) */
.dropdown { position: relative; }
.dropdown-toggle { 
  cursor: pointer; 
  background: none; 
  border: none; 
  color: #fff;
  font-weight: 600;
  padding: 6px 10px;
  font-size: 16px;
}
.dropdown-content {
  display: none; 
  position: absolute; 
  left: 0; 
  top: calc(100% + 8px);
  min-width: 220px; 
  background: #fff; 
  border-radius: 10px;
  box-shadow: 0 10px 24px rgba(0,0,0,.12);
  border: 1px solid #e7eef7;
  z-index: 1000;
}
.dropdown-content a {
  display: block; 
  padding: 12px 14px; 
  text-decoration: none;
  color: #707944; 
  font-weight: 600;
}
.dropdown-content a:hover { background: #f1f6fd; }
.show { display: block; }

/* =====================
   LAYOUT SEM CAIXAS
   ===================== */
section, .container {
  max-width: 1100px; margin: 36px auto; padding: 0 20px;
  background: transparent !important; /* remove caixas */
  box-shadow: none !important; border: 0 !important;
}

h1 { color: #707944; font-size: 1.9rem; margin-bottom: 12px; }
h2 { color: #707944; font-size: 1.9rem; margin-bottom: 12px; }

.content { text-align: left; }
.content p { margin: 0 0 14px 0; text-align: justify; }

/* =====================
   IMAGENS NO CORPO (controladas)
   ===================== */
/* Logo (ou qualquer imagem) inserido no corpo do texto */
.logo-principal, section > img {
  max-width: 800px; /* mantém proporcional e pequeno */
  height: auto; display: block; margin: 14px auto 0;
}

/* Galeria responsiva, sem "caixas" */
.gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; }
.gallery img { width: 100%; height: auto; border-radius: 10px; transition: transform .25s ease; }
.gallery img:hover { transform: scale(1.02); }

/* =====================
   BOTÕES
   ===================== */
.btn {
  display: inline-block; margin-top: 18px; padding: 12px 22px;
  background: #707944; color: #fff; text-decoration: none;
  border-radius: 8px; font-weight: 700; letter-spacing: .2px;
  transition: background .2s ease;
}
.btn:hover { background: #054e17; }

/* =====================
   RODAPÉ SIMPLES (sem caixas)
   ===================== */
.footer { text-align: center; color: #555; font-size: 14px; margin-top: 40px; }
.footer a { color: hsla(139, 92%, 15%, 0.69); text-decoration: none; }
.footer a:hover { text-decoration: underline; }

/* =====================
   RESPONSIVO
   ===================== */
@media (max-width: 720px) {
  .brand { font-size: 1.05rem; }
  .logo-navbar, .nav-left img { max-height: 64px; }
  .nav-links { gap: 12px; }
}
* {box-sizing:border-box}

/* Slideshow container */
.slideshow-container {
  max-width: 1000px;
  position: relative;
  margin: auto;
}

/* Hide the images by default */
.mySlides {
  display: none;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  animation-name: fade;
  animation-duration: 1.5s;
}

@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}
/* ======== RESPONSIVIDADE PARA TABELA ======== */
.table-wrapper {
  overflow-x: auto;      /* ativa rolagem lateral */
  -webkit-overflow-scrolling: touch; /* rolagem suave no iOS */
  margin-top: 20px;
  border-radius: 8px;
}
.table-wrapper table {
  min-width: 600px; /* evita "apertar" demais colunas */
}