/* ========================================================================
   AÇOS LITORAL — AJUSTES DA PÁGINA PRODUTOS
   O formulário NÃO possui estilização própria neste arquivo.
   Ele herda integralmente o componente usado na Home por meio de:
   /assets/css/shared-home-form.css
   ======================================================================== */

.page-produtos{
  --prod-heading-font: Georgia, "Times New Roman", Times, serif;
}

/* Tipografia aplicada somente ao conteúdo exclusivo da página Produtos.
   O formulário compartilhado fica fora desta regra para permanecer idêntico
   ao formulário da Home. */
.page-produtos .phero h1,
.page-produtos .prod-body h3{
  font-family: var(--prod-heading-font) !important;
  font-weight: 400 !important;
  font-style: normal !important;
  letter-spacing: -.018em !important;
}

/* Cabeçalho principal centralizado. */
.page-produtos .phero > .container{
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
}
.page-produtos .phero :where(h1,.lead){
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}
.page-produtos .phero h1{
  max-width: 18ch !important;
}
.page-produtos .phero .lead{
  max-width: 760px !important;
}
.page-produtos .phero .actions{
  justify-content: center !important;
}

/* Títulos e textos dos produtos centralizados. */
.page-produtos .prod-body{
  text-align: center !important;
}
.page-produtos .prod-body :where(h3,p){
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}
.page-produtos .prod-body .link-arw{
  justify-content: center !important;
}

/* Filtros de categoria em cápsulas. */
.page-produtos .prod-tools{
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  margin: 0 0 30px !important;
}
.page-produtos .filter-bar{
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  padding: 6px !important;
  border: 1px solid rgba(5,7,12,.10) !important;
  border-radius: 999px !important;
  background: #f1f2f3 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75) !important;
}
.page-produtos .filter-bar .fbtn{
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 10px 18px !important;
  border: 1px solid transparent !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #444b55 !important;
  box-shadow: none !important;
  font-family: Manrope, Arial, Helvetica, sans-serif !important;
  font-size: .92rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  cursor: pointer !important;
  transition: background .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease !important;
}
.page-produtos .filter-bar .fbtn:hover{
  background: #fff !important;
  color: #05070c !important;
  border-color: rgba(5,7,12,.10) !important;
}
.page-produtos .filter-bar .fbtn.active,
.page-produtos .filter-bar .fbtn[aria-pressed="true"]{
  background: #05070c !important;
  color: #fff !important;
  border-color: #05070c !important;
  box-shadow: 0 8px 20px rgba(5,7,12,.18) !important;
}
.page-produtos .filter-bar .fbtn:focus-visible{
  outline: 0 !important;
  box-shadow: 0 0 0 4px rgba(245,196,0,.28) !important;
}

/* Apenas o espaçamento entre a vitrine e o componente compartilhado.
   Nenhuma regra interna do formulário é alterada nesta página. */
.page-produtos .section-contact-final .inline-contact-wrap{
  margin-top: clamp(96px,10vw,152px) !important;
}

@media (max-width:760px){
  .page-produtos .prod-tools{
    justify-content: center !important;
  }
  .page-produtos .filter-bar{
    width: 100% !important;
    justify-content: center !important;
    border-radius: 22px !important;
  }
  .page-produtos .filter-bar .fbtn{
    flex: 1 1 calc(50% - 7px) !important;
  }
}

@media (max-width:680px){
  .page-produtos .section-contact-final .inline-contact-wrap{
    margin-top: 72px !important;
  }
}