/* ============================================================
   PARZELLARY MARKETPLACE — v11
   ============================================================ */

/* ── Shared RFQ/Offer/Sheet components (used across pages) ── */
.rfq-card{background:#fff;border:1.5px solid #E2EAE2;border-radius:12px;overflow:hidden;transition:border-color .15s,box-shadow .15s}.rfq-card:hover{border-color:#A8CECA;box-shadow:0 2px 8px rgba(6,65,71,.07)}.rfq-card-body{padding:16px}.rfq-card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:8px}.rfq-card-title{font-weight:700;font-size:14px;color:#064147;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.35}.rfq-card-ref{font-size:10px;font-family:monospace;color:#9BABA1;margin-bottom:6px}.rfq-card-loc{font-size:11px;color:#6D757D;margin-bottom:10px;display:flex;align-items:center;gap:4px}.rfq-card-tags{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:10px}.rfq-tag{font-size:10px;font-weight:600;padding:2px 8px;border-radius:20px;white-space:nowrap}.rfq-tag-type{background:rgba(14,103,97,.08);color:#0E6761}.rfq-tag-budget{background:rgba(53,129,67,.08);color:#1F6B2F}.rfq-tag-area{background:rgba(59,130,246,.08);color:#2563EB}.rfq-card-stats{display:flex;gap:0;border:1px solid #E2EAE2;border-radius:8px;overflow:hidden;margin-bottom:10px}.rfq-stat{flex:1;text-align:center;padding:8px 4px;border-right:1px solid #E2EAE2}.rfq-stat:last-child{border-right:none}.rfq-stat-val{font-size:13px;font-weight:700;color:#064147;line-height:1.2}.rfq-stat-lbl{font-size:9px;text-transform:uppercase;color:#9BABA1;letter-spacing:.4px;margin-top:1px}.rfq-card-meta{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#9BABA1;margin-bottom:10px}.rfq-card-actions{display:flex;gap:6px;padding-top:10px;border-top:1px solid #EDF1ED}.offer-card{background:#fff;border:1.5px solid #E2EAE2;border-radius:10px;padding:14px;transition:border-color .15s}.offer-card:hover{border-color:#A8CECA}.offer-card.shortlisted{border-color:#7C3AED;background:rgba(124,58,237,.02)}.offer-card.accepted{border-color:#166534;background:rgba(22,101,52,.02)}.offer-card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:8px}.offer-card-seller{display:flex;align-items:center;gap:8px}.offer-card-avatar{width:32px;height:32px;border-radius:50%;background:#EDF1ED;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#064147;flex-shrink:0}.offer-card-seller-name{font-weight:600;font-size:13px;color:#064147}.offer-card-seller-type{font-size:10px;color:#9BABA1}.offer-card-price{font-size:16px;font-weight:700;color:#0E6761;margin-bottom:4px}.offer-card-detail{font-size:12px;color:#6D757D;margin-bottom:3px}.offer-card-actions{display:flex;gap:6px;margin-top:10px;padding-top:10px;border-top:1px solid #EDF1ED}
.badge-draft{background:rgba(107,114,128,.1);color:#6B7280}.badge-fulfilled,.badge-accepted{background:rgba(22,101,52,.1);color:#166534}.badge-cancelled,.badge-withdrawn,.badge-paused{background:rgba(107,114,128,.1);color:#6B7280}.badge-viewed{background:rgba(59,130,246,.1);color:#2563EB}.badge-shortlisted{background:rgba(124,58,237,.1);color:#7C3AED}.badge-rejected{background:rgba(153,27,27,.1);color:#991B1B}
.rfq-gate-banner{background:linear-gradient(135deg,#064147 0%,#0E6761 100%);border-radius:14px;padding:28px 24px;text-align:center;color:#fff;margin:30px 0}.rfq-gate-banner h3{font-family:'Playfair Display',Georgia,serif;font-size:20px;font-weight:700;margin-bottom:8px}.rfq-gate-banner p{font-size:13px;opacity:.8;max-width:380px;margin:0 auto 16px}
.rfq-behalf-badge{display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:600;color:#7C3AED;background:rgba(124,58,237,.08);padding:2px 8px;border-radius:12px}.verified-badge{display:inline-flex;align-items:center;gap:3px;font-size:10px;font-weight:600;color:#0E6761}.rfq-cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}@media(max-width:767px){.rfq-cards-grid{grid-template-columns:1fr}}.rfq-detail-grid{display:grid;grid-template-columns:1fr 380px;gap:20px}@media(max-width:1024px){.rfq-detail-grid{grid-template-columns:1fr}}.rfq-detail-main{display:flex;flex-direction:column;gap:16px}.rfq-detail-sidebar{display:flex;flex-direction:column;gap:14px}.rfq-info-card{background:#fff;border:1.5px solid #E2EAE2;border-radius:12px;padding:16px}.rfq-info-card-title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:#9BABA1;margin-bottom:10px}.rfq-info-row{display:flex;justify-content:space-between;align-items:baseline;padding:6px 0;border-bottom:1px solid #EDF1ED;font-size:13px}.rfq-info-row:last-child{border-bottom:none}.rfq-info-lbl{color:#9BABA1;font-weight:500}.rfq-info-val{color:#064147;font-weight:600;text-align:right}.rfq-offers-list{display:flex;flex-direction:column;gap:10px}.rfq-offers-empty{text-align:center;padding:30px 16px;color:#9BABA1;font-size:13px}.rfq-offers-empty i{font-size:28px;display:block;margin-bottom:8px;opacity:.3}
.pz-fw-clearbtn{display:inline-flex;align-items:center;gap:5px;padding:6px 14px;font-family:'Outfit',sans-serif;font-size:12px;font-weight:500;color:#B91C1C;background:#FEF2F2;border:1px solid #FECACA;border-radius:20px;text-decoration:none;white-space:nowrap;transition:all .15s}.pz-fw-clearbtn:hover{background:#FEE2E2}
.pz-sheet-overlay{position:fixed;inset:0;z-index:9998;background:rgba(6,65,71,.35);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}.pz-sheet-overlay.open{opacity:1;visibility:visible}.pz-sheet{position:fixed;left:0;right:0;bottom:0;z-index:9999;background:#fff;border-radius:20px 20px 0 0;max-height:70vh;display:flex;flex-direction:column;transform:translateY(100%);transition:transform .28s cubic-bezier(.32,.72,0,1);padding-bottom:env(safe-area-inset-bottom,0)}.pz-sheet.open{transform:translateY(0)}.pz-sheet-handle{width:36px;height:4px;border-radius:2px;background:#D5DDD6;margin:10px auto 0;flex-shrink:0}.pz-sheet-header{display:flex;align-items:center;justify-content:space-between;padding:14px 20px 10px;flex-shrink:0;border-bottom:1px solid #EDF1ED}.pz-sheet-title{font-family:'Outfit',sans-serif;font-size:15px;font-weight:600;color:#064147}.pz-sheet-close{width:30px;height:30px;border-radius:8px;border:none;background:#F4F7F4;color:#6D757D;display:flex;align-items:center;justify-content:center;font-size:14px;cursor:pointer}.pz-sheet-list{overflow-y:auto;-webkit-overflow-scrolling:touch;padding:6px 12px 20px;flex:1}.pz-sheet-item{display:flex;align-items:center;justify-content:space-between;padding:13px 12px;border-radius:10px;font-family:'Outfit',sans-serif;font-size:14px;color:#064147;cursor:pointer;transition:background .1s}.pz-sheet-item:active{background:#F4F7F4}.pz-sheet-item.selected{background:#EEF5F0;color:#0E6761;font-weight:600}.pz-sheet-item .pz-sheet-check{width:20px;height:20px;border-radius:50%;border:2px solid #D5DDD6;display:flex;align-items:center;justify-content:center}.pz-sheet-item.selected .pz-sheet-check{border-color:#0E6761;background:#0E6761}.pz-sheet-item.selected .pz-sheet-check::after{content:'';width:6px;height:6px;border-radius:50%;background:#fff}

/* ============================================================
   HERO
   ============================================================ */
.mk-hero {
  padding-top: calc(64px + 64px);
  padding-bottom: 60px;
  padding-left: 40px;
  padding-right: 40px;
  background: linear-gradient(155deg, #021318 0%, #042e34 40%, #0b5248 100%);
  position: relative;
  overflow: hidden;
  text-align: center;
}
.mk-hero::before {
  content: '';
  position: absolute; bottom: -80px; left: 50%; transform: translateX(-50%);
  width: 900px; height: 400px;
  background: radial-gradient(ellipse, rgba(14,103,97,.25) 0%, transparent 65%);
  pointer-events: none;
}
/* Subtle cadastral dot grid — reinforces GIS/tech vibe */
.mk-hero::after {
  content: '';
  position: absolute; inset: 0;
  background-image: radial-gradient(rgba(255,255,255,.055) 1px, transparent 1px);
  background-size: 28px 28px;
  pointer-events: none;
}
.mk-hero-container {
  position: relative; z-index: 1;
  max-width: 720px;
  margin: 0 auto;
}
.mk-hero h1 {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: clamp(2.2rem, 5vw, 3.8rem);
  font-weight: 900;
  color: #fff;
  line-height: 1.1;
  margin-bottom: 18px;
  letter-spacing: -.5px;
}
.mk-hero h1 em { font-style: italic; color: #5DD6A8; }
.mk-hero-sub {
  font-family: 'Outfit', sans-serif;
  font-size: 15px;
  color: rgba(255,255,255,.58);
  max-width: 560px;
  margin: 0 auto 30px;
  line-height: 1.75;
}
.mk-hero-ctarow {
  display: flex; gap: 12px; justify-content: center; flex-wrap: wrap;
  margin-bottom: 36px;
}
.mk-hero-btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 28px; border-radius: 100px;
  font-family: 'Outfit', sans-serif; font-size: 14px; font-weight: 700;
  text-decoration: none; transition: all .2s; white-space: nowrap;
}
.mk-hero-btn-primary {
  background: #5DD6A8; color: #021318;
  box-shadow: 0 6px 28px rgba(93,214,168,.35);
}
.mk-hero-btn-primary:hover {
  background: #4ac99a; transform: translateY(-2px);
  box-shadow: 0 12px 36px rgba(93,214,168,.4);
}
.mk-hero-btn-ghost {
  background: rgba(255,255,255,.08); color: rgba(255,255,255,.85);
  border: 1.5px solid rgba(255,255,255,.2);
}
.mk-hero-btn-ghost:hover { background: rgba(255,255,255,.15); transform: translateY(-2px); }

/* Trust bar */
.mk-trust-bar {
  display: flex; align-items: center; justify-content: center;
  flex-wrap: wrap; gap: 0;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 100px;
  padding: 11px 24px;
  display: inline-flex;
}
.mk-trust-item {
  display: flex; align-items: center; gap: 7px;
  font-family: 'Outfit', sans-serif;
  font-size: 11.5px; font-weight: 600;
  color: rgba(255,255,255,.65);
  padding: 0 16px;
  white-space: nowrap;
}
.mk-trust-item i { color: #5DD6A8; font-size: 12px; }
.mk-trust-sep { width: 1px; height: 18px; background: rgba(255,255,255,.12); }

/* ============================================================
   MOBILE STICKY BAR
   ============================================================ */
.mk-mobile-bar {
  display: none;
  position: fixed; top: 44px; left: 0; right: 0; z-index: 900;
  background: rgba(247,245,240,.97); backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(6,65,71,.08);
  padding: 10px 16px 8px;
  flex-direction: column; gap: 8px;
  transform: translateY(-100%);
  transition: transform .24s cubic-bezier(.4,0,.2,1);
  box-shadow: 0 6px 24px rgba(6,65,71,.1);
}
.mk-mobile-bar.visible { transform: translateY(0); }
.mk-mobile-bar-top { display: flex; gap: 8px; align-items: center; }
.mk-mobile-search-wrap { flex: 1; }
.mk-mobile-search { position: relative; }
.mk-mobile-search i { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: #B0BDB8; font-size: 13px; pointer-events: none; }
.mk-mobile-search input { width: 100%; height: 40px; padding: 0 12px 0 34px; border: 1.5px solid #E8EEEA; border-radius: 10px; font-family: 'Outfit', sans-serif; font-size: 13px; color: #064147; background: #fff; outline: none; }
.mk-mobile-filter-btn { width: 40px; height: 40px; flex-shrink: 0; background: #fff; border: 1.5px solid #E8EEEA; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 15px; color: #064147; cursor: pointer; position: relative; }
.mk-filter-dot { position: absolute; top: 6px; right: 6px; width: 7px; height: 7px; border-radius: 50%; background: #0E6761; border: 1.5px solid #fff; }
.mk-mobile-tabs { display: flex; gap: 6px; }
.mk-mob-tab { flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 9px 12px; border-radius: 10px; font-family: 'Outfit', sans-serif; font-size: 12px; font-weight: 600; text-decoration: none; color: #9BABA1; background: #F2F5F2; border: 1.5px solid transparent; transition: all .15s; }
.mk-mob-tab.active { background: #064147; color: #fff; }
.mk-mob-badge { font-size: 10px; font-weight: 700; padding: 1px 6px; border-radius: 20px; background: rgba(255,255,255,.2); }
.mk-mob-tab:not(.active) .mk-mob-badge { background: #E8EEEA; color: #064147; }
.mk-filter-overlay { position: fixed; inset: 0; z-index: 998; background: rgba(6,65,71,.4); backdrop-filter: blur(2px); opacity: 0; pointer-events: none; transition: opacity .25s; }
.mk-filter-overlay.visible { opacity: 1; pointer-events: auto; }

/* ============================================================
   LAYOUT WRAPPER — breathing room from screen edges
   ============================================================ */
.mk-layout-wrap {
  background: #F3F6F3;
  padding: 0 24px 0 24px;
}

/* ============================================================
   LAYOUT
   ============================================================ */
.mk-layout {
  display: grid;
  grid-template-columns: 300px 1fr;
  min-height: 70vh;
  background: #F3F6F3;
  max-width: 1360px;
  margin: 0 auto;
}

/* ============================================================
   SIDEBAR
   ============================================================ */
.mk-sidebar {
  background: #F3F6F3;
  border-right: none;
  padding: 20px 0 40px;
  position: sticky;
  top: 64px;
  height: calc(100vh - 64px);
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #D5DDD6 transparent;
}
.mk-sidebar::-webkit-scrollbar { width: 4px; }
.mk-sidebar::-webkit-scrollbar-thumb { background: #D5DDD6; border-radius: 4px; }
.mk-sidebar-close { display: none; }
.mk-sidebar-sheet-handle { display: none; }
.mk-filter-sheet-header { display: none; }

/* Tabs sit flush at top */
.mk-sb-tabs {
  display: flex; gap: 4px; margin-bottom: 0;
  background: transparent; padding: 16px 12px 0;
  border-bottom: none;
}
.mk-sb-tab {
  flex: 1; display: flex; align-items: center; justify-content: center; gap: 5px;
  padding: 9px 6px; border-radius: 9px;
  font-family: 'Outfit', sans-serif; font-size: 12px; font-weight: 600;
  text-decoration: none; color: #9BABA1; background: #EAEEEA;
  border: 1.5px solid transparent;
  transition: all .15s; white-space: nowrap;
}
.mk-sb-tab:hover { color: #064147; background: #E2E8E2; }
.mk-sb-tab.active {
  background: #064147; color: #fff;
  border-color: #064147;
  box-shadow: 0 2px 8px rgba(6,65,71,.2);
}
.mk-sb-count {
  font-size: 10px; font-weight: 700; padding: 1px 5px;
  border-radius: 20px; background: rgba(255,255,255,.18); color: inherit; line-height: 1.5;
}
.mk-sb-tab:not(.active) .mk-sb-count { background: #D8DED8; color: #064147; }
.mk-sb-tab.active .mk-sb-count { background: rgba(255,255,255,.22); color: #fff; }

/* Filter container — white card on grey sidebar */
.mk-filter-container {
  margin: 12px 12px 0;
  background: #fff;
  border: 1px solid #E4EAE4;
  border-radius: 14px;
  padding: 16px 14px 4px;
}

.mk-sb-section { margin-bottom: 16px; }
.mk-sb-label {
  display: block; font-family: 'Outfit', sans-serif;
  font-size: 10px; font-weight: 700; color: #A8B5AE;
  text-transform: uppercase; letter-spacing: .7px; margin-bottom: 7px;
}

.mk-sb-search { position: relative; }
.mk-sb-search i { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: #B0BDB8; font-size: 13px; pointer-events: none; }
.mk-sb-search input {
  width: 100%; height: 38px; padding: 0 12px 0 33px;
  border: 1.5px solid #E8EEEA; border-radius: 9px;
  font-family: 'Outfit', sans-serif; font-size: 13px; color: #064147;
  background: #FAFCFA; outline: none; transition: all .15s;
}
.mk-sb-search input:focus { border-color: #0E6761; background: #fff; box-shadow: 0 0 0 3px rgba(14,103,97,.07); }
.mk-sb-search input::placeholder { color: #C5CFC9; }

.mk-sb-select {
  width: 100%; height: 38px; padding: 0 30px 0 11px;
  border: 1.5px solid #E8EEEA; border-radius: 9px;
  font-family: 'Outfit', sans-serif; font-size: 13px; color: #064147;
  background: #FAFCFA url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24'%3E%3Cpath fill='%23B0BDB8' d='M7 10l5 5 5-5z'/%3E%3C/svg%3E") no-repeat right 10px center;
  -webkit-appearance: none; appearance: none; cursor: pointer; outline: none; transition: all .15s;
}
.mk-sb-select:focus { border-color: #0E6761; box-shadow: 0 0 0 3px rgba(14,103,97,.07); }

.mk-sb-radios { display: flex; gap: 4px; }
.mk-sb-radio {
  flex: 1; display: inline-flex; align-items: center; justify-content: center;
  padding: 7px 4px; border-radius: 8px;
  font-family: 'Outfit', sans-serif; font-size: 12px; font-weight: 600;
  color: #9BABA1; background: #F5F7F4; border: 1.5px solid transparent;
  cursor: pointer; transition: all .15s; white-space: nowrap;
}
.mk-sb-radio input { display: none; }
.mk-sb-radio.active, .mk-sb-radio:has(input:checked) { color: #064147; background: #EEF7F3; border-color: #A8D4CC; }

/* Min/max number input range — #6 */
.mk-sb-range {
  display: grid; grid-template-columns: 1fr auto 1fr; gap: 6px; align-items: center;
}
.mk-range-input {
  width: 100%; height: 38px; padding: 0 10px;
  border: 1.5px solid #E8EEEA; border-radius: 9px;
  font-family: 'Outfit', sans-serif; font-size: 13px; color: #064147;
  background: #FAFCFA; outline: none; transition: all .15s;
  -moz-appearance: textfield;
}
.mk-range-input::-webkit-inner-spin-button,
.mk-range-input::-webkit-outer-spin-button { -webkit-appearance: none; }
.mk-range-input:focus { border-color: #0E6761; box-shadow: 0 0 0 3px rgba(14,103,97,.07); }
.mk-range-input::placeholder { color: #C5CFC9; font-size: 12px; }
.mk-range-sep { font-size: 14px; color: #C5CFC9; text-align: center; }

.mk-sb-divider { height: 1px; background: #EDF1ED; margin: 6px 0 16px; }

.mk-sb-actions { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; padding-bottom: 14px; }
.mk-sb-apply {
  width: 100%; height: 42px;
  background: linear-gradient(135deg, #064147, #0E6761);
  color: #fff; border: none; border-radius: 10px;
  font-family: 'Outfit', sans-serif; font-size: 13px; font-weight: 700;
  cursor: pointer; transition: all .2s;
  display: flex; align-items: center; justify-content: center; gap: 7px;
}
.mk-sb-apply:hover { opacity: .9; transform: translateY(-1px); box-shadow: 0 4px 14px rgba(6,65,71,.25); }
.mk-sb-clear {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  height: 36px; border-radius: 9px;
  font-family: 'Outfit', sans-serif; font-size: 12px; font-weight: 600;
  color: #9BABA1; background: #F5F7F4; border: 1.5px solid #E8EEEA;
  text-decoration: none; transition: all .15s;
}
.mk-sb-clear:hover { color: #B91C1C; background: #FEF2F2; border-color: #FECACA; }

.mk-req-cta-box {
  background: linear-gradient(135deg, #F0FDF4, #E6F7F0);
  border: 1px solid #A7F3D0; border-radius: 12px; padding: 14px;
}
.mk-req-cta-box p {
  font-family: 'Outfit', sans-serif; font-size: 12px; color: #065F46;
  font-weight: 500; margin-bottom: 10px; line-height: 1.5;
}

/* ============================================================
   CONTENT
   ============================================================ */
.mk-content { padding: 24px 28px 60px; min-width: 0; }

.mk-results-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 18px; padding-bottom: 14px;
  border-bottom: 1px solid #E8EEEA; gap: 10px;
}
.mk-count {
  font-family: 'Outfit', sans-serif; font-size: 12px; font-weight: 700;
  color: #9BABA1; text-transform: uppercase; letter-spacing: .5px;
}
.mk-clear-link {
  font-family: 'Outfit', sans-serif; font-size: 12px; font-weight: 600;
  color: #9BABA1; text-decoration: none; display: flex; align-items: center; gap: 4px;
}
.mk-clear-link:hover { color: #B91C1C; }
.mk-post-req-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 16px; border-radius: 8px; background: #064147; color: #fff;
  font-family: 'Outfit', sans-serif; font-size: 12px; font-weight: 700;
  text-decoration: none; transition: all .15s; white-space: nowrap;
}
.mk-post-req-btn:hover { background: #0E6761; }

/* Supplier banner */
.mk-supplier-banner {
  display: flex; align-items: center; gap: 14px;
  background: linear-gradient(135deg, #F0FDF9, #E6F7F0);
  border: 1px solid #A7F3D0; border-radius: 14px;
  padding: 16px 18px; margin-bottom: 20px;
}
.mk-supplier-banner > i { font-size: 22px; color: #0E6761; flex-shrink: 0; }
.mk-supplier-banner > div { flex: 1; font-family: 'Outfit', sans-serif; font-size: 13px; color: #065F46; line-height: 1.5; }
.mk-supplier-banner > div strong { display: block; font-weight: 700; margin-bottom: 2px; }
.mk-supplier-btn {
  padding: 9px 16px; border-radius: 9px; background: #0E6761; color: #fff;
  font-family: 'Outfit', sans-serif; font-size: 12px; font-weight: 700;
  text-decoration: none; white-space: nowrap; flex-shrink: 0; transition: all .15s;
}
.mk-supplier-btn:hover { background: #064147; }

/* ============================================================
   LISTING CARDS
   ============================================================ */
.mk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(272px, 1fr)); gap: 16px; }

.mk-card {
  display: flex; flex-direction: column;
  background: #fff; border-radius: 16px;
  overflow: hidden; text-decoration: none; color: inherit;
  border: 1.5px solid #E8EEEA;
  transition: all .2s cubic-bezier(.4,0,.2,1);
}
.mk-card:hover { border-color: #89C4BC; box-shadow: 0 8px 36px rgba(6,65,71,.11); transform: translateY(-2px); }

.mk-card-img { position: relative; aspect-ratio: 16/10; background: #EDF1ED; overflow: hidden; flex-shrink: 0; }
.mk-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.mk-card:hover .mk-card-img img { transform: scale(1.04); }
.mk-card-img-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; color: #C5CFC9; font-size: 2.5rem; background: linear-gradient(135deg,#EDF1ED,#E2EAE2); }

/* Image overlay badges */
.mk-card-img-badges { position: absolute; inset: 0; pointer-events: none; display: flex; justify-content: space-between; align-items: flex-start; padding: 10px; }
.mk-badges-left, .mk-badges-right { display: flex; flex-direction: column; gap: 5px; }
.mk-badge-kind {
  display: inline-flex; align-items: center; gap: 4px;
  background: rgba(4,31,35,.72); backdrop-filter: blur(8px);
  color: #fff; font-family: 'Outfit', sans-serif; font-size: 10px; font-weight: 700;
  padding: 4px 9px; border-radius: 100px; letter-spacing: .2px;
}
.mk-badge-kind.is-project { background: rgba(76,29,149,.75); }
.mk-badge-mapped {
  display: inline-flex; align-items: center; justify-content: center;
  width: 24px; height: 24px; background: rgba(14,103,97,.85); backdrop-filter: blur(6px);
  color: #fff; border-radius: 50%; font-size: 11px;
}
/* #8 Parzellary verified — shown on ALL listings */
.mk-badge-verified {
  display: inline-flex; align-items: center; justify-content: center;
  width: 24px; height: 24px;
  background: #0E6761;
  color: #fff;
  border-radius: 50%; font-size: 12px;
  box-shadow: 0 1px 4px rgba(6,65,71,.3);
}
.mk-badge-match {
  display: inline-flex; align-items: center; gap: 3px;
  background: rgba(220,38,38,.85); backdrop-filter: blur(6px);
  color: #fff; font-family: 'Outfit', sans-serif;
  font-size: 10px; font-weight: 700; padding: 3px 8px; border-radius: 100px;
}

/* Card body */
.mk-card-body { padding: 14px 16px 16px; display: flex; flex-direction: column; flex: 1; }
.mk-card-clf {
  display: inline-flex; align-items: center;
  font-family: 'Outfit', sans-serif; font-size: 10px; font-weight: 700;
  padding: 3px 9px; border-radius: 20px; letter-spacing: .2px;
  margin-bottom: 8px; text-transform: uppercase;
}
.mk-card-title {
  font-family: 'Outfit', sans-serif; font-weight: 700; font-size: 14px;
  color: #0A2E32; margin-bottom: 5px; line-height: 1.35;
  overflow: hidden; text-overflow: ellipsis;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}
.mk-card-loc {
  font-family: 'Outfit', sans-serif; font-size: 11.5px; color: #7E9E98;
  margin-bottom: 12px; display: flex; align-items: center; gap: 5px;
}
.mk-card-loc i { color: #0E6761; font-size: 10px; }

.mk-card-stats {
  display: grid; grid-template-columns: 1fr 1fr;
  border: 1.5px solid #EDF1ED; border-radius: 10px; overflow: hidden;
  margin-bottom: 12px;
}
.mk-stat { padding: 10px 12px; border-right: 1.5px solid #EDF1ED; }
.mk-stat:last-child { border-right: none; }
.mk-stat-val { font-family: 'Outfit', sans-serif; font-size: 13px; font-weight: 700; color: #064147; line-height: 1.2; }
.mk-stat-lbl { font-family: 'Outfit', sans-serif; font-size: 9px; text-transform: uppercase; color: #B0BDB8; letter-spacing: .5px; margin-top: 2px; }
.mk-stat-price .mk-stat-val { color: #0E6761; font-size: 14px; }
.mk-stat-price .mk-stat-lbl { color: #0E6761; opacity: .7; }

.mk-card-foot {
  display: flex; align-items: center; flex-wrap: wrap; gap: 5px; margin-top: auto;
}
.mk-foot-badge {
  font-family: 'Outfit', sans-serif; font-size: 10px; font-weight: 600;
  padding: 3px 8px; border-radius: 20px; background: #F2F5F2; color: #6B7280;
}
.mk-title-badge { background: #EFF6FF; color: #1D4ED8; }
.mk-foot-match {
  display: inline-flex; align-items: center; gap: 4px;
  font-family: 'Outfit', sans-serif; font-size: 10px; font-weight: 700;
  color: #DC2626; margin-left: auto;
}

/* ============================================================
   RFQ CARDS
   ============================================================ */
.mk-rfq-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(272px, 1fr)); gap: 14px; }

.mk-rfq-card {
  background: #fff; border: 1.5px solid #E8EEEA; border-radius: 16px;
  padding: 18px; text-decoration: none; color: inherit;
  display: flex; flex-direction: column; gap: 0; transition: all .2s;
}
.mk-rfq-card:hover { border-color: #89C4BC; box-shadow: 0 6px 28px rgba(6,65,71,.1); transform: translateY(-2px); }
.mk-rfq-card.mk-rfq-urgent { border-color: #FCA5A5; background: #FFF9F9; }

.mk-rfq-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.mk-rfq-type-badge { display: inline-flex; align-items: center; font-family: 'Outfit', sans-serif; font-size: 10px; font-weight: 700; padding: 3px 10px; border-radius: 100px; letter-spacing: .3px; text-transform: uppercase; }
.mk-rfq-urgency-chip { display: inline-flex; align-items: center; gap: 4px; font-family: 'Outfit', sans-serif; font-size: 10px; font-weight: 700; color: #DC2626; background: #FEE2E2; padding: 3px 9px; border-radius: 100px; }
.mk-rfq-days-chip { display: inline-flex; align-items: center; gap: 4px; font-family: 'Outfit', sans-serif; font-size: 10px; font-weight: 600; color: #92400E; background: #FEF3C7; padding: 3px 9px; border-radius: 100px; }
.mk-rfq-title { font-family: 'Outfit', sans-serif; font-weight: 700; font-size: 14px; color: #0A2E32; margin-bottom: 5px; line-height: 1.35; }
.mk-rfq-loc { font-family: 'Outfit', sans-serif; font-size: 11.5px; color: #7E9E98; margin-bottom: 6px; display: flex; align-items: center; gap: 5px; }
.mk-rfq-loc i { color: #0E6761; font-size: 10px; }
.mk-rfq-purpose { font-family: 'Outfit', sans-serif; font-size: 11px; color: #9BABA1; margin-bottom: 10px; display: flex; align-items: center; gap: 5px; }
.mk-rfq-specs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; margin-top: 6px; }
.mk-rfq-spec { font-family: 'Outfit', sans-serif; font-size: 11px; font-weight: 600; padding: 5px 10px; border-radius: 8px; background: #F2F5F2; color: #064147; display: flex; align-items: center; gap: 5px; }
.mk-rfq-spec i { color: #0E6761; font-size: 11px; }
.mk-rfq-foot { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding-top: 10px; border-top: 1px solid #EDF1ED; }
.mk-rfq-signals { display: flex; gap: 10px; font-family: 'Outfit', sans-serif; font-size: 11px; color: #B0BDB8; }
.mk-rfq-signals .has-offers { color: #059669; font-weight: 600; }
.mk-rfq-match-chip { display: inline-flex; align-items: center; gap: 4px; font-family: 'Outfit', sans-serif; font-size: 10px; font-weight: 700; color: #0E6761; background: #EEF7F3; padding: 3px 9px; border-radius: 100px; }

/* ============================================================
   EMPTY STATE
   ============================================================ */
.mk-empty { text-align: center; padding: 72px 20px; }
.mk-empty-icon { width: 64px; height: 64px; border-radius: 50%; background: #F2F5F2; display: flex; align-items: center; justify-content: center; font-size: 1.8rem; color: #C5CFC9; margin: 0 auto 18px; }
.mk-empty h3 { font-family: 'Outfit', sans-serif; font-size: 17px; font-weight: 700; color: #064147; margin-bottom: 8px; }
.mk-empty p { font-family: 'Outfit', sans-serif; font-size: 13px; color: #9BABA1; max-width: 340px; margin: 0 auto 18px; }
.mk-empty-btn { display: inline-flex; align-items: center; gap: 6px; padding: 10px 20px; border-radius: 10px; background: #064147; color: #fff; font-family: 'Outfit', sans-serif; font-size: 13px; font-weight: 700; text-decoration: none; transition: all .15s; }
.mk-empty-btn:hover { background: #0E6761; }
.mk-empty-hint { font-family: 'Outfit', sans-serif; font-size: 12px; color: #9BABA1; margin-top: 16px; }
.mk-empty-hint a { color: #0E6761; }

/* ============================================================
   PAGINATION
   ============================================================ */
.mk-pagination { display: flex; justify-content: center; gap: 5px; margin-top: 32px; }
.mk-page-btn { display: flex; align-items: center; justify-content: center; min-width: 36px; height: 36px; padding: 0 10px; border-radius: 9px; border: 1.5px solid #E8EEEA; text-decoration: none; font-family: 'Outfit', sans-serif; font-size: 13px; font-weight: 600; color: #064147; background: #fff; transition: all .15s; }
.mk-page-btn:hover { border-color: #A8CECA; }
.mk-page-btn.active { background: #064147; color: #fff; border-color: #064147; }

/* ============================================================
   LEGACY / HIDDEN
   ============================================================ */
.mk-active-filters,.mk-filterbar,.mk-tabs,.mk-adv-panel,.mk-filter-card { display: none; }

/* ============================================================
   RESPONSIVE — TABLET
   ============================================================ */
@media (max-width: 1024px) {
  .mk-layout-wrap { padding: 0 16px; }
  .mk-layout { grid-template-columns: 264px 1fr; }
  .mk-trust-item { padding: 0 12px; font-size: 11px; }
}

/* ============================================================
   RESPONSIVE — MOBILE
   ============================================================ */
@media (max-width: 768px) {
  .mk-layout-wrap { padding: 0; }
  .mk-hero { padding-top: calc(44px + 36px); padding-bottom: 36px; padding-left: 20px; padding-right: 20px; }
  .mk-hero h1 { font-size: 2rem; }
  .mk-hero-sub { font-size: 14px; max-width: none; }
  .mk-trust-bar { flex-wrap: wrap; border-radius: 14px; padding: 10px 14px; gap: 0; }
  .mk-trust-item { padding: 3px 0; width: 50%; justify-content: flex-start; font-size: 11px; }
  .mk-trust-sep { display: none; }

  .mk-mobile-bar { display: flex; }
  .mk-layout { grid-template-columns: 1fr; }

  /* Filter drawer — bottom sheet like Product popup */
  .mk-sidebar {
    position: fixed; left: 0; right: 0; bottom: 0; top: auto;
    width: 100%; max-width: 100%;
    max-height: 82vh; overflow-y: auto; -webkit-overflow-scrolling: touch;
    border-radius: 20px 20px 0 0;
    z-index: 999;
    transform: translateY(100%);
    transition: transform .3s cubic-bezier(.32,.72,0,1);
    border-right: none;
    box-shadow: 0 -8px 40px rgba(6,65,71,.18);
    padding: 0 0 calc(16px + env(safe-area-inset-bottom, 0px));
    background: #fff;
  }
  .mk-sidebar.mob-open { transform: translateY(0); }
  .mk-sidebar .mk-sb-tabs { display: flex; margin: 0 16px 16px; }
  .mk-sidebar form { padding: 0 16px; }

  /* Match Product popup header exactly */
  .mk-filter-sheet-handle { width:36px;height:4px;border-radius:2px;background:#D5DDD6;margin:10px auto 0; }
  .mk-sidebar .mk-sb-tabs { display: none; }
  .mk-sidebar { max-height: 70vh; }
  .mk-filter-sheet-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 12px 16px 10px; border-bottom: 1px solid #F0F4F0;
    margin-bottom: 12px;
  }
  .mk-filter-sheet-title { font-family:'Outfit',sans-serif;font-size:15px;font-weight:700;color:#064147;display:flex;align-items:center;gap:8px; }
  .mk-filter-active-dot { width:8px;height:8px;border-radius:50%;background:#0E6761;display:inline-block; }
  .mk-filter-sheet-close { background:none;border:none;cursor:pointer;width:30px;height:30px;border-radius:8px;background:#F4F7F4;color:#6D757D;display:flex;align-items:center;justify-content:center;font-size:14px; }
  .mk-sidebar-close,.mk-sidebar-sheet-handle { display: none; }
.mk-filter-sheet-header { display: none; }

  /* Cards: keep original grid layout */
  .mk-content { padding: 12px 12px 100px; padding-top: 16px; }
  .mk-grid, .mk-rfq-grid { grid-template-columns: 1fr; gap: 12px; }



  .mk-supplier-banner { flex-direction: column; align-items: flex-start; gap: 10px; }
  .mk-rfq-card { padding: 14px; }
  .mk-results-header { padding-bottom: 10px; }

  /* Sheet handle */
  .mk-sidebar-sheet-handle { display: block; width: 36px; height: 4px; border-radius: 2px; background: #D5DDD6; margin: 10px auto 0; }

  /* Close button: icon only, top-right */
  .mk-sidebar-close {
    display: flex; align-items: center; justify-content: flex-end;
    padding: 8px 0 12px; background: none; border: none;
    border-bottom: 1px solid #F0F4F0; margin-bottom: 12px;
    width: 100%; cursor: pointer; font-size: 16px; color: #9BABA1;
  }
}