/* ===== Base ===== */
* { box-sizing: border-box; }
body {
  font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  background-color: #F9F4EE;
  color: #111827;
  line-height: 1.6;
  font-size: 0.95rem;
  margin: 0;
}

/* ===== Navbar / Footer ===== */
.navbar { background:#F9F4EE !important; border-bottom:1px solid #F9F4EE; }
.navbar-brand { font-weight:700; }
footer { background:#fff; border-top:1px solid #e5e7eb; }

/* Navbar push-down (sempre colapsada) */
.navbar.oc-pushdown { display:flex; flex-direction:column; align-items:stretch; }
#navbarMain { width:100%; }
#navbarMain .menu-panel { background:#F9F4EE; border-top:1px solid #e5e7eb; }
#navbarMain .navbar-nav { text-align:center; }
#navbarMain .nav-link { padding:.75rem 0; }
#navbarMain hr { border:0; border-top:1px solid #e5e7eb; margin:0; }
.nav-link.active { color:#ff006e !important; font-weight:600; }

/* ===== Formulários (busca e newsletter iguais) ===== */
form .form-control {
  height: 52px;
  border-radius: 10px;
  font-size: 0.95rem;
}
.d-flex .form-control { flex: 1 1 auto; }

/* ===== Botões ===== */
.btn { border-radius:10px; font-weight:500; }
.btn-primary { background-color:#8338ec; border:none; color:#fff; }
.btn-primary:hover, .btn-primary:focus { background-color:#ff006e; filter:brightness(1.05); }
.btn-outline-secondary { color:#374151; border-color:#d1d5db; }
.btn-outline-secondary:hover { background:#f3f4f6; border-color:#9ca3af; color:#111827; }

/* ===== Cards ===== */
.card {
  border:0; border-radius:12px; background:#fff;
  box-shadow:0 2px 8px rgba(0,0,0,.06);
  transition: transform .18s ease, box-shadow .18s ease;
}
.card:hover { transform: translateY(-3px); box-shadow:0 8px 20px rgba(0,0,0,.08); }
.card-title { font-size:1rem; font-weight:600; color:#0f172a; }
.card-text { color:#6b7280; font-size:.9rem; }  /* sem clamp/truncate para variar altura */
.card-img-top {
  display:block; width:100%; height:auto; object-fit:cover;
  border-top-left-radius:12px; border-top-right-radius:12px;
}

/* ===== Masonry (puro com sizer) ===== */
:root {
  --masonry-col: 250px; /* ajuste aqui (≥ 200px p/ sua imagem) */
}

.masonry { position: relative; margin: 0 auto; }
.masonry-sizer, .masonry-item { width: var(--masonry-col); } /* FIXO em px */
.masonry-item { margin: 0; } /* o espaçamento vem do 'gutter' do Masonry */

/* imagem centralizada com largura fixa */
.card-img-fixed {
  display: block;
  margin: 0 auto;
  width: 150px;        /* sua largura fixa desejada */
  max-width: 100%;     /* por segurança, evita overflow se você mudar col */
  height: auto;
  object-fit: contain; /* não corta */
}

/* opcional: anima o aparecimento quando o layout estiver pronto */
.masonry { opacity: 0; transition: opacity .2s ease; }
.masonry.is-ready { opacity: 1; }

h1{

    font-size: 2em !important;
    background: -webkit-linear-gradient(360deg,#ffbe0b,#fb5607, #ff006e, #8338ec, #3a86ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: "Lobster", cursive;
    font-weight: 400;
    font-style: normal;
    line-height: 2em !important;

}

h2{

    font-size: 1.6em !important;
    background: -webkit-linear-gradient(360deg,#ffbe0b,#fb5607, #ff006e, #8338ec, #3a86ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: "Lobster", cursive;
    font-weight: 400;
    font-style: normal;
    line-height: 1.6em !important;

}

h3{

    font-size: 1.7em !important;
    background: -webkit-linear-gradient(360deg,#fb5607, #ff006e, #8338ec, #3a86ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: "Lobster", cursive;
    font-weight: 400;
    font-style: normal;
    line-height: 1.6em !important;

}

.nav-link{

  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-size: 1.3em;
  font-style: normal;
  text-transform: uppercase;

}

.btn-success{
    background: #ff006e;
     border:0;
}

.btn-success:hover, .btn-success:focus { background-color:#8338ec; filter:brightness(1.05); border:0; }

.btn-success:active { background-color:#8338ec; filter:brightness(1.05); border:0; }

.active{ background-color:#8338ec; filter:brightness(1.05); border:0; }

.btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active {
    color: #FFF;
    background-color: #8338ec !important;
    border-color: #8338ec !important;
}

.card-title{
  
  font-family: "Oswald", sans-serif;
  background: -webkit-linear-gradient(360deg, #ff006e, #8338ec);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 1.3em !important;
  font-style: normal;
  text-transform: uppercase;
  font-weight: 400 !important;

}
    

hr{

    background: -webkit-linear-gradient(360deg,#fb5607, #ff006e, #8338ec, #3a86ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

}

.pagination {
  --bs-pagination-active-color: #fff;
  --bs-pagination-active-bg: #ff006e;
  --bs-pagination-active-border-color: #ff006e;
  --bs-pagination-disabled-color:  #8338ec;
  --bs-pagination-disabled-bg: #fff;
}

.titulo{
    font-family: "Oswald", sans-serif !important;
        background: -webkit-linear-gradient(360deg, #ff006e, #8338ec);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.cinza{
    font-family: "Oswald", sans-serif !important;
        background: -webkit-linear-gradient(360deg, #ff006e, #8338ec);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

@media (max-width: 600px) {
  /* Estilos para smartphones */
/* Masonry: colunas em pixels + gutter controlado no JS */
:root {
  --masonry-col: 150px; /* ajuste aqui (≥ 200px p/ sua imagem) */
}

h1{

    font-size: 1.5em !important;
}


}


#progressbar {
  position: fixed;
  top: 0;
  left: 0;
  height: 8px;
  width: 0;
  z-index: 9999;
  transition: width 0.1s linear;
  background: linear-gradient(to right, #ff006e, #8338ec);
}