/*
 Theme Name: Divi Child
 Theme URI: https://www.elegantthemes.com/gallery/divi/
 Description: Divi Child Theme
 Author: Elegant Themes
 Author URI: https://www.elegantthemes.com
 Template: Divi
 Version: 1.0.0
*/
 
/* =Theme customization starts here
------------------------------------------------------- */
.vybe-post-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:18px;
}

.vybe-card{
  background:#fff;
  border:1px solid #e6e6e6;
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 2px 0 rgba(0,0,0,.02);
}

.vybe-card__img{
  display:block;
  aspect-ratio: 4 / 3;
  background:#f3f3f3;
}
.vybe-card__img img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.vybe-card__img--placeholder{
  width:100%;
  height:100%;
  background:linear-gradient(135deg,#eee,#f6f6f6);
}

.vybe-card__body{
  padding:14px 14px 16px;
}

.vybe-card__address{
  font-size:13px;
  color:#666;
  margin-bottom:6px;
}

.vybe-card__title{
  display:block;
  font-size:18px;
  line-height:1.2;
  font-weight:800;
  color:#0b5b7a; /* similar to screenshot blue */
  text-decoration:none;
  margin-bottom:10px;
}

.vybe-card__meta{
  display:flex;
  gap:14px;
  align-items:center;
  margin-bottom:10px;
}

.vybe-metaitem{
  display:flex;
  gap:8px;
  align-items:center;
  color:#0b84b3;
  font-weight:700;
}
.vybe-ico{
  width:22px;
  height:22px;
  color:#0b84b3;
}

.vybe-card__price{
  margin-top:2px;
  margin-bottom:12px;
  font-weight:900;
  color:#c23a2b; /* screenshot-ish red */
  font-size:20px;
}
.vybe-card__pricesuf{
  font-weight:800;
  font-size:16px;
}

.vybe-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:100%;
  background:#e48b1d; /* orange button */
  color:#fff !important;
  font-weight:900;
  text-decoration:none;
  padding:12px 14px;
  border-radius:8px;
  letter-spacing:.4px;
  text-transform:uppercase;
}
.vybe-btn__chev{
  font-size:20px;
  line-height:1;
  transform:translateY(-1px);
}

@media (max-width: 1100px){
  .vybe-post-grid{grid-template-columns:repeat(3, 1fr);}
}
@media (max-width: 850px){
  .vybe-post-grid{grid-template-columns:repeat(2, 1fr);}
}
@media (max-width: 520px){
  .vybe-post-grid{grid-template-columns:repeat(1, 1fr);}
}