/* До/после hub — Esthetic Clinic (eclinic) */
.mb-ba{padding:10px 0 40px;color:#2c3a3c;}
.mb-ba__crumbs{font-size:13px;margin:0 0 18px;color:#6a7a7d;}
.mb-ba__crumbs a{color:#177983;text-decoration:none;}
.mb-ba__crumbs a:hover{color:#00cdd2;}
.mb-ba__crumbs-sep{margin:0 6px;opacity:.5;}
.mb-ba__intro{max-width:860px;margin:0 0 22px;font-size:16px;line-height:1.55;color:#3a4a4d;}
.mb-ba__intro p{margin:0 0 10px;}

.mb-ba__filters{
  position:sticky;top:0;z-index:40;
  margin:0 0 18px;padding:10px 12px;
  background:rgba(255,255,255,.97);
  border:1px solid #d9f1f3;border-radius:10px;
  box-shadow:0 1px 8px rgba(23,121,131,.06);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  display:flex;flex-direction:column;gap:10px;
}
.mb-ba__row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;}
.mb-ba__label{
  font-size:11px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;
  color:#5a6e72;margin-right:2px;white-space:nowrap;
}
.mb-ba__pills{display:flex;flex-wrap:wrap;gap:6px;}
.mb-ba__pill{
  appearance:none;border:1px solid #d9f1f3;background:#f4fbfc;color:#177983;
  font:inherit;font-size:13px;font-weight:600;padding:6px 12px;border-radius:999px;
  cursor:pointer;text-decoration:none !important;line-height:1.3;
  display:inline-flex;align-items:center;gap:6px;
}
.mb-ba__pill:hover{border-color:#00cdd2;color:#0e6d75;}
.mb-ba__pill.is-active{background:#00cdd2;border-color:#00cdd2;color:#fff;}
.mb-ba__pill-n{
  font-size:11px;font-weight:700;opacity:.85;
  background:rgba(0,0,0,.06);padding:1px 6px;border-radius:999px;
}
.mb-ba__pill.is-active .mb-ba__pill-n{background:rgba(255,255,255,.25);}

.mb-ba__row--controls{align-items:flex-end;}
.mb-ba__field{flex:1 1 200px;min-width:160px;display:flex;flex-direction:column;gap:4px;}
.mb-ba__field--search{flex:1 1 160px;}
.mb-ba__select,.mb-ba__input{
  width:100%;box-sizing:border-box;border:1px solid #d9f1f3;border-radius:8px;
  background:#fff;color:#2c3a3c;font:inherit;font-size:13px;padding:0 10px;height:36px;outline:none;
}
.mb-ba__select:focus,.mb-ba__input:focus{border-color:#00cdd2;box-shadow:0 0 0 2px rgba(0,205,210,.16);}
.mb-ba__actions{display:flex;align-items:center;gap:8px;padding-bottom:2px;}
.mb-ba__reset{
  appearance:none;border:0;background:transparent;color:#177983;font:inherit;font-size:13px;
  font-weight:600;cursor:pointer;text-decoration:underline;padding:6px 4px;
}
.mb-ba__reset:hover{color:#00cdd2;}
.mb-ba__meta{margin-left:auto;font-size:13px;color:#5a6e72;padding-bottom:4px;white-space:nowrap;}
.mb-ba__meta--solo{margin:0 0 16px;font-size:14px;color:#5a6e72;}
.mb-ba__meta--solo a{color:#177983;}

.mb-ba__grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.mb-ba__card{
  background:#fff;border:1px solid #e7f4f5;border-radius:12px;overflow:hidden;
  box-shadow:0 8px 24px rgba(163,163,163,.18);
  display:flex;flex-direction:column;
  transition:transform .2s ease, box-shadow .2s ease;
}
.mb-ba__card:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(23,121,131,.14);}
.mb-ba__photo{position:relative;display:block;aspect-ratio:4/3;background:#f0f0f0;overflow:hidden;}
.mb-ba__photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s ease;}
.mb-ba__card:hover .mb-ba__photo img{transform:scale(1.04);}
.mb-ba__badge{
  position:absolute;left:10px;top:10px;z-index:1;
  background:rgba(0,205,210,.95);color:#fff;font-size:11px;font-weight:700;
  letter-spacing:.04em;text-transform:uppercase;padding:4px 8px;border-radius:999px;
}
.mb-ba__body{padding:12px 14px 14px;display:flex;flex-direction:column;gap:6px;flex:1;}
.mb-ba__cat{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#46bec9;}
.mb-ba__title{color:#1f2c2e;font-size:15px;font-weight:700;line-height:1.35;text-decoration:none;}
.mb-ba__title:hover{color:#177983;}
.mb-ba__cta{display:flex;gap:12px;margin-top:auto;padding-top:8px;font-size:13px;font-weight:600;}
.mb-ba__cta a{color:#177983;text-decoration:none;border-bottom:1px solid transparent;}
.mb-ba__cta a:hover{border-bottom-color:#00cdd2;color:#0e6d75;}
.mb-ba__empty{grid-column:1/-1;padding:30px;text-align:center;color:#5a6e72;background:#f7fbfc;border-radius:10px;}

.mb-ba__dirs{margin:36px 0 10px;}
.mb-ba__dirs-title{font-size:22px;margin:0 0 14px;color:#1f2c2e;}
.mb-ba__dirs-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.mb-ba__dir{
  display:flex;flex-direction:column;gap:4px;padding:16px 18px;
  border:1px solid #d9f1f3;border-radius:10px;background:#f4fbfc;
  text-decoration:none;color:#177983;transition:border-color .2s, background .2s;
}
.mb-ba__dir:hover{border-color:#00cdd2;background:#e8f9fa;}
.mb-ba__dir strong{font-size:16px;color:#1f2c2e;}
.mb-ba__dir span{font-size:13px;color:#5a6e72;}

.mb-ba__bottom-cta{
  margin:36px 0 0;padding:28px 22px;text-align:center;
  background:linear-gradient(135deg,#e8f9fa 0%,#daf2f4 100%);
  border-radius:12px;
}
.mb-ba__bottom-cta p{margin:0 0 14px;font-size:16px;color:#2c3a3c;}

@media (max-width:991px){
  .mb-ba__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
  .mb-ba__dirs-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:640px){
  .mb-ba__filters{padding:10px;}
  .mb-ba__grid{grid-template-columns:1fr;gap:12px;}
  .mb-ba__dirs-grid{grid-template-columns:1fr;}
  .mb-ba__meta{margin-left:0;width:100%;}
  .mb-ba__row--controls{align-items:stretch;}
  .mb-ba__label{display:none;}
  .mb-ba__row--cats .mb-ba__label{display:inline-block;}
}

.mb-ba__hint{font-size:11px;color:#7a8b8e;width:100%;margin:0;}
.mb-ba__faq{margin:36px 0 10px;padding:22px 20px;border:1px solid #d9f1f3;border-radius:12px;background:#f7fbfc;}
.mb-ba__faq-title{margin:0 0 14px;font-size:22px;color:#1f2c2e;}
.mb-ba__faq-item{border-top:1px solid #d9f1f3;padding:10px 0;}
.mb-ba__faq-item:first-of-type{border-top:0;}
.mb-ba__faq-item summary{cursor:pointer;font-weight:700;color:#177983;list-style:none;}
.mb-ba__faq-item summary::-webkit-details-marker{display:none;}
.mb-ba__faq-item summary:after{content:"+";float:right;color:#00cdd2;font-weight:700;}
.mb-ba__faq-item[open] summary:after{content:"–";}
.mb-ba__faq-a{margin-top:8px;font-size:14px;line-height:1.55;color:#3a4a4d;}

/* Competitor-inspired: quick procedure chips + sticky mobile + gallery CTA */
.mb-ba__row--quick{align-items:flex-start;}
.mb-ba__pills--quick{flex:1;gap:6px;}
.mb-ba__pill--link{text-decoration:none !important;}
.mb-ba__pill--link.is-active{background:#00cdd2;border-color:#00cdd2;color:#fff;}
.mb-ba__dirs-note{margin:-6px 0 14px;font-size:14px;color:#5a6e72;max-width:720px;}
.mb-ba__dirs-grid--proc{grid-template-columns:repeat(4,minmax(0,1fr));}
.mb-ba__cta-gallery{color:#0e6d75 !important;font-weight:700;}
.mb-ba__cta{flex-wrap:wrap;gap:8px 12px;}
.mb-ba__card .mb-ba__meta-line{font-size:12px;color:#7a8b8e;margin:0;}

@media (max-width:991px){
  .mb-ba__dirs-grid--proc{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:640px){
  /* Keep filters sticky on mobile (podruge-style) — sit below typical sticky header */
  .mb-ba__filters{
    position:sticky;top:56px;z-index:40;
    max-height:calc(100vh - 64px);overflow:auto;
    -webkit-overflow-scrolling:touch;
  }
  .mb-ba__row--quick .mb-ba__label{display:inline-block;}
  .mb-ba__dirs-grid--proc{grid-template-columns:1fr 1fr;}
}