/* ============================================================
   LISTA DE PROJETOS (PROFISSIONAL) — Construtora Portellanato
   Extraído de portfolio/projects_professional.html
   ============================================================ */

.projects-hero { padding: 5rem 0 3rem; }
.projects-hero-card {
  padding: 3rem; border-radius: 2rem;
  background: linear-gradient(140deg, rgba(15,36,30,0.94), rgba(24,58,48,0.9)), url('../images/obra_fundo.jpg') center/cover no-repeat;
  box-shadow: 0 28px 70px rgba(17,29,25,0.16); color: #fff;
}
.projects-hero-card h1, .projects-hero-card p { color: #fff; }
.projects-hero-card p { max-width: 44rem; color: rgba(255,255,255,0.8); }
.projects-hero-card .tag {
  display: inline-flex; padding: 0.55rem 0.95rem; margin-bottom: 1rem; border-radius: 999px;
  background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.15);
  font-size: 0.8rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
}
.filter-wrap {
  margin-top: 2rem; padding: 1.1rem; border-radius: 1.4rem;
  background: rgba(255,255,255,0.78); border: 1px solid rgba(22,53,44,0.08);
  box-shadow: 0 16px 46px rgba(17,29,25,0.06);
}
.filter-chip {
  display: inline-flex; margin: 0.35rem; padding: 0.8rem 1.15rem; border-radius: 999px;
  text-decoration: none; color: rgba(22,53,44,0.72); background: rgba(22,53,44,0.05);
  border: 1px solid transparent; font-size: 0.82rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
  transition: all 0.25s ease;
}
.filter-chip:hover, .filter-chip.active { color: #16352c; background: rgba(255,255,255,0.95); border-color: rgba(22,53,44,0.12); }
.projects-section { padding: 3rem 0 6rem; }
.projects-intro { display: flex; justify-content: space-between; align-items: end; gap: 1rem; margin-bottom: 2rem; }
.projects-intro p { margin: 0; max-width: 38rem; color: rgba(22,53,44,0.7); }
.projects-count { color: rgba(22,53,44,0.62); font-size: 0.9rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.project-card {
  height: 100%; overflow: hidden; border-radius: 1.6rem; border: 1px solid rgba(22,53,44,0.08);
  background: rgba(255,255,255,0.88); box-shadow: 0 22px 58px rgba(18,29,25,0.07);
}
.project-card-media { position: relative; min-height: 19rem; overflow: hidden; background: linear-gradient(180deg, rgba(18,34,29,0.05), rgba(18,34,29,0.52)); }
.project-card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.7s ease; }
.project-card:hover .project-card-media img { transform: scale(1.08); }
.project-card-badge {
  position: absolute; top: 1rem; left: 1rem; padding: 0.6rem 0.95rem; border-radius: 999px;
  background: rgba(255,255,255,0.92); color: #16352c; font-size: 0.76rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
}
.project-card-body { padding: 1.7rem; }
.project-card-meta { display: flex; flex-wrap: wrap; gap: 0.7rem 1rem; margin-bottom: 1rem; color: rgba(22,53,44,0.72); font-size: 0.92rem; }
.project-card-meta span { display: inline-flex; align-items: center; gap: 0.4rem; }
.project-card-body p { color: rgba(22,53,44,0.72); }
.empty-card {
  padding: 3rem; text-align: center; border-radius: 1.6rem; background: rgba(255,255,255,0.84);
  border: 1px solid rgba(22,53,44,0.08); box-shadow: 0 18px 46px rgba(18,29,25,0.06);
}
.cta-panel {
  margin-top: 2.5rem; padding: 2.6rem; border-radius: 2rem;
  background: linear-gradient(135deg, rgba(20,46,38,0.96), rgba(24,58,48,0.92)), url('../images/port.jpeg') center/cover no-repeat;
  color: #fff; box-shadow: 0 24px 60px rgba(18,29,25,0.14);
}
.cta-panel h2, .cta-panel p { color: #fff; }
.cta-panel p { color: rgba(255,255,255,0.78); max-width: 42rem; }

@media (max-width: 991px) { .projects-intro { flex-direction: column; align-items: start; } }
@media (max-width: 767px) {
  .projects-hero-card, .cta-panel { padding: 1.8rem; }
  .project-card-body { padding: 1.4rem; }
}