.page-header {
    padding: 128px 0 40px 0 !important;
}

/* --- Base Container & Row --- */
.custom-container {
  width: 100%;
  max-width: 1320px;
  margin-right: auto;
  margin-left: auto;
  padding: 1.5rem;
}

.custom-row {
  display: grid;
  grid-template-columns: repeat(12, 1fr); /* Cria a malha de 12 colunas */
  gap: 1.5rem; /* Gutter / Calha */
}

/* --- Mobile Base (Todas as colunas col-* ocupam 12 frações por padrão) --- */
[class*="col-"] {
  grid-column: span 12;
}

/* --- Breakpoint Desktop (>= 992px) --- */
@media (min-width: 992px) {
  .col-lg-1  { grid-column: span 1; }
  .col-lg-2  { grid-column: span 2; }
  .col-lg-3  { grid-column: span 3; }
  .col-lg-4  { grid-column: span 4; }
  .col-lg-5  { grid-column: span 5; }
  .col-lg-6  { grid-column: span 6; }
  .col-lg-7  { grid-column: span 7; }
  .col-lg-8  { grid-column: span 8; }
  .col-lg-9  { grid-column: span 9; }
  .col-lg-10 { grid-column: span 10; }
  .col-lg-11 { grid-column: span 11; }
  .col-lg-12 { grid-column: span 12; }
}

/* Apenas estilo visual dos blocos de teste */
.content-box {
  background-color: #f8f9fa;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  padding: 1.5rem;
}


.img-full-width{
    width: 100%;
    height: auto; 
}


/* --- Suporte a colunas para Tablet (col-md-4 -> 3 por linha) --- */
@media (min-width: 768px) {
  .col-md-4 { 
    grid-column: span 4; 
  }
}

/* --- Suporte a colunas para Desktop (col-lg-3 -> 4 por linha) --- */
@media (min-width: 992px) {
  .col-lg-3 { 
    grid-column: span 3; 
  }
}

/* --- Estilização do Item da Galeria e Padronização 4:3 --- */
.galeria-item {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3; /* Força a proporção 4:3 retangular */
  overflow: hidden;
  border-radius: 8px; /* Opcional: cantos ligeiramente arredondados */
  background-color: #f0f0f0; /* Skeleton / fundo enquanto carrega */
}

.galeria-item img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* Recorta a imagem para preencher o 4:3 sem distorcer/esticar */
  transition: transform 0.3s ease;
}

/* Efeito sutil de zoom ao passar o mouse */
.galeria-item:hover img {
  transform: scale(1.05);
}






.text-center{
    text-align: center;
}

.btn{
    margin: 16px;
}








/* --- Suporte à coluna col-lg-6 (50% no Desktop) --- */
@media (min-width: 992px) {
  .col-lg-6 { 
    grid-column: span 6; 
  }
}

/* --- Section e Embed Responsivo 16:9 --- */
.section-videos {
  padding: 3rem 0;
}

.video-wrapper {
  width: 100%;
  aspect-ratio: 16 / 9;
  background-color: #000;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #d4af37; /* Borda dourada padronizada */
}

.video-wrapper iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}














.mx-auto{
    margin: 0 auto !important;
}

.form-section{
    padding: 1.5rem 0;
    background-color: rgb(255, 255, 255, .4);
}

.form-title{
    margin-bottom: 20px;
}





















.btn-submit {
      width: 100%;
      height: 50px;
      background-color: #b29348;
      color: #ffffff;
      border: none;
      border-radius: 25px;
      font-size: 1rem;
      font-weight: 700;
      letter-spacing: 0.1em;
      cursor: pointer;
      margin-top: 0.5rem;
      transition: background-color 0.2s ease, transform 0.1s ease;
    }

    .btn-submit:hover {
      background-color: #9d803d;
    }

    .btn-submit:active {
      transform: scale(0.99);
    }


/* Define a cor cinza quando nenhuma opção válida foi selecionada */
  select:invalid {
    color: gray;
  }

  /* Garante que as opções válidas dentro da lista apareçam em preto */
  select option {
    color: black;
  }

  /* Opcional: mantém a primeira opção cinza dentro da lista aberta */
  select option:first-child {
    color: gray;
  }

  .form-group textarea{
    min-height: 110px;
  }

/* Estilização da div de erro e SVG */
.erro-campo {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #d93025;
  font-size: 15px;
  font-weight: 550;
}

.erro-campo svg {
  flex-shrink: 0;
}



.form-contato-success {
      color: green;
      font-size: 20px;
    }

    #form-mensagens {
      padding: 20px 0;
      text-align: center;
      font-size: 16px;
    }

    .erro-campo {
      color: red;
    }
.form-group {
    gap: 0;
}