.filter-box{margin-top:-42px;position:relative;z-index:3;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:18px;display:grid;grid-template-columns:1.4fr 1fr 1fr auto;gap:12px}.filter-box input,.filter-box select{width:100%;border:1px solid var(--line);border-radius:14px;padding:13px 14px;background:var(--sand);outline:none;color:var(--ink)}.category-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.category-card{position:relative;border-radius:var(--radius-lg);overflow:hidden;min-height:280px;box-shadow:var(--shadow-soft)}.category-card img{width:100%;height:100%;object-fit:cover;transition:.45s}.category-card:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(13,59,76,.86))}.category-card:hover img{transform:scale(1.06)}.category-card div{position:absolute;z-index:2;left:20px;right:20px;bottom:20px;color:#fff}.category-card h3{font-family:var(--heading);font-size:25px;margin:0}.category-card span{color:rgba(255,255,255,.78);font-weight:800}.listing-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:24px;align-items: start; }.sidebar-filter{position:sticky;top:102px;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);padding:20px}.sidebar-filter h3{font-family:var(--heading);color:var(--navy);margin:0 0 14px}.check-list{display:grid;gap:10px}.check-list label{display:flex;align-items:center;gap:10px;color:var(--muted);font-weight:700}.list-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media(max-width:1020px){.category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.listing-layout{grid-template-columns:1fr;align-items: start; }.sidebar-filter{position:relative;top:auto}.list-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.filter-box{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.category-grid,.list-grid,.filter-box{grid-template-columns:1fr}.filter-box{margin-top:20px}.category-card{min-height:235px}}