/* Estilos para cards clicáveis */
.card-imovel {
  transition: all 0.3s ease;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  overflow: hidden;
}

.card-imovel:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 25px rgba(183, 154, 95, 0.15);
  border-color: var(--cor-principal);
}

.card-imovel .card-img-top {
  transition: transform 0.3s ease;
  height: 200px;
  object-fit: cover;
}

.card-imovel:hover .card-img-top {
  transform: scale(1.05);
}

/* Estilos para o carrossel de destaques clicável */
#carouselBanner .carousel-item {
  transition: transform 0.3s ease;
}

#carouselBanner .carousel-item:hover {
  transform: scale(1.02);
}

#carouselBanner .carousel-content {
  padding: 2rem;
}

#carouselBanner .carousel-item a {
  display: block;
  height: 100%;
}

#carouselBanner .carousel-item a:hover {
  text-decoration: none !important;
}

/* Cores personalizadas - usar CSS dinâmico */
/* As variáveis --cor-principal, --preto, --cinza são carregadas de /css */

/* Preço em destaque */
.price, .card-price {
  color: var(--cor-principal);
  font-weight: bold;
  font-size: 1.25rem;
}

/* Features/características */
.features span, .card-icons span {
  display: inline-block;
  margin-right: 1rem;
  margin-bottom: 0.5rem;
  color: var(--cinza);
  font-size: 0.9rem;
}

.features i, .card-icons i {
  color: var(--cor-principal);
  margin-right: 0.25rem;
}

/* Location */
.location, .card-text {
  color: var(--cinza);
  margin-bottom: 1rem;
}

.location i, .card-text i {
  color: var(--cor-principal);
  margin-right: 0.5rem;
}

/* Título da seção */
.section-title {
  color: var(--preto);
  font-weight: bold;
  margin-bottom: 2rem;
  font-size: 2.5rem;
}

/* Responsividade */
@media (max-width: 768px) {
  .section-title {
    font-size: 2rem;
  }
  
  .card-imovel:hover {
    transform: none;
  }
  
  #carouselBanner .carousel-item:hover {
    transform: none;
  }
}