/* CBA Circular V50 — refinamiento de la zona inferior de Home.
   Mantiene intacta la cabecera/hero de V49 y acerca feed, tarjetas,
   categorías y rail derecho al mockup azul aprobado por el usuario. */

:root{
  --v50-blue:#0c6edc;
  --v50-cyan:#16acef;
  --v50-navy:#0c2d5c;
  --v50-soft:#eef8ff;
  --v50-line:#dbe8f3;
  --v50-muted:#6d7f96;
  --v50-shadow:0 4px 14px rgba(24,87,148,.055);
  --v50-shadow-hover:0 10px 24px rgba(24,87,148,.11);
}

/* --- Lower-home rhythm: deliberately scoped below the hero --- */
.v48-filter-panel{
  margin-top:12px!important;
  border:1px solid var(--v50-line)!important;
  border-radius:14px!important;
  padding:10px 12px 8px!important;
  box-shadow:var(--v50-shadow)!important;
  background:#fff!important;
}
.v48-shared-banner{
  min-height:34px!important;
  margin-bottom:9px!important;
  border-radius:8px!important;
  padding:7px 12px!important;
  background:linear-gradient(90deg,#effbf4 0%,#f5fffa 100%)!important;
  border-color:#bdebd0!important;
  color:#254d39!important;
  font-size:10px!important;
}
.v48-shared-banner .material-icons-round{color:#18a966!important;font-size:17px!important}
.v48-filter-row{grid-template-columns:minmax(210px,1fr) 178px 158px 90px!important;gap:9px!important}
.v48-search-field,.v48-select-like,.v48-search-btn{height:36px!important;border-radius:8px!important}
.v48-search-field{border-color:#d8e5f0!important;background:#fff!important}
.v48-search-field input{font-size:10px!important}
.v48-select-like{font-size:9px!important;padding:0 11px!important;border-color:#d8e5f0!important;background:#fff!important;color:#18375d!important}
.v48-search-btn{background:linear-gradient(135deg,#10a8ec,#0965d6)!important;font-size:9.5px!important;box-shadow:0 5px 12px rgba(9,101,214,.15)!important}

.v48-category-strip{
  padding:10px 2px 2px!important;
  gap:7px!important;
  justify-content:space-between!important;
  overflow-x:auto!important;
}
.v48-category-strip .cat-card{min-width:52px!important;width:52px!important;gap:4px!important}
.v48-category-strip .cat-card>div,.v48-category-strip .cat-card .cat-icon{
  width:34px!important;height:34px!important;border-radius:50%!important;
  background:#fbfdff!important;border:1px solid #dfeaf3!important;
  box-shadow:0 2px 7px rgba(16,61,108,.035)!important;
}
.v48-category-strip .cat-card>span{font-size:7.5px!important;max-width:56px!important;overflow:hidden!important;text-overflow:ellipsis!important}
.v48-category-strip .cat-card .material-icons-round{font-size:16px!important}
.v48-category-strip .cat-card:hover>div,.v48-category-strip .cat-card.active>div{
  background:linear-gradient(145deg,#19b6f3,#0b6bda)!important;color:#fff!important;border-color:transparent!important;
}

/* Feed closely mirrors the reference: dense, clean and product-like. */
.v48-feed{padding-top:13px!important}
.v48-feed-meta{top:1px!important;font-size:8px!important}
.v48-feed-section+.v48-feed-section{margin-top:14px!important}
.v48-section-title{margin-bottom:7px!important;align-items:center!important}
.v48-section-title>div{gap:8px!important;align-items:center!important}
.v48-section-title h2{
  position:relative!important;padding-left:19px!important;
  font-size:15px!important;line-height:1.1!important;color:var(--v50-navy)!important;letter-spacing:-.28px!important
}
.v48-section-title h2:before{
  content:"location_on"!important;font-family:'Material Icons Round'!important;
  position:absolute!important;left:0!important;top:50%!important;transform:translateY(-50%)!important;
  font-size:16px!important;color:#0d77dc!important
}
#farSection .v48-section-title h2:before{content:"travel_explore"!important}
.v48-section-title p{font-size:8px!important;color:#7b8da2!important}
.v48-section-title button{font-size:8.5px!important;color:#0866d5!important;padding:4px 0!important}
.v48-section-title button:after{content:"  →"}

.v48-card-grid{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:8px!important;
}
.v48-card-grid>.masonry-item{min-width:0!important;width:auto!important;margin:0!important}
.v48-card-grid .cba-card{
  border:1px solid #dde8f2!important;border-radius:8px!important;
  box-shadow:0 2px 7px rgba(27,76,124,.045)!important;
  background:#fff!important;overflow:hidden!important;min-width:0!important;
  transform:translateZ(0)
}
.v48-card-grid .cba-card:hover{transform:translateY(-2px)!important;border-color:#b9daf2!important;box-shadow:var(--v50-shadow-hover)!important}
.v48-card-grid .v50-card-media{position:relative;overflow:hidden;background:#eef4f8}
.v48-card-grid .cba-post-image{height:78px!important;width:100%!important;object-fit:cover!important;display:block!important;transition:transform .28s ease!important}
.v48-card-grid .cba-card:hover .cba-post-image{transform:scale(1.025)!important}
.v48-card-grid [data-fav]{
  width:24px!important;height:24px!important;right:5px!important;top:5px!important;
  background:rgba(255,255,255,.92)!important;color:#183b69!important;
  backdrop-filter:blur(5px)!important;border:1px solid rgba(255,255,255,.85)!important;
  box-shadow:0 2px 8px rgba(0,0,0,.08)!important
}
.v48-card-grid [data-fav].bg-ula-green{background:#0d71dc!important;color:#fff!important}
.v48-card-grid [data-fav] .material-icons-round{font-size:15px!important}
.v48-card-grid .v50-card-body{padding:6px 7px 6px!important;min-width:0!important}
.v48-card-grid .v50-cat-label{
  display:block!important;font-size:6.5px!important;font-weight:800!important;letter-spacing:.15px!important;
  text-transform:uppercase!important;color:#0870dd!important;margin-bottom:3px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important
}
.v48-card-grid .v50-card-title{
  font-family:Inter,sans-serif!important;font-size:9.5px!important;font-weight:750!important;color:#112d55!important;
  line-height:1.18!important;min-height:22px!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important
}
.v48-card-grid .v50-card-meta{display:flex!important;align-items:center!important;gap:3px!important;margin-top:4px!important;color:#71839a!important;font-size:7.5px!important;min-width:0!important}
.v48-card-grid .v50-card-meta .material-icons-round{font-size:9px!important;color:#0b6ed5!important}
.v48-card-grid .v50-card-meta span:last-child{overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
.v48-card-grid .v50-card-submeta{display:flex!important;align-items:center!important;gap:3px!important;color:#95a2b0!important;font-size:7px!important;margin-top:2px!important}
.v48-card-grid .v50-card-submeta .material-icons-round{font-size:9px!important}
.v48-card-grid .cba-status{font-size:6px!important;padding:2px 4px!important;margin-left:3px!important}
.v48-card-grid .cba-card-footer{
  margin-top:5px!important;padding-top:5px!important;border-top:1px solid #eef3f7!important;
  display:flex!important;align-items:center!important;justify-content:space-between!important;gap:5px!important
}
.v48-card-grid .cba-card-contact{
  border:0!important;background:transparent!important;color:#15385f!important;padding:0!important;
  display:flex!important;align-items:center!important;gap:3px!important;font-size:7.5px!important;font-weight:650!important
}
.v48-card-grid .cba-card-contact .material-icons-round{font-size:10px!important}
.v48-card-grid .v50-card-owner{display:flex!important;align-items:center!important;gap:3px!important;min-width:0!important;color:#7e8fa2!important;font-size:7px!important}
.v48-card-grid .v50-card-owner img{width:15px!important;height:15px!important;border-radius:50%!important;object-fit:cover!important}
.v48-card-grid .v50-card-owner span{overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;max-width:60px!important}
.v48-card-grid .cba-own-post{font-size:6.7px!important;color:#0b71d7!important;font-weight:750!important}
.v48-card-grid .cba-post-type-badge{display:none!important}

/* Empty state occupies one compact card-like strip instead of blowing up the layout. */
.v48-empty{padding:18px!important;margin-top:7px!important;border-radius:10px!important;background:#fff!important}
.v48-empty>.material-icons-round{font-size:24px!important}.v48-empty h3{font-size:12px!important}.v48-empty p{font-size:8.5px!important}

/* Right rail below the hero — visually closer to the reference. */
.v48-right-rail{gap:10px!important}
.v48-rail-card{border-radius:11px!important;padding:12px!important;box-shadow:0 2px 8px rgba(26,73,121,.04)!important}
.v48-community-card{min-height:137px!important}
.v48-community-card h3{font-size:10.5px!important}.v48-online{font-size:7.5px!important;margin-top:3px!important}
.v48-stats{margin-top:12px!important}.v48-stats>div{padding:0 6px!important}.v48-stats b{font-size:13px!important}.v48-stats small{font-size:6.4px!important}
.v48-avatar-stack{margin-top:10px!important}.v48-avatar-stack span{width:24px!important;height:24px!important;font-size:6.5px!important}.v48-avatar-stack span:last-child{min-width:52px!important;font-size:6.5px!important}
.v48-community-card>p{font-size:7.5px!important;margin-top:9px!important}

.v48-rail-green{
  min-height:172px!important;border-radius:11px!important;padding:18px 14px 14px!important;
  background:linear-gradient(145deg,#18acef 0%,#0873dd 58%,#0752bb 100%)!important;
  box-shadow:0 8px 22px rgba(9,100,207,.15)!important
}
.v48-rail-green h2{font-size:18px!important;margin-bottom:9px!important}.v48-rail-green p{font-size:8.5px!important;line-height:1.45!important;margin-bottom:13px!important}
.v48-rail-green button{height:34px!important;border-radius:6px!important;font-size:8.5px!important}
.v48-rail-leaf{font-size:36px!important}

.v48-how-card h3{font-size:11px!important}.v48-how-card .muted{font-size:7.5px!important;margin:3px 0 10px!important}
.v48-how-card ol{gap:8px!important}.v48-how-card li{grid-template-columns:24px 1fr!important;gap:7px!important}.v48-how-card li>span{width:23px!important;height:23px!important;font-size:8.5px!important}
.v48-how-card li b{font-size:8.5px!important}.v48-how-card li small{font-size:7px!important}.v48-how-card>button{margin-top:10px!important;height:30px!important;font-size:8px!important}

.v48-news-card{min-height:115px!important;padding-right:55px!important;background:linear-gradient(145deg,#fff,#fbfdff)!important}
.v48-news-card h3{font-size:10.5px!important}.v48-news-card>p{font-size:7.4px!important;line-height:1.35!important;max-width:150px!important;margin:5px 0 8px!important}
.v48-news-form{max-width:100%!important;display:grid!important;grid-template-columns:minmax(0,1fr) 72px!important;gap:5px!important}
.v48-news-form input{height:27px!important;font-size:7px!important;padding:0 7px!important}.v48-news-form button{height:27px!important;font-size:7px!important}
.v48-gift{right:12px!important;bottom:28px!important;font-size:0!important;color:#179fea!important;transform:rotate(-12deg)}
.v48-gift .material-icons-round{font-size:34px!important;filter:drop-shadow(0 5px 8px rgba(14,114,211,.12))}

/* Bottom impact strip: shorter and much closer to the approved mockup. */
.v48-eco-strip{
  min-height:84px!important;margin-top:14px!important;border-radius:13px!important;
  padding:11px 14px!important;gap:8px!important;grid-template-columns:1.35fr repeat(4,.72fr)!important;
  background:linear-gradient(100deg,#f7fcff,#edf8ff 50%,#f8fcff)!important;border-color:#dbeaf5!important
}
.v48-eco-intro h2{font-size:14px!important;line-height:1.1!important}.v48-eco-intro p{font-size:7.3px!important;line-height:1.4!important;margin:4px 0 6px!important;max-width:220px!important}.v48-eco-intro button{font-size:7px!important;padding:5px 8px!important;border-radius:5px!important}
.v48-eco-point>span{width:34px!important;height:34px!important;font-size:18px!important;margin-bottom:4px!important}.v48-eco-point b{font-size:8px!important}.v48-eco-point small{font-size:6.7px!important;line-height:1.25!important;max-width:78px!important}

/* These two blocks existed in the legacy home but are not part of the approved reference. */
.v48-lower-info,.v48-faq{display:none!important}
.v48-footer{display:none!important}

/* Responsive desktop: keep five compact cards as long as there is enough room. */
@media (max-width:1180px) and (min-width:721px){
  .v48-filter-row{grid-template-columns:minmax(170px,1fr) 150px 128px 78px!important}
  .v48-card-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:6px!important}
  .v48-card-grid .cba-post-image{height:70px!important}
  .v48-card-grid .v50-card-title{font-size:8.6px!important}
  .v48-card-grid .v50-card-owner{display:none!important}
}

@media (max-width:980px) and (min-width:721px){
  .v48-card-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
}

/* Preserve V49 mobile concept; only polish the feed cards and spacing. */
@media (max-width:720px){
  .v48-filter-panel{border:0!important;box-shadow:none!important;background:transparent!important;padding:0!important}
  .v48-card-grid{display:flex!important;grid-template-columns:none!important;gap:9px!important;overflow-x:auto!important;scroll-snap-type:x proximity!important;padding-bottom:4px!important;scrollbar-width:none!important}
  .v48-card-grid::-webkit-scrollbar{display:none!important}
  .v48-card-grid>.masonry-item{min-width:174px!important;width:174px!important;scroll-snap-align:start!important}
  .v48-card-grid .cba-post-image{height:115px!important}
  .v48-card-grid .v50-card-body{padding:8px!important}.v48-card-grid .v50-card-title{font-size:11px!important;min-height:27px!important}
  .v48-card-grid .v50-cat-label{font-size:7px!important}.v48-card-grid .v50-card-meta{font-size:8.5px!important}.v48-card-grid .v50-card-submeta{font-size:8px!important}
  .v48-card-grid .v50-card-owner{font-size:8px!important}.v48-card-grid .v50-card-owner img{width:18px!important;height:18px!important}
  .v48-section-title h2{font-size:18px!important;padding-left:22px!important}.v48-section-title h2:before{font-size:19px!important}.v48-section-title p{display:none!important}
  .v48-right-rail{gap:10px!important}.v48-news-card{padding-right:55px!important}
  .v48-eco-strip{margin-top:14px!important;min-height:auto!important}
}