
/* =========================================================
   Urbiax Modern Rebuild v1 — mobile-first visual polish
   Scope: home/rentals index only. No PHP logic touched.
   ========================================================= */

:root{
  --ubx-ink:#0f172a;
  --ubx-muted:#667085;
  --ubx-line:rgba(15,23,42,.09);
  --ubx-blue:#2563eb;
  --ubx-blue2:#0ea5e9;
  --ubx-orange:#f97316;
  --ubx-green:#16a34a;
  --ubx-soft:#f6f9ff;
  --ubx-radius:24px;
}

body.urbiax-modern-home-v1{
  background:
    radial-gradient(circle at 18% 2%, rgba(37,99,235,.14), transparent 32%),
    radial-gradient(circle at 88% 8%, rgba(34,197,94,.10), transparent 30%),
    linear-gradient(180deg,#f5f9ff 0%,#f8fbff 46%,#ffffff 100%) !important;
  color:var(--ubx-ink);
}

/* Top brand card */
.urbiax-modern-home-v1 .navbar{
  width:min(1120px,calc(100% - 28px));
  margin:12px auto 12px !important;
  border-radius:30px !important;
  border:1px solid rgba(255,255,255,.82) !important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.94),rgba(248,252,255,.86)) padding-box,
    linear-gradient(135deg,rgba(37,99,235,.18),rgba(14,165,233,.12),rgba(34,197,94,.12)) border-box !important;
  box-shadow:0 18px 50px rgba(15,23,42,.08), inset 0 1px 0 rgba(255,255,255,.95) !important;
  backdrop-filter:blur(18px);
}
.urbiax-modern-home-v1 .navbar .inner{
  gap:16px !important;
}
.urbiax-modern-home-v1 .brand-link{
  text-decoration:none !important;
}
.urbiax-modern-home-v1 .brand-main{
  font-weight:1000 !important;
  letter-spacing:-.07em !important;
  background:linear-gradient(135deg,#0f172a 0%,#1d4ed8 52%,#0ea5e9 100%) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  color:transparent !important;
  text-shadow:none !important;
}
.urbiax-modern-home-v1 .brand-main .dotcom{
  background:linear-gradient(135deg,#2563eb,#60a5fa) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  color:transparent !important;
}
.urbiax-modern-home-v1 .brand-sub{
  display:inline-flex !important;
  align-items:center;
  width:max-content;
  max-width:100%;
  min-height:28px;
  padding:0 12px !important;
  margin-top:6px !important;
  border-radius:999px;
  background:linear-gradient(135deg,rgba(37,99,235,.10),rgba(14,165,233,.07),rgba(34,197,94,.07));
  border:1px solid rgba(37,99,235,.10);
  color:#31506f !important;
  font-weight:900 !important;
  font-size:14px !important;
  opacity:1 !important;
}

/* Navigation / add buttons */
.urbiax-modern-home-v1 .nav-actions .btn{
  border-radius:999px !important;
  min-height:40px;
  padding:0 15px !important;
  border:1px solid rgba(15,23,42,.08) !important;
  box-shadow:0 10px 22px rgba(15,23,42,.07) !important;
  font-weight:950 !important;
}
.urbiax-modern-home-v1 .nav-actions .rental-btn{
  background:linear-gradient(135deg,var(--ubx-blue),var(--ubx-blue2)) !important;
  color:#fff !important;
}
.urbiax-modern-home-v1 .nav-actions .sale-btn{
  background:linear-gradient(135deg,#f59e0b,var(--ubx-orange)) !important;
  color:#fff !important;
}
.urbiax-modern-home-v1 .nav-actions .swap-btn{
  background:linear-gradient(135deg,var(--ubx-green),#22c55e) !important;
  color:#fff !important;
}

/* Segmented Rentals / Sale / Swap */
.urbiax-modern-home-v1 .mode-tabs-row{
  width:min(1120px,calc(100% - 28px));
  margin:0 auto 14px;
}
.urbiax-modern-home-v1 .primary-mode-tabs{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px !important;
  width:100%;
  padding:10px !important;
  border:1px solid rgba(15,23,42,.08) !important;
  border-radius:28px !important;
  background:rgba(255,255,255,.78) !important;
  box-shadow:0 14px 36px rgba(15,23,42,.07) !important;
  backdrop-filter:blur(14px);
}
.urbiax-modern-home-v1 .mode-tab{
  min-height:58px !important;
  border-radius:20px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px;
  font-size:18px !important;
  font-weight:1000 !important;
  text-decoration:none !important;
  background:#fff !important;
  color:#1f2937 !important;
  border:1px solid rgba(15,23,42,.06) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
}
.urbiax-modern-home-v1 .mode-tab.all{display:none !important;}
.urbiax-modern-home-v1 .mode-tab.rent.active{
  background:linear-gradient(135deg,var(--ubx-blue),var(--ubx-blue2)) !important;
  color:#fff !important;
  box-shadow:0 14px 28px rgba(37,99,235,.22) !important;
}
.urbiax-modern-home-v1 .mode-tab.sale.active{
  background:linear-gradient(135deg,#f59e0b,var(--ubx-orange)) !important;
  color:#fff !important;
  box-shadow:0 14px 28px rgba(249,115,22,.20) !important;
}
.urbiax-modern-home-v1 .mode-tab.swap.active{
  background:linear-gradient(135deg,var(--ubx-green),#22c55e) !important;
  color:#fff !important;
  box-shadow:0 14px 28px rgba(34,197,94,.20) !important;
}
.urbiax-modern-home-v1 .local-board-tabs{
  margin-top:10px !important;
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:10px !important;
  width:100%;
}
.urbiax-modern-home-v1 .local-board-tabs-label{display:none !important;}
.urbiax-modern-home-v1 .urbiax-section-chip{
  min-height:54px !important;
  border-radius:20px !important;
  font-size:19px !important;
  font-weight:1000 !important;
  border:1px solid rgba(15,23,42,.07) !important;
  background:rgba(255,255,255,.86) !important;
  box-shadow:0 12px 26px rgba(15,23,42,.06) !important;
}
.urbiax-modern-home-v1 .urbiax-section-chip[href*="jobs"]{
  color:#166534 !important;
}
.urbiax-modern-home-v1 .urbiax-section-chip[href*="community"]{
  color:#1d4ed8 !important;
}

/* Toolbar / filters */
.urbiax-modern-home-v1 form.toolbar{
  width:min(1120px,calc(100% - 28px)) !important;
  margin:0 auto 14px !important;
  border-radius:24px !important;
  background:rgba(255,255,255,.82) !important;
  border:1px solid rgba(15,23,42,.07) !important;
  box-shadow:0 12px 30px rgba(15,23,42,.06) !important;
  backdrop-filter:blur(14px);
}
.urbiax-modern-home-v1 form.toolbar input,
.urbiax-modern-home-v1 form.toolbar select{
  border-radius:16px !important;
  border:1px solid rgba(15,23,42,.08) !important;
  background:#fff !important;
  min-height:42px !important;
}
.urbiax-modern-home-v1 form.toolbar .btn,
.urbiax-modern-home-v1 form.toolbar button{
  border-radius:16px !important;
}

/* Local Services mobile strip */
.urbiax-modern-home-v1 .local-services-mobile-strip{
  width:min(1120px,calc(100% - 28px));
  margin:0 auto 16px !important;
}
.urbiax-modern-home-v1 .local-services-mobile-shell{
  border-radius:28px !important;
  border:1px solid rgba(15,23,42,.07) !important;
  background:rgba(255,255,255,.83) !important;
  box-shadow:0 16px 38px rgba(15,23,42,.07) !important;
  overflow:hidden;
}
.urbiax-modern-home-v1 .local-services-kicker{
  min-height:34px !important;
  padding:0 16px !important;
  border-radius:999px !important;
  background:linear-gradient(135deg,#ecfeff,#d1fae5) !important;
  border-color:rgba(20,184,166,.20) !important;
  color:#0f766e !important;
  font-weight:1000 !important;
  letter-spacing:.08em !important;
}
.urbiax-modern-home-v1 .local-services-mobile-add{
  border-radius:999px !important;
  min-height:44px !important;
  padding:0 18px !important;
  font-weight:950 !important;
  background:#fff !important;
}
.urbiax-modern-home-v1 .local-services-mobile-card{
  border-radius:20px !important;
  border:1px solid rgba(15,23,42,.07) !important;
  background:#fff !important;
  box-shadow:0 10px 22px rgba(15,23,42,.06) !important;
}

/* Listing grid/cards */
.urbiax-modern-home-v1 .layout{
  width:min(1120px,calc(100% - 28px));
  margin-inline:auto;
}
.urbiax-modern-home-v1 .grid{
  gap:18px !important;
}
.urbiax-modern-home-v1 .card-shell{
  position:relative;
  border-radius:28px !important;
  overflow:hidden;
  background:#fff;
  border:1px solid rgba(15,23,42,.07);
  box-shadow:0 18px 42px rgba(15,23,42,.08);
}
.urbiax-modern-home-v1 .card{
  border:0 !important;
  border-radius:28px 28px 0 0 !important;
  overflow:hidden;
  box-shadow:none !important;
  background:#fff !important;
}
.urbiax-modern-home-v1 .card .thumb{
  border-radius:0 !important;
  overflow:hidden;
  background:#eaf1fb;
}
.urbiax-modern-home-v1 .card .thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.urbiax-modern-home-v1 .photo-count{
  left:14px !important;
  bottom:14px !important;
  border-radius:999px !important;
  min-height:34px !important;
  padding:0 13px !important;
  background:rgba(15,23,42,.72) !important;
  color:#fff !important;
  backdrop-filter:blur(8px);
  font-weight:950 !important;
}
.urbiax-modern-home-v1 .tag-row{
  display:flex !important;
  justify-content:space-between !important;
  gap:8px !important;
  margin-bottom:10px !important;
}
.urbiax-modern-home-v1 .listing-tag,
.urbiax-modern-home-v1 .ptype-pill{
  border-radius:999px !important;
  min-height:32px !important;
  display:inline-flex !important;
  align-items:center !important;
  padding:0 13px !important;
  font-weight:1000 !important;
  font-size:12px !important;
  letter-spacing:.06em !important;
}
.urbiax-modern-home-v1 .listing-tag.tag-rent{
  background:#dff8ee !important;
  color:#0f766e !important;
}
.urbiax-modern-home-v1 .listing-tag.tag-sale{
  background:#fff3db !important;
  color:#b45309 !important;
}
.urbiax-modern-home-v1 .listing-tag.tag-swap{
  background:#dcfce7 !important;
  color:#166534 !important;
}
.urbiax-modern-home-v1 .ptype-pill{
  background:#fff7e6 !important;
  color:#92400e !important;
  border:1px solid rgba(146,64,14,.12) !important;
}
.urbiax-modern-home-v1 .listing-title{
  font-size:22px !important;
  line-height:1.08 !important;
  letter-spacing:-.045em !important;
  font-weight:1000 !important;
  color:#111827 !important;
}
.urbiax-modern-home-v1 .listing-reviews-mini{
  margin-top:8px !important;
}
.urbiax-modern-home-v1 .price{
  margin-top:10px !important;
  font-size:22px !important;
  line-height:1.05 !important;
  color:#9f4a63 !important;
  font-weight:1000 !important;
  letter-spacing:-.045em !important;
}
.urbiax-modern-home-v1 .meta-row{
  margin-top:12px !important;
}
.urbiax-modern-home-v1 .meta-pill{
  border-radius:999px !important;
  background:#f5f8ff !important;
  border:1px solid rgba(15,23,42,.06) !important;
}

/* New card action row */
.urbiax-modern-home-v1 .modern-card-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  padding:0 14px 14px;
}
.urbiax-modern-home-v1 .modern-card-actions a{
  min-height:48px;
  border-radius:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  font-weight:950;
  font-size:15px;
}
.urbiax-modern-home-v1 .modern-chat-btn{
  color:#2563eb;
  background:#fff;
  border:1px solid rgba(37,99,235,.25);
}
.urbiax-modern-home-v1 .modern-details-btn{
  color:#fff;
  background:linear-gradient(135deg,#2563eb,#0ea5e9);
  box-shadow:0 12px 24px rgba(37,99,235,.20);
}

/* Mobile: make first screen feel like the mockup */
@media(max-width:768px){
  body.urbiax-modern-home-v1{
    background:
      radial-gradient(circle at 16% -4%, rgba(37,99,235,.16), transparent 34%),
      radial-gradient(circle at 92% 0%, rgba(34,197,94,.10), transparent 28%),
      linear-gradient(180deg,#f4f9ff,#ffffff 58%) !important;
  }
  .urbiax-modern-home-v1 .navbar{
    width:calc(100% - 18px);
    margin:8px auto 10px !important;
    border-radius:26px !important;
  }
  .urbiax-modern-home-v1 .navbar .inner{
    padding:14px !important;
  }
  .urbiax-modern-home-v1 .brand-main{
    font-size:clamp(38px,11vw,56px) !important;
    line-height:.92 !important;
  }
  .urbiax-modern-home-v1 .brand-sub{
    font-size:13px !important;
  }
  .urbiax-modern-home-v1 .nav-actions{
    gap:8px !important;
  }
  .urbiax-modern-home-v1 .nav-actions .btn{
    min-height:38px !important;
    padding:0 12px !important;
    font-size:14px !important;
  }
  .urbiax-modern-home-v1 .mode-tabs-row,
  .urbiax-modern-home-v1 form.toolbar,
  .urbiax-modern-home-v1 .local-services-mobile-strip,
  .urbiax-modern-home-v1 .layout{
    width:calc(100% - 18px) !important;
  }
  .urbiax-modern-home-v1 .primary-mode-tabs{
    padding:8px !important;
    border-radius:24px !important;
  }
  .urbiax-modern-home-v1 .mode-tab{
    min-height:52px !important;
    font-size:16px !important;
  }
  .urbiax-modern-home-v1 .urbiax-section-chip{
    min-height:48px !important;
    font-size:16px !important;
  }
  .urbiax-modern-home-v1 form.toolbar{
    border-radius:22px !important;
    padding:10px !important;
  }
  .urbiax-modern-home-v1 .local-services-mobile-shell{
    border-radius:24px !important;
  }
  .urbiax-modern-home-v1 .card-shell{
    border-radius:24px !important;
  }
  .urbiax-modern-home-v1 .card{
    border-radius:24px 24px 0 0 !important;
  }
  .urbiax-modern-home-v1 .grid.view-1 .card .thumb,
  .urbiax-modern-home-v1 .card .thumb{
    min-height:230px !important;
  }
  .urbiax-modern-home-v1 .card .body{
    padding:14px 14px 10px !important;
  }
  .urbiax-modern-home-v1 .listing-title{
    font-size:21px !important;
  }
  .urbiax-modern-home-v1 .price{
    font-size:21px !important;
  }
}
@media(max-width:390px){
  .urbiax-modern-home-v1 .brand-main{
    font-size:42px !important;
  }
  .urbiax-modern-home-v1 .mode-tab{
    font-size:14px !important;
  }
  .urbiax-modern-home-v1 .listing-title{
    font-size:19px !important;
  }
}
