/* Atlas Imoti - mockup styles */
:root {
  --green: #6dbd46;
  --green-dark: #5aa838;
  --green-light: #e8f5e0;
  --dark: #1a1d24;
  --dark-2: #2a2f3a;
  --gray: #6b7280;
  --gray-light: #f3f4f6;
  --border: #e5e7eb;
  --white: #ffffff;
  --shadow: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
  --shadow-lg: 0 10px 30px rgba(0,0,0,.08);
  --radius: 12px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  font-size: 15px;
  line-height: 1.6;
  color: var(--dark);
  background: #fafbfc;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; border: none; background: none; }

.container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 24px;
}

/* ===== Top bar ===== */
.topbar {
  background: var(--dark);
  color: rgba(255,255,255,.75);
  font-size: 14px;
  padding: 10px 0;
}
.topbar .container { display: flex; justify-content: flex-start; align-items: center; gap: 16px; flex-wrap: wrap; }
.topbar a { color: rgba(255,255,255,.85); }
.topbar a:hover { color: var(--green); }
.topbar-info { display: flex; gap: 24px; align-items: center; }
.topbar-info span { display: inline-flex; align-items: center; gap: 8px; }
.topbar-info svg { opacity: .7; }

/* ===== Header ===== */
.header {
  background: var(--white);
  position: sticky;
  top: 0;
  z-index: 100;
  box-shadow: var(--shadow);
}
.header .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 14px;
  padding-bottom: 14px;
  gap: 24px;
}
.logo img { height: 48px; }
.nav {
  display: flex;
  gap: 4px;
  align-items: center;
}
.nav a {
  padding: 10px 16px;
  border-radius: 8px;
  font-weight: 500;
  font-size: 15px;
  color: var(--dark);
  transition: all .15s;
}
.nav a:hover { background: var(--green-light); color: var(--green-dark); }
.nav a.active { color: var(--green-dark); }

.header-actions { display: flex; gap: 12px; align-items: center; }
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 20px;
  border-radius: 8px;
  font-weight: 600;
  font-size: 14px;
  transition: all .15s;
  cursor: pointer;
  white-space: nowrap;
}
.btn-primary { background: var(--green); color: white; }
.btn-primary:hover { background: var(--green-dark); transform: translateY(-1px); box-shadow: 0 6px 16px rgba(109,189,70,.35); }
.btn-outline { border: 1.5px solid var(--border); color: var(--dark); background: white; }
.btn-outline:hover { border-color: var(--green); color: var(--green-dark); }
.btn-dark { background: var(--dark); color: white; }
.btn-dark:hover { background: var(--dark-2); }
.btn-block { width: 100%; justify-content: center; }
.btn-lg { padding: 14px 28px; font-size: 15px; }

.mobile-toggle { display: none; padding: 8px; border-radius: 6px; }
.mobile-toggle:hover { background: var(--gray-light); }

/* ===== Hero ===== */
.hero {
  position: relative;
  min-height: 560px;
  background: linear-gradient(rgba(26,29,36,.55), rgba(26,29,36,.85)),
              url('hero-photo.jpg') center/cover;
  color: white;
  display: flex;
  align-items: center;
  padding: 80px 0;
}
.hero-content {
  max-width: 760px;
}
.hero h1 {
  font-size: 48px;
  font-weight: 800;
  line-height: 1.15;
  margin-bottom: 16px;
  letter-spacing: -0.02em;
}
.hero h1 .accent { color: var(--green); }
.hero p {
  font-size: 18px;
  color: rgba(255,255,255,.85);
  margin-bottom: 36px;
  max-width: 580px;
}

/* SHORT search — point 4 */
.search-card {
  background: white;
  border-radius: 16px;
  padding: 8px;
  box-shadow: 0 20px 60px rgba(0,0,0,.25);
  display: grid;
  grid-template-columns: 1fr 1fr 1fr auto;
  gap: 1px;
  background: rgba(255,255,255,.95);
  backdrop-filter: blur(8px);
}
.search-tabs {
  display: flex;
  gap: 4px;
  margin-bottom: 12px;
}
.search-tab {
  padding: 8px 18px;
  border-radius: 8px;
  font-weight: 600;
  font-size: 14px;
  color: white;
  background: rgba(255,255,255,.15);
  border: 1px solid rgba(255,255,255,.2);
  transition: all .15s;
}
.search-tab.active { background: var(--green); border-color: var(--green); }
.search-tab:hover:not(.active) { background: rgba(255,255,255,.25); }

.search-field {
  padding: 18px 22px;
  border-right: 1px solid var(--border);
  text-align: left;
}
.search-field:last-of-type { border-right: none; }
.search-field label {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: var(--gray);
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-bottom: 4px;
}
.search-field select,
.search-field input {
  width: 100%;
  border: none;
  font-size: 16px;
  font-weight: 700;
  color: var(--dark);
  background: transparent;
  outline: none;
  cursor: pointer;
}
.search-submit {
  display: flex;
  align-items: center;
  padding: 5px;
}
.search-submit button {
  padding: 18px 32px;
  border-radius: 12px;
  background: var(--green);
  color: white;
  font-weight: 700;
  font-size: 16px;
  display: flex;
  align-items: center;
  gap: 10px;
  height: 100%;
  box-shadow: 0 6px 20px rgba(109,189,70,.45);
  transition: all .18s;
}
.search-submit button:hover {
  background: var(--green-dark);
  transform: translateY(-1px);
  box-shadow: 0 10px 28px rgba(109,189,70,.55);
}

.hero-stats {
  display: flex;
  gap: 48px;
  margin-top: 40px;
}
.hero-stat-num {
  font-size: 32px;
  font-weight: 800;
  color: var(--green);
}
.hero-stat-label {
  font-size: 13px;
  color: rgba(255,255,255,.75);
  text-transform: uppercase;
  letter-spacing: .05em;
}

/* Значка с Google отзивите до търсачката (07.10.2026): насложени снимки
   на оценилите + общ рейтинг. Стои вдясно в реда с табовете (.search-top),
   а на телефон слиза на свой ред, защото табовете там скролират хоризонтално. */
.search-top { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
.search-top .search-tabs { margin-bottom: 0; flex: 1 1 auto; min-width: 0; }
.hero-proof {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 4px 0;
  color: white;
  text-decoration: none;
  /* Без плочка (искане от 07.10) - само снимките и текстът върху фона на hero-а */
  text-shadow: 0 1px 6px rgba(0,0,0,.45);
  transition: opacity .15s;
}
.hero-proof:hover { opacity: .85; }
.hero-proof-avatars { display: flex; }
.hero-proof-avatars img,
.hero-proof-avatars span {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 2px solid #2a2e37;
  margin-left: -10px;
  object-fit: cover;
  background: var(--green);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 700;
  color: white;
}
.hero-proof-avatars img:first-child,
.hero-proof-avatars span:first-child { margin-left: 0; }
.hero-proof-text { display: flex; flex-direction: column; line-height: 1.2; }
.hero-proof-rating { display: flex; align-items: center; gap: 6px; font-size: 15px; }
.hero-proof-rating strong { font-weight: 800; }
.hero-proof .stars { display: flex; gap: 1px; color: rgba(255,255,255,.35); }
.hero-proof .stars svg { width: 13px; height: 13px; fill: currentColor; }
.hero-proof .stars svg.on { color: #fbbf24; }
.hero-proof-count { font-size: 12px; color: rgba(255,255,255,.82); }
@media (max-width: 720px) {
  .hero-proof { margin-left: 0; flex: 0 0 100%; justify-content: center; }
}

/* ===== Sections ===== */
section { padding: 80px 0; }
.section-head {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 48px;
}
.section-head h2 {
  font-size: 36px;
  font-weight: 800;
  margin-bottom: 12px;
  letter-spacing: -0.02em;
}
.section-head .eyebrow {
  display: inline-block;
  color: var(--green-dark);
  font-weight: 700;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-bottom: 12px;
}
.section-head p { color: var(--gray); font-size: 17px; }

/* ===== Property card ===== */
.props-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.prop-card {
  background: white;
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
  transition: all .22s ease;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
}
.prop-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 40px rgba(0,0,0,.12);
}

.prop-image {
  position: relative;
  aspect-ratio: 4/3;
  overflow: hidden;
  background: var(--gray-light);
}
.prop-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s;
}
.prop-card:hover .prop-image img { transform: scale(1.05); }

/* Снимките в картата - лента със swipe (site.js) */
.prop-track {
  display: flex;
  height: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
}
.prop-track::-webkit-scrollbar { display: none; }
.prop-slide {
  position: relative;
  flex: 0 0 100%;
  min-width: 0;
  height: 100%;
  overflow: hidden;
  scroll-snap-align: center;
  scroll-snap-stop: always;
}
.prop-slide img { display: block; }
.prop-slide-more {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 16px;
  background: rgba(0,0,0,.55);
  color: white;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
  text-align: center;
}
.prop-slide-more span { text-wrap: balance; }
.prop-slide-more svg { width: 22px; height: 22px; }
.prop-dots {
  position: absolute;
  left: 50%;
  bottom: 14px;
  z-index: 1;
  display: flex;
  gap: 4px;
  transform: translateX(-50%);
  pointer-events: none;
}
.prop-dots span {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: rgba(255,255,255,.55);
  box-shadow: 0 0 2px rgba(0,0,0,.45);
  transition: background .15s, transform .15s;
}
.prop-dots span.is-active { background: white; transform: scale(1.25); }
.prop-nav { display: none; }
.prop-nav[hidden] { display: none !important; }
@media (hover: hover) and (pointer: fine) {
  .prop-nav {
    position: absolute;
    top: 50%;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px; height: 32px;
    margin-top: -16px;
    border-radius: 50%;
    background: rgba(255,255,255,.95);
    color: var(--dark);
    box-shadow: 0 2px 8px rgba(0,0,0,.18);
    cursor: pointer;
    opacity: 0;
    transition: opacity .15s, transform .15s;
  }
  .prop-nav svg { width: 18px; height: 18px; }
  .prop-nav.prev { left: 10px; }
  .prop-nav.next { right: 10px; }
  .prop-card:hover .prop-nav, .prop-nav:focus-visible { opacity: 1; }
  .prop-nav:hover { transform: scale(1.08); }
}

.prop-badges {
  position: absolute;
  top: 12px;
  left: 12px;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.badge {
  padding: 5px 11px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.badge-luxury { background: linear-gradient(135deg, #fbbf24, #f59e0b); color: white; }
.badge-exclusive { background: var(--green); color: white; }
.badge-new { background: var(--dark); color: white; }
.badge-investor { background: #3b82f6; color: white; }
.badge-private { background: #8b5cf6; color: white; }
/* Полуактивна обява - вижда се само от логнати служители */
.badge-office { background: #f59e0b; color: white; }

.prop-fav {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 36px; height: 36px;
  background: rgba(255,255,255,.95);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gray);
  transition: all .15s;
}
.prop-fav svg { width: 18px; height: 18px; }
.prop-fav:hover { color: #ef4444; transform: scale(1.1); }
.prop-photos-count svg { width: 14px; height: 14px; }
.search-submit button svg { width: 18px; height: 18px; }

.prop-photos-count {
  position: absolute;
  bottom: 12px;
  right: 12px;
  background: rgba(0,0,0,.6);
  color: white;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 4px;
}

.prop-body { padding: 18px 20px 20px; flex: 1; display: flex; flex-direction: column; }
.prop-meta-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.prop-type {
  font-size: 12px;
  font-weight: 700;
  color: var(--green-dark);
  text-transform: uppercase;
  letter-spacing: .05em;
}
.prop-id { font-size: 12px; color: var(--gray); font-weight: 600; }
.prop-title {
  font-size: 17px;
  font-weight: 700;
  margin-bottom: 8px;
  line-height: 1.35;
}
.prop-location {
  font-size: 14px;
  color: var(--gray);
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.prop-specs {
  display: flex;
  gap: 16px;
  padding: 12px 0;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  margin-bottom: 14px;
}
.prop-spec {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--dark);
  font-weight: 500;
}
.prop-spec svg { color: var(--gray); flex-shrink: 0; }
.prop-location { display: flex; align-items: center; gap: 6px; }
.prop-location svg { color: var(--green-dark); flex-shrink: 0; }

.prop-price-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.prop-price {
  font-size: 24px;
  font-weight: 800;
  color: var(--green-dark);
  letter-spacing: -0.02em;
}
.prop-price-bgn { font-size: 13px; color: var(--gray); font-weight: 500; margin-top: 2px; }
/* ===== Face crop =====
   Снимките на брокерите са цели фигури 683x1024. Рамката реже квадрат
   около лицето, с малко въздух над главата - стойностите са по снимка. */
.face-crop,
.prop-broker {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: 50%;
  background: var(--gray-light);
  flex-shrink: 0;
}
.face-crop img,
.prop-broker img {
  position: absolute;
  max-width: none;
  height: auto;
  width: 140%;
  left: -20%;
  top: -20%;
  border: none;
  box-shadow: none;
}
.face-crop img[src*="atlas-113"], .prop-broker img[src*="atlas-113"] { width: 185%; left: -23%; top: -28%; }
.face-crop img[src*="danche"],    .prop-broker img[src*="danche"]    { width: 142%; left: -2%;  top: -25%; }
.face-crop img[src*="ivan"],      .prop-broker img[src*="ivan"]      { width: 117%; left: 0;    top: -8%; }
.face-crop img[src*="rumi"],      .prop-broker img[src*="rumi"]      { width: 130%; left: -17%; top: -26%; }
.face-crop img[src*="viktor"],    .prop-broker img[src*="viktor"]    { width: 109%; left: -6%;  top: -14%; }
.face-crop img[src*="desi"],      .prop-broker img[src*="desi"]      { width: 133%; left: -12%; top: -30%; }
.face-crop img[src*="vasko"],     .prop-broker img[src*="vasko"]     { width: 130%; left: -19%; top: -26%; }
.face-crop img[src*="niki"],      .prop-broker img[src*="niki"]      { width: 145%; left: -25%; top: -37%; }
.face-crop img[src*="atlas-127wqwq"], .prop-broker img[src*="atlas-127wqwq"] { width: 100%; left: 0;    top: 0; }
.face-crop img[src*="atlas-88"],      .prop-broker img[src*="atlas-88"]      { width: 112%; left: -6%;  top: -23%; }
.face-crop img[src*="2025-12-01"],    .prop-broker img[src*="2025-12-01"]    { width: 227%; left: -65%; top: -47%; }
.face-crop img[src*="2026-02-25"],    .prop-broker img[src*="2026-02-25"]    { width: 100%; left: 0;    top: -6%; }

.prop-broker {
  width: 72px;
  height: 72px;
  border: 2px solid white;
  box-shadow: 0 0 0 1px var(--border);
}
.prop-spec {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  color: var(--dark);
  font-weight: 500;
}

/* ===== Services ===== */
.services-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.service-card {
  background: white;
  padding: 32px 24px;
  border-radius: var(--radius);
  text-align: center;
  border: 1px solid var(--border);
  transition: all .2s;
}
.service-card:hover { border-color: var(--green); transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.service-icon {
  width: 56px;
  height: 56px;
  margin: 0 auto 16px;
  background: var(--green-light);
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--green-dark);
}
.service-icon svg { width: 24px; height: 24px; }
.service-card h3 { font-size: 18px; font-weight: 700; margin-bottom: 10px; }
.service-card p { color: var(--gray); font-size: 15px; line-height: 1.6; margin-bottom: 14px; }
.service-card .learn-more {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 14px;
  font-weight: 600;
  color: var(--green-dark);
  text-decoration: none;
}
.service-card .learn-more:hover { color: var(--dark); }

/* Compact horizontal service cards on mobile */
@media (max-width: 720px) {
  .services-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .service-card {
    display: grid;
    grid-template-columns: 44px 1fr auto;
    grid-template-rows: auto auto;
    align-items: center;
    gap: 4px 14px;
    padding: 14px 16px;
    text-align: left;
  }
  .service-card:hover { transform: none; }
  .service-card .service-icon {
    grid-row: 1 / span 2;
    grid-column: 1;
    width: 44px; height: 44px;
    margin: 0;
    border-radius: 10px;
  }
  .service-card .service-icon svg { width: 20px; height: 20px; }
  .service-card h3 {
    grid-column: 2;
    grid-row: 1;
    font-size: 15px;
    margin: 0;
    font-weight: 700;
  }
  .service-card p {
    grid-column: 2;
    grid-row: 2;
    font-size: 13px;
    margin: 0;
    color: var(--gray);
    line-height: 1.4;
  }
  .service-card .learn-more {
    grid-column: 3;
    grid-row: 1 / span 2;
    align-self: center;
    font-size: 0;
    padding: 8px;
    color: var(--gray);
  }
  .service-card .learn-more svg {
    width: 18px !important;
    height: 18px !important;
  }
}

/* ===== Team ===== */
.team-strip {
  background: var(--dark);
  color: white;
  border-radius: 16px;
  padding: 48px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}
.team-strip h2 { color: white; font-size: 32px; margin-bottom: 16px; }
.team-strip p { color: rgba(255,255,255,.75); margin-bottom: 24px; }

.team-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.team-card {
  background: white;
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid var(--border);
  transition: all .2s;
}
.team-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-4px); }
.team-photo {
  aspect-ratio: 1;
  background: linear-gradient(135deg, var(--green-light), white);
  overflow: hidden;
  position: relative;
}
/* Квадратната рамка режеше главите - изрязването се мести по снимка,
   така че над главата да остава въздух. Виж и .face-crop по-горе. */
.team-photo img {
  position: absolute;
  width: 100%;
  height: auto;
  max-width: none;
  left: 0;
  top: -15%;
}
.team-photo img[src*="atlas-113"] { width: 122%; left: -2%; top: -15%; }
.team-photo img[src*="danche"]    { top: -15%; }
.team-photo img[src*="ivan"]      { top: -6%; }
.team-photo img[src*="rumi"]      { top: -18%; }
.team-photo img[src*="viktor"]    { top: -13%; }
.team-photo img[src*="desi"]      { top: -20%; }
.team-photo img[src*="vasko"]     { top: -18%; }
.team-photo img[src*="niki"]      { top: -22%; }
.team-photo img[src*="atlas-127wqwq"] { top: 0; }
.team-photo img[src*="atlas-88"]      { top: -18%; }
.team-photo img[src*="2025-12-01"]    { width: 155%; left: -28%; top: -28%; }
.team-photo img[src*="2026-02-25"]    { top: -9%; }
.team-offers-badge {
  position: absolute;
  bottom: 12px;
  right: 12px;
  background: var(--green);
  color: white;
  padding: 6px 12px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 4px;
  box-shadow: 0 4px 12px rgba(109,189,70,.4);
}
.team-info { padding: 18px 20px; }
.team-info h4 { font-size: 16px; font-weight: 700; margin-bottom: 4px; }
.team-info .role { color: var(--green-dark); font-size: 13px; font-weight: 600; margin-bottom: 10px; }
.team-info .phone { color: var(--gray); font-size: 14px; }

/* ===== Footer ===== */
.footer {
  background: var(--dark);
  color: rgba(255,255,255,.75);
  padding: 64px 0 32px;
  margin-top: 80px;
  font-size: 15px;
}
.footer .social-row {
  display: flex;
  gap: 8px;
  margin-top: 16px;
}
.footer .social-row a {
  width: 36px; height: 36px;
  background: rgba(255,255,255,.08);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .15s;
}
.footer .social-row a:hover { background: var(--green); color: white; }
.footer .social-row svg { width: 16px; height: 16px; }
.footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 48px;
  margin-bottom: 48px;
}
.footer h5 { color: white; font-size: 14px; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 16px; }
.footer ul { list-style: none; }
.footer ul li { margin-bottom: 10px; }
.footer ul a:hover { color: var(--green); }
.footer-logo img { height: 40px; margin-bottom: 16px; filter: brightness(0) invert(1); }
.footer-bottom {
  border-top: 1px solid rgba(255,255,255,.1);
  padding-top: 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  font-size: 13px;
}
.footer-bottom .credit a {
  color: var(--green);
  font-weight: 600;
  text-decoration: none;
}
.footer-bottom .credit a:hover { color: white; }
@media (max-width: 720px) {
  .footer-bottom { justify-content: center; text-align: center; }
}

/* ===== LISTING PAGE ===== */
.page-head {
  /* Лек тематичен фон вместо тежката тъмна преливка */
  background: #f4faf0 url('hero-bg.svg') no-repeat center bottom;
  background-size: cover;
  color: var(--dark);
  padding: 28px 0 24px;
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid var(--border);
}
.page-head::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 55%;
  background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,.92));
  pointer-events: none;
}
/* Снимков фон по тип страница (public/site/bg/*.webp, 1800x600; мобилна версия *-m.webp 1000x333).
   Снимката е вдясно и прелива в бяло вляво, където стои заглавието. Отгоре има
   допълнително бяло преливане през CSS, за да се чете текстът при всяка ширина. */
.page-head.ph-photo {
  --ph-img: url('hero-bg.svg');
  background: #fff no-repeat center right;
  background-image: linear-gradient(90deg, rgba(255,255,255,.55) 0%, rgba(255,255,255,.25) 30%, rgba(255,255,255,0) 48%), var(--ph-img);
  background-size: cover;
  min-height: 170px;
  display: flex;
  align-items: center;
  padding: 22px 0;
}
.page-head.ph-photo::after { display: none; }
.page-head.ph-photo .container { width: 100%; }
.page-head .lead { color: var(--gray); margin-top: 8px; font-size: 16px; max-width: 560px; }
.page-head.ph-obiavi { --ph-img: url('bg/obiavi.webp'); }
.page-head.ph-uslugi { --ph-img: url('bg/uslugi.webp'); }
.page-head.ph-za-nas { --ph-img: url('bg/za-nas.webp'); }
.page-head.ph-brokeri { --ph-img: url('bg/brokeri.webp'); }
.page-head.ph-blog { --ph-img: url('bg/blog.webp'); }
.page-head.ph-kontakti { --ph-img: url('bg/kontakti.webp'); }
.page-head.ph-dokumenti { --ph-img: url('bg/dokumenti.webp'); }
@media (max-width: 720px) {
  .page-head.ph-photo {
    min-height: 104px;
    padding: 12px 0;
    background-image: linear-gradient(90deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.9) 40%, rgba(255,255,255,.55) 75%, rgba(255,255,255,.2) 100%), var(--ph-img);
  }
  .page-head.ph-obiavi { --ph-img: url('bg/obiavi-m.webp'); }
  .page-head.ph-uslugi { --ph-img: url('bg/uslugi-m.webp'); }
  .page-head.ph-za-nas { --ph-img: url('bg/za-nas-m.webp'); }
  .page-head.ph-brokeri { --ph-img: url('bg/brokeri-m.webp'); }
  .page-head.ph-blog { --ph-img: url('bg/blog-m.webp'); }
  .page-head.ph-kontakti { --ph-img: url('bg/kontakti-m.webp'); }
  .page-head.ph-dokumenti { --ph-img: url('bg/dokumenti-m.webp'); }
}
.page-head .container { position: relative; z-index: 2; }
.breadcrumbs {
  font-size: 13px;
  color: var(--gray);
  margin-bottom: 8px;
}
.breadcrumbs a { color: var(--gray); }
.breadcrumbs a:hover { color: var(--green-dark); }
.page-head h1 { font-size: 32px; font-weight: 800; color: var(--dark); }

.listing-layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 32px;
  padding: 32px 0 64px;
}

/* Filters sidebar */
.filters {
  background: white;
  border-radius: var(--radius);
  padding: 24px;
  border: 1px solid var(--border);
  position: sticky;
  top: 90px;
  height: fit-content;
  max-height: calc(100vh - 110px);
  overflow-y: auto;
}

/* Mobile filter bar + drawer */
.mobile-filter-bar {
  display: none;
  position: sticky;
  top: 68px;
  z-index: 60;
  background: rgba(250, 251, 252, .95);
  backdrop-filter: blur(8px);
  padding: 12px 0;
  gap: 10px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 16px;
}
.mobile-filter-bar .filter-btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 16px;
  background: white;
  border: 1.5px solid var(--border);
  border-radius: 10px;
  font-weight: 700;
  font-size: 14px;
  color: var(--dark);
  cursor: pointer;
  transition: all .15s;
}
.mobile-filter-bar .filter-btn:hover { border-color: var(--green); }
.mobile-filter-bar .filter-btn .count-pill {
  background: var(--green);
  color: white;
  font-size: 12px;
  padding: 2px 8px;
  border-radius: 20px;
  min-width: 22px;
  text-align: center;
}
.mobile-filter-bar .sort-select {
  flex: 1;
  padding: 12px 14px;
  border: 1.5px solid var(--border);
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  background: white;
  cursor: pointer;
}

.filter-drawer-actions {
  display: none;
  position: sticky;
  bottom: 0;
  left: 0; right: 0;
  padding: 14px 16px;
  background: white;
  border-top: 1px solid var(--border);
  gap: 12px;
  z-index: 3;
  margin: 20px -20px -20px;
  box-shadow: 0 -10px 30px rgba(0,0,0,.05);
}
.filter-drawer-actions .btn { flex: 1; }
.filter-drawer-actions .btn-primary { flex: 2; }

.filter-drawer-head {
  display: none;
  position: sticky;
  top: 0;
  padding: 18px 20px;
  background: white;
  border-bottom: 1px solid var(--border);
  align-items: center;
  justify-content: space-between;
  z-index: 3;
  margin: -20px -20px 20px;
}
.filter-drawer-head h3 { margin: 0; font-size: 18px; font-weight: 800; }
.filter-drawer-head .drawer-close { padding: 8px; border-radius: 8px; }
.filter-drawer-head .drawer-close:hover { background: var(--gray-light); }

@media (max-width: 1024px) {
  .mobile-filter-bar { display: flex; }
  .filter-toolbar .sort-select { display: none; }
  .filter-toolbar { padding: 10px 14px; }

  .listing-layout { grid-template-columns: 1fr; }
  .listing-layout > main { grid-column: 1; min-width: 0; }

  .filters {
    display: none;
    position: fixed;
    top: 10vh;
    left: 0; right: 0; bottom: 0;
    width: 100%;
    max-width: none;
    max-height: none;
    height: auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 20px 20px 0 0;
    border: none;
    box-shadow: 0 -20px 60px rgba(0,0,0,.2);
    transform: translateY(100%);
    transition: transform .32s cubic-bezier(.32,.72,0,1);
    z-index: 201;
    padding: 0 20px;
  }
  .filters.is-mounted { display: block; }
  .filters.open { transform: translateY(0); }

  .filters > h3.filters-title-desktop { display: none; }
  .filters > button.btn-primary.btn-block { display: none; }

  .filter-drawer-head {
    display: flex;
    position: sticky;
    top: 0;
    background: white;
    z-index: 5;
    padding: 18px 20px;
    margin: 0 -20px 16px;
    border-bottom: 1px solid var(--border);
    align-items: center;
    justify-content: space-between;
  }

  .filter-drawer-actions {
    display: flex;
    position: sticky;
    bottom: 0;
    background: white;
    z-index: 5;
    padding: 14px 20px;
    margin: 16px -20px 0;
    border-top: 1px solid var(--border);
    gap: 12px;
    box-shadow: 0 -10px 30px rgba(0,0,0,.06);
  }
  .filter-drawer-actions .btn { flex: 1; }
  .filter-drawer-actions .btn-primary { flex: 2; }
}
.filters h3 {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.filters h3 a { font-size: 12px; color: var(--gray); font-weight: 500; }
.filters h3 a:hover { color: var(--green-dark); }
.filter-group { margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid var(--border); }
.filter-group:last-child { border-bottom: none; }
.filter-group label.head {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--dark);
  margin-bottom: 10px;
  cursor: pointer;
}
.filter-group .check-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 14px;
}
.filter-group .check-list label {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  color: var(--dark);
  padding: 3px 0;
}
.filter-group .check-list label:hover { color: var(--green-dark); }
.filter-group .check-list .count { color: var(--gray); font-size: 12px; margin-left: auto; }
.filter-range {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.filter-range input {
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 13px;
  width: 100%;
}
.filter-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  padding: 12px 16px;
  background: white;
  border-radius: var(--radius);
  border: 1px solid var(--border);
}
.filter-toolbar .count-result { font-weight: 600; }
.filter-toolbar .count-result strong { color: var(--green-dark); }
/* Служебна информация в обявата - само за логнати служители (C4) */
.staff-box {
  margin: 18px 0 22px; padding: 14px 18px; border: 1px dashed #c9a227;
  background: #fffaf0; border-radius: 12px; font-size: 14px;
}
.staff-box-head { display: flex; align-items: center; gap: 8px; font-weight: 700; color: #7a5a0e; margin-bottom: 10px; }
.staff-box-head svg { width: 16px; height: 16px; }
.staff-box-head span { font-weight: 500; color: var(--gray); font-size: 12px; }
.staff-box dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0 0 12px; }
.staff-box dt { color: var(--gray); }
.staff-box dd { margin: 0; font-weight: 600; }
/* Клиенти към обявата (D1) */
.staff-clients { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 24px; margin-top: 14px; padding-top: 12px; border-top: 1px dashed #e3cf8a; }
.staff-clients h4 { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: #7a5a0e; margin: 0 0 8px; }
.staff-clients h4 svg { width: 14px; height: 14px; }
.staff-clients h4 span { font-weight: 600; color: var(--gray); font-size: 12px; }
.staff-clients ul { list-style: none; margin: 0; padding: 0; max-height: 220px; overflow: auto; }
.staff-clients li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; padding: 4px 0; border-bottom: 1px solid #f1e6c4; font-size: 13px; }
.staff-clients li a { color: var(--dark); font-weight: 600; text-decoration: none; }
.staff-clients li a:hover { text-decoration: underline; }
.staff-clients li small { color: var(--gray); font-size: 12px; margin-left: auto; }
.staff-clients .staff-phone { font-family: ui-monospace, monospace; font-size: 12.5px; }
.staff-clients .staff-date { font-family: ui-monospace, monospace; font-size: 12px; color: var(--gray); }
.staff-clients-empty { margin: 0; font-size: 13px; color: var(--gray); }
@media (max-width: 720px) { .staff-clients { grid-template-columns: 1fr; } }
/* Служебна информация - телефони на продавача и записи с дата (06.11.2026) */
.staff-box dd { min-width: 0; overflow-wrap: anywhere; }
.staff-box dd a { color: var(--dark); }
.staff-notes-text {
  margin: 0 0 12px; padding: 10px 12px; background: #fff; border: 1px solid #ecdcae; border-radius: 4px;
  line-height: 1.55; overflow-wrap: anywhere; min-width: 0; max-width: 100%; box-sizing: border-box;
}
.staff-notes-text p { margin: 0 0 10px; }
.staff-notes-text p:last-child { margin-bottom: 0; }
.staff-notes-text strong { color: #7a5a0e; }
.staff-notes-empty { color: var(--gray); }

/* Google отзиви (B6) - За нас, начална (компактно), брокер */
.section-tight { padding-top: 0; }
.reviews-box { background: white; border-radius: 16px; padding: clamp(20px, 4vw, 48px); border: 1px solid var(--border); }
.reviews-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 28px; }
.reviews-head h2 { font-size: 24px; font-weight: 800; margin: 0; }
.reviews-head p { color: var(--gray); margin: 4px 0 0; }
.reviews-head .eyebrow { display: block; color: var(--green-dark); font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 4px; }
.reviews-score { display: flex; align-items: center; gap: 12px; }
.reviews-score-num { font-size: 36px; font-weight: 800; color: var(--green-dark); line-height: 1; }
.reviews-box .stars { display: flex; gap: 2px; color: #d9d9d9; }
.reviews-box .stars svg { width: 16px; height: 16px; fill: currentColor; }
.reviews-box .stars svg.on { color: #fbbf24; }
.reviews-count { color: var(--gray); font-size: 13px; margin-top: 2px; }
.reviews-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.review-card { padding: 22px; border: 1px solid var(--border); border-radius: 12px; display: flex; flex-direction: column; }
.review-card .stars { margin-bottom: 10px; }
.review-card .stars svg { width: 14px; height: 14px; }
.review-card p { font-size: 14px; line-height: 1.6; margin: 0 0 16px; flex: 1; }
.review-author { display: flex; align-items: center; gap: 10px; }
.review-author img { width: 36px; height: 36px; border-radius: 50%; }
.review-author strong { display: block; font-size: 14px; }
.review-author span { font-size: 12px; color: var(--gray); }
.reviews-more { text-align: center; margin-top: 28px; }
.reviews-compact { padding: clamp(18px, 3vw, 32px); }
.reviews-compact .reviews-head { margin-bottom: 18px; }
.reviews-compact .review-card { padding: 16px; }
.reviews-compact .reviews-more { margin-top: 18px; }
@media (max-width: 900px) { .reviews-grid { grid-template-columns: 1fr; } }

/* Страница на брокера (B8): галерия, представяне, филтър */
.broker-gallery-section { margin: 0 0 48px; }
.broker-gallery-section h2, .broker-intro h2 { font-size: 24px; font-weight: 800; margin-bottom: 18px; }
.broker-gallery { position: relative; }
.slider-track { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.gallery-item { margin: 0; background: white; border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
.gallery-item a { display: block; background: #f3f4f3; }
.gallery-item img { width: 100%; height: 240px; object-fit: contain; display: block; }
.gallery-item figcaption { padding: 10px 14px; font-size: 13.5px; color: var(--gray); text-align: center; }
.broker-gallery.is-slider .slider-track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 2px; }
.broker-gallery.is-slider .slider-track::-webkit-scrollbar { display: none; }
.broker-gallery.is-slider .gallery-item { flex: 0 0 calc((100% - 40px) / 3); scroll-snap-align: start; }
.slider-btn {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
  width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--border);
  background: white; color: var(--dark); display: inline-flex; align-items: center; justify-content: center;
  box-shadow: var(--shadow); cursor: pointer;
}
.slider-btn.prev { left: -16px; }
.slider-btn.next { right: -16px; }
.slider-btn svg { width: 20px; height: 20px; }
.broker-intro { background: white; border: 1px solid var(--border); border-radius: 16px; padding: clamp(20px, 3vw, 36px); margin: 0 0 48px; }
.broker-intro-text { white-space: pre-line; line-height: 1.75; color: var(--dark); max-width: 860px; }
.broker-filter {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; align-items: end;
  background: white; border: 1px solid var(--border); border-radius: 12px; padding: 16px; margin-bottom: 24px;
}
.broker-filter .quick-apply { height: 44px; }
@media (max-width: 720px) {
  .slider-track { grid-template-columns: 1fr; }
  .broker-gallery.is-slider .gallery-item { flex-basis: 85%; }
  .slider-btn.prev { left: 4px; }
  .slider-btn.next { right: 4px; }
}
/* Видео и 360 разходка (B3) */
.media-badges { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.media-badge {
  display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: 20px;
  background: var(--dark); color: white; font-size: 12.5px; font-weight: 600; text-decoration: none;
}
.media-badge svg { width: 15px; height: 15px; }
.media-badge:hover { background: var(--green-dark); }
.embed-box { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: #111; }
.embed-box.embed-tall { aspect-ratio: 4 / 3; }
.embed-box iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.blog-card .img, .blog-featured .img { position: relative; }
.media-badge-sm { position: absolute; left: 10px; bottom: 10px; padding: 4px 9px; font-size: 11.5px; }
.prop-photos-count svg + svg { margin-left: 6px; }
.filter-toolbar .avg-result { font-size: 13px; color: var(--gray); margin-top: 3px; }
.filter-toolbar .avg-result strong { color: var(--dark); font-weight: 600; }
.sort-select {
  padding: 8px 14px;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
  background: white;
  cursor: pointer;
}

/* ===== Quick filters (horizontal bar above results) ===== */
.quick-filters {
  background: white;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px 16px;
  margin-bottom: 16px;
}
.quick-tabs {
  display: flex;
  gap: 6px;
  margin-bottom: 12px;
}
.quick-tab {
  padding: 7px 14px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--gray);
  background: var(--gray-light);
  border: 1px solid transparent;
  transition: all .15s;
}
.quick-tab.active { background: var(--green); border-color: var(--green); color: white; }
.quick-tab:hover:not(.active) { background: #e7e9ee; color: var(--dark); }

.quick-fields {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr 1fr auto;
  gap: 12px;
  align-items: end;
}
.quick-field label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: var(--gray);
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-bottom: 5px;
}
.quick-field select,
.quick-field input[type=search],
.quick-price input {
  width: 100%;
  min-width: 0;
  padding: 10px 12px;
  border: 1.5px solid var(--border);
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  color: var(--dark);
  background: white;
  outline: none;
}
.quick-field select { cursor: pointer; }
.quick-field select:focus,
.quick-field input[type=search]:focus,
.quick-price input:focus { border-color: var(--green); }
/* Текстово търсене в чекмеджето с филтри + бутон за махане в брояча */
.filters input[type=search] { width: 100%; padding: 10px 12px; border: 1.5px solid var(--border); border-radius: 8px; font: inherit; font-size: 14px; background: white; }
.filters input[type=search]:focus { outline: none; border-color: var(--green); }
.clear-q { display: inline-block; margin-left: 4px; padding: 0 7px; border-radius: 50%; background: #e7e9ee; color: var(--dark); text-decoration: none; font-weight: 700; line-height: 1.5; }
.clear-q:hover { background: var(--green); color: white; }
.quick-price {
  display: flex;
  align-items: center;
  gap: 6px;
}
.quick-price span { color: var(--gray); }
.quick-apply {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 24px;
  background: var(--green);
  color: white;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 700;
  transition: background .15s;
}
.quick-apply:hover { background: var(--green-dark); }
.quick-apply svg { width: 16px; height: 16px; }
/* Лентата за търсене в каталога (27.10.2026, снимка при 1920 px): по-малък шрифт и повече
   място за цената - "до 133333" и "Номер, ключова дума, адрес..." се режеха */
.quick-fields { grid-template-columns: 1.2fr 1fr 1fr 1.3fr auto; gap: 10px; }
.quick-field select,
.quick-field input[type=search],
.quick-price input,
.quick-field .lp-trigger { font-size: 13px; padding: 0 10px; height: 42px; box-sizing: border-box; }
.quick-field input::placeholder { font-weight: 500; }
.quick-price { gap: 4px; }
.quick-price input { padding: 0 8px; -moz-appearance: textfield; appearance: textfield; }
.quick-price input::-webkit-outer-spin-button,
.quick-price input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.quick-apply { padding: 0 18px; height: 42px; font-size: 13.5px; }
/* 1025-1279 px: търсенето е на свой ред, другите полета и бутонът - на втория */
@media (min-width: 1025px) and (max-width: 1279px) {
  .quick-fields { grid-template-columns: 1fr 1fr 1.2fr auto; }
  .quick-fields > .quick-field:first-of-type { grid-column: 1 / -1; }
}

/* Filter groups that only appear inside the mobile drawer */
.filter-group.drawer-only { display: none; }

/* Explanatory note inside a filter group */
.filter-hint {
  font-size: 11.5px;
  line-height: 1.7;
  color: var(--gray);
  margin-top: 8px;
  padding: 8px 10px;
  background: var(--gray-light);
  border-radius: 6px;
}
.filter-hint strong { color: var(--dark); font-weight: 700; }

@media (max-width: 1024px) {
  .quick-filters { display: none; }
  .filter-group.drawer-only { display: block; }
}
@media (max-width: 720px) {
  .quick-fields { grid-template-columns: 1fr; }
  .quick-apply { justify-content: center; }
}

.props-grid.cols-2 { grid-template-columns: repeat(2, 1fr); }

.pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
  margin-top: 32px;
}
/* Бутоните не се свиват (на телефон ставаха 8-14 px), при тесен екран отиват на втори ред */
.pagination > * { flex: 0 0 auto; }
.pagination > span { min-width: 20px; height: 40px; display: flex; align-items: center; justify-content: center; color: #6b7280; }
.pagination a {
  width: 40px; height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: white;
  font-weight: 600;
  font-size: 14px;
  transition: all .15s;
}
.pagination a.active { background: var(--green); border-color: var(--green); color: white; }
.pagination a:hover:not(.active) { border-color: var(--green); color: var(--green-dark); }

/* ===== SINGLE PROPERTY ===== */
.single-layout {
  padding: 32px 0 64px;
}

/* Point 5: gallery — main left, 2 images right */
.gallery {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 12px;
  margin-bottom: 32px;
}
.gallery-main {
  aspect-ratio: 4/3;
  border-radius: 16px;
  overflow: hidden;
  background: #ddd;
  position: relative;
}
.gallery-main img { width: 100%; height: 100%; object-fit: cover; }
.gallery-side {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 0;
}
.gallery-side .gallery-item {
  flex: 1 1 0;
  min-height: 0;
  border-radius: 16px;
  overflow: hidden;
  background: #ddd;
  position: relative;
  cursor: pointer;
}
.gallery-side .gallery-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gallery-item.has-more::after {
  content: '+12 снимки';
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.5);
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
}

.single-grid {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 48px;
}

.prop-head-block {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--border);
}
.prop-head-block h1 {
  font-size: 32px;
  font-weight: 800;
  letter-spacing: -0.02em;
  margin-bottom: 8px;
}
.prop-head-block .loc {
  color: var(--gray);
  display: flex;
  align-items: center;
  gap: 6px;
}
.prop-head-block .price-block { text-align: right; flex-shrink: 0; }
.prop-head-block .price-block .main {
  font-size: 32px;
  font-weight: 800;
  color: var(--green-dark);
  white-space: nowrap;
}
.prop-head-block .price-block .alt { white-space: nowrap; }
.prop-head-block .price-block .alt { color: var(--gray); font-size: 14px; }

/* Point 6: aligned specs grid */
.spec-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 32px;
}
.spec-box {
  background: white;
  padding: 16px 44px 16px 16px;
  border-radius: 10px;
  border: 1px solid var(--border);
  position: relative;
  transition: all .15s;
  min-width: 0;
}
.spec-box:hover { border-color: var(--green); }
.spec-box .label { overflow-wrap: break-word; }
.spec-box .spec-icon {
  position: absolute;
  top: 14px;
  right: 14px;
  color: var(--green);
  opacity: .35;
  transition: opacity .15s;
  display: flex;
}
.spec-box .spec-icon svg {
  width: 22px !important;
  height: 22px !important;
}
.spec-box:hover .spec-icon { opacity: .8; }

@media (max-width: 720px) {
  .spec-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .spec-box {
    padding: 12px 32px 12px 12px;
    overflow: hidden;
    min-width: 0;
  }
  .spec-box .spec-icon {
    top: 10px;
    right: 10px;
  }
  .spec-box .spec-icon svg {
    width: 16px !important;
    height: 16px !important;
  }
  .spec-box .label {
    font-size: 10.5px;
    letter-spacing: .03em;
    line-height: 1.25;
    overflow-wrap: anywhere;
    word-break: break-word;
  }
  .spec-box .value {
    font-size: 14px;
    overflow-wrap: break-word;
  }
}

/* Prevent any grid child from forcing parent wider than viewport */
@media (max-width: 1024px) {
  .single-grid { grid-template-columns: minmax(0, 1fr); }
  /* clip след hidden: hidden остава за стари браузъри, clip не прави контейнер за превъртане
     и менюто на обявата (Параметри, Особености...) пак стои горе (QA 30.10.2026) */
  .single-grid > main,
  .single-grid > aside { min-width: 0; max-width: 100%; overflow: hidden; overflow: clip; }
  .single-grid > main > * { min-width: 0; max-width: 100%; }
  .single-layout, .single-layout > * { max-width: 100%; min-width: 0; }
}

@media (max-width: 720px) {
  .container { width: 100%; box-sizing: border-box; }
  /* clip, не hidden: hidden прави елемента контейнер за превъртане и лепкавите ленти
     вътре (Филтри, менюто на обявата) спират да стоят горе (QA 30.10.2026) */
  .single-layout { overflow-x: clip; }
  main, aside { overflow-x: clip; }
}
.spec-box .label {
  font-size: 11px;
  color: var(--gray);
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-bottom: 4px;
  font-weight: 600;
}
.spec-box .value { font-size: 15px; font-weight: 700; }

/* Point 7: features — show only main 6, "show more" toggles rest */
.features-block {
  background: white;
  padding: 24px;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  margin-bottom: 24px;
}
.features-block h3 { font-size: 18px; margin-bottom: 16px; }
.features-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.feature-pill {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  background: var(--green-light);
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
  color: var(--dark);
}
.feature-pill svg { color: var(--green-dark); flex-shrink: 0; }
.toggle-more {
  margin-top: 16px;
  color: var(--green-dark);
  font-weight: 600;
  font-size: 14px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

/* Description below — point 5 */
.description-block {
  background: white;
  padding: 28px;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  margin-bottom: 24px;
}
.description-block h3 { font-size: 20px; margin-bottom: 16px; }
.description-block p { color: var(--dark); line-height: 1.75; margin-bottom: 14px; }

/* Sticky broker card */
.broker-card {
  background: white;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  overflow: hidden;
  position: sticky;
  top: 90px;
}
.single-grid > aside > * + * { margin-top: 20px; }

/* Section nav (sub-nav under specs) */
.section-nav {
  display: flex;
  gap: 6px;
  padding: 6px;
  background: white;
  border: 1px solid var(--border);
  border-radius: 12px;
  margin-bottom: 24px;
  overflow-x: auto;
  scrollbar-width: none;
  position: sticky;
  /* точно под хедъра (82 px на десктоп) - по-малко го подпъхваше под него (QA 30.10.2026) */
  top: 84px;
  z-index: 40;
  box-shadow: 0 2px 12px rgba(0,0,0,.04);
}
.section-nav::-webkit-scrollbar { display: none; }
.section-nav a {
  flex-shrink: 0;
  padding: 10px 16px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  color: var(--gray);
  transition: all .15s;
  text-decoration: none;
  white-space: nowrap;
}
.section-nav a:hover { background: var(--gray-light); color: var(--dark); }
.section-nav a.active { background: var(--green); color: white; }

/* Gallery action buttons overlay */
.gallery-main { position: relative; }
.gallery-actions {
  position: absolute;
  top: 14px;
  right: 14px;
  display: flex;
  gap: 8px;
  z-index: 2;
}
.gallery-actions button {
  width: 40px; height: 40px;
  border-radius: 50%;
  background: rgba(255,255,255,.95);
  color: var(--dark);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .15s;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(0,0,0,.15);
}
.gallery-actions button:hover { background: white; transform: scale(1.08); }
.gallery-actions button.active { color: #ef4444; }

.gallery-item.has-more::after { content: none; }
.gallery-item.has-more .view-all-photos {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.55);
  color: white;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  transition: background .15s;
}
.gallery-item.has-more:hover .view-all-photos { background: rgba(0,0,0,.7); }
.gallery-item.has-more .view-all-photos svg { width: 22px; height: 22px; flex: 0 0 auto; }
.gallery-item.has-more .view-all-photos { padding: 10px 12px; text-align: center; line-height: 1.3; }
.gallery-item.has-more .view-all-photos span { max-width: 100%; text-wrap: balance; }

/* Снимките в страницата на обявата - лента със swipe (site.js) */
.gallery-track {
  display: flex;
  height: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
}
.gallery-track::-webkit-scrollbar { display: none; }
.gallery-slide {
  flex: 0 0 100%;
  min-width: 0;
  height: 100%;
  scroll-snap-align: center;
  scroll-snap-stop: always;
  cursor: zoom-in;
}
.gallery-slide img { display: block; }
.gallery-count {
  position: absolute;
  right: 14px;
  bottom: 14px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 11px;
  border-radius: 999px;
  background: rgba(15,17,21,.62);
  color: white;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  pointer-events: none;
}
.gallery-count svg { width: 15px; height: 15px; }
.gallery-nav { display: none; }
.gallery-nav[hidden] { display: none !important; }
@media (hover: hover) and (pointer: fine) {
  .gallery-nav {
    position: absolute;
    top: 50%;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px; height: 40px;
    margin-top: -20px;
    border-radius: 50%;
    background: rgba(255,255,255,.95);
    color: var(--dark);
    box-shadow: 0 4px 12px rgba(0,0,0,.15);
    cursor: pointer;
    opacity: 0;
    transition: opacity .15s, background .15s;
  }
  .gallery-nav.prev { left: 14px; }
  .gallery-nav.next { right: 14px; }
  .gallery-main:hover .gallery-nav, .gallery-nav:focus-visible { opacity: 1; }
  .gallery-nav:hover { background: white; }
}

/* Снимки на цял екран: swipe наляво/надясно, плъзгане нагоре/надолу затваря */
.lb {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 1000;
  background: rgb(15,17,21);
  transition: background-color .2s;
}
.lb.is-open { display: block; }
.lb:focus { outline: none; }
.lb-track {
  display: flex;
  height: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  overscroll-behavior: contain;
  touch-action: pan-x pinch-zoom;
  transition: transform .2s ease;
}
.lb-track::-webkit-scrollbar { display: none; }
.lb-slide {
  flex: 0 0 100%;
  min-width: 0;
  height: 100%;
  box-sizing: border-box;
  padding: 64px 84px;
  display: flex;
  align-items: center;
  justify-content: center;
  scroll-snap-align: center;
  scroll-snap-stop: always;
}
.lb-slide img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  border-radius: 6px;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}
.lb-slide img:not([src]) { visibility: hidden; }
.lb-close {
  position: absolute;
  top: calc(10px + env(safe-area-inset-top, 0px));
  right: 10px;
  z-index: 2;
  width: 44px; height: 44px;
  border-radius: 50%;
  background: rgba(255,255,255,.12);
  color: white;
  font-size: 30px;
  line-height: 1;
  cursor: pointer;
}
.lb-nav {
  position: absolute;
  top: 50%;
  z-index: 2;
  width: 46px; height: 46px;
  margin-top: -23px;
  border-radius: 50%;
  background: rgba(255,255,255,.12);
  color: white;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}
.lb-nav.prev { left: 14px; }
.lb-nav.next { right: 14px; }
.lb-nav[hidden] { display: none; }
.lb-close:hover, .lb-nav:hover { background: rgba(255,255,255,.22); }
.lb-count {
  position: absolute;
  bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  left: 50%;
  transform: translateX(-50%);
  padding: 4px 12px;
  border-radius: 999px;
  background: rgba(0,0,0,.35);
  color: rgba(255,255,255,.9);
  font-size: 14px;
  pointer-events: none;
}
@media (max-width: 720px) {
  .lb-slide { padding: 60px 0; }
  .lb-slide img { border-radius: 0; }
}
@media (hover: none) {
  .lb-nav { display: none; }
}

/* Offer number badge in header */
.offer-number-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 11px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  background: var(--gray-light);
  color: var(--dark);
}

/* Price per m² more visible */
.price-block .price-per-sqm {
  display: inline-block;
  margin-top: 6px;
  padding: 4px 10px;
  background: var(--green-light);
  color: var(--green-dark);
  border-radius: 6px;
  font-size: 13px;
  font-weight: 700;
}

/* Toggle more button */
.toggle-more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 16px;
  padding: 10px 18px;
  border: 1.5px solid var(--border);
  border-radius: 8px;
  background: white;
  color: var(--dark);
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  transition: all .15s;
  text-decoration: none;
}
.toggle-more:hover { border-color: var(--green); color: var(--green-dark); }
.toggle-more svg { width: 16px; height: 16px; }

/* Ghost button */
.btn-ghost {
  background: transparent;
  color: var(--gray);
  border: none;
  font-weight: 600;
  padding: 8px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.btn-ghost:hover { color: var(--green-dark); }

/* Compact map */
.map-compact {
  aspect-ratio: 16/8;
  background: linear-gradient(135deg, #e8f5e0, #f3f4f6);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gray);
  font-size: 14px;
  position: relative;
}
.map-compact::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(0,0,0,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,.03) 1px, transparent 1px);
  background-size: 30px 30px;
}
.location-info {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-top: 16px;
}
.location-info-item {
  padding: 12px;
  background: var(--gray-light);
  border-radius: 8px;
  text-align: center;
}
.location-info-item .icon { color: var(--green-dark); margin-bottom: 4px; }
.location-info-item .label { font-size: 11px; color: var(--gray); text-transform: uppercase; letter-spacing: .05em; }
.location-info-item .val { font-size: 13px; font-weight: 700; margin-top: 2px; }

@media (max-width: 720px) {
  .location-info { grid-template-columns: repeat(2, 1fr); }
}

/* Mobile bottom action bar */
.mobile-action-bar {
  display: none;
  position: fixed;
  bottom: 0; left: 0; right: 0;
  background: white;
  border-top: 1px solid var(--border);
  padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0));
  gap: 8px;
  z-index: 100;
  box-shadow: 0 -6px 20px rgba(0,0,0,.08);
  align-items: center;
}
.mobile-action-bar .btn {
  min-height: 48px;
  border-radius: 10px;
}
.mobile-action-bar .btn-icon-only {
  flex: 0 0 44px;
  width: 44px;
  padding: 0;
  justify-content: center;
  gap: 0;
}
.mobile-action-bar .btn-icon-only svg {
  width: 20px !important;
  height: 20px !important;
}
.mobile-action-bar .btn-cta {
  flex: 1 1 auto;
  min-width: 0;
  padding: 12px 10px;
  font-size: 14px;
  font-weight: 700;
  justify-content: center;
  text-align: center;
}

@media (max-width: 1024px) {
  .broker-card { position: static; }
  .single-grid { grid-template-columns: 1fr; }
  .section-nav { top: 80px; }
}
@media (max-width: 720px) {
  .mobile-action-bar { display: flex; }
  body.single-page { padding-bottom: calc(76px + env(safe-area-inset-bottom, 0)); }
  .section-nav { top: 70px; }
}
.broker-card-head {
  background: white;
  color: var(--dark);
  padding: 24px;
  text-align: center;
  border-bottom: 1px solid var(--border);
}
/* Картата е sticky - трябва да се побира в екрана заедно с формата,
   иначе бутонът "Изпрати запитване" се вижда чак в края на страницата */
.broker-card-head .face-crop {
  width: 120px; height: 120px;
  border: 3px solid var(--green);
  margin: 0 auto 10px;
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
}
.broker-card-head { padding: 20px 20px 16px; }
.broker-card-head h4 { font-size: 17px; margin-bottom: 2px; }
.broker-card-head .role { color: var(--green); font-size: 13px; font-weight: 600; }
.broker-card-body { padding: 18px 20px 20px; }
.broker-card .investor-banner { margin-bottom: 12px; padding: 9px 12px; font-size: 13px; }
.broker-card .btn-block { padding-top: 10px; padding-bottom: 10px; }
.broker-stat {
  display: flex;
  justify-content: space-between;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
  font-size: 14px;
}
.broker-stat:last-of-type { border-bottom: none; margin-bottom: 16px; }
.broker-stat .label { color: var(--gray); }
.broker-stat .val { font-weight: 700; color: var(--green-dark); }

.investor-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  background: #eff6ff;
  border-left: 3px solid #3b82f6;
  border-radius: 8px;
  margin-bottom: 24px;
  font-size: 14px;
  font-weight: 600;
  color: #1e40af;
}
.investor-banner.private {
  background: #f5f3ff;
  border-left-color: #8b5cf6;
  color: #5b21b6;
}

/* ===== Trust bar (home) ===== */
.trust-bar {
  background: white;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 20px 0;
}
.trust-items {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 24px;
}
.trust-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.trust-item svg {
  width: 22px;
  height: 22px;
  color: var(--green);
  flex-shrink: 0;
  margin-top: 2px;
}
.trust-item strong {
  display: block;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
}
.trust-item span {
  display: block;
  font-size: 12.5px;
  color: var(--gray);
  line-height: 1.45;
  margin-top: 2px;
}
@media (max-width: 1024px) {
  .trust-items { grid-template-columns: repeat(3, 1fr); gap: 18px; }
}
@media (max-width: 720px) {
  .trust-items { grid-template-columns: 1fr 1fr; gap: 16px; }
  .trust-item:last-child { grid-column: 1 / -1; }
}

/* ===== Trust mini (вътре в брокер-картата) ===== */
.trust-mini {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 10px 14px;
  background: var(--green-light);
  border-radius: 10px;
}
.trust-mini span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--dark);
}
.trust-mini svg {
  width: 16px;
  height: 16px;
  color: var(--green-dark);
  flex-shrink: 0;
}

/* ===== Form (Add listing) ===== */
.form-card {
  background: white;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  padding: 40px;
  max-width: 820px;
  margin: 0 auto;
}
.form-step-nav {
  display: flex;
  gap: 8px;
  margin-bottom: 32px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--border);
}
.step-pill {
  flex: 1;
  text-align: center;
  padding: 10px 16px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--gray);
  background: var(--gray-light);
  position: relative;
}
.step-pill.active { background: var(--green); color: white; }
.step-pill.done { background: var(--green-light); color: var(--green-dark); }
.step-pill .num {
  display: inline-flex;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: rgba(255,255,255,.3);
  align-items: center;
  justify-content: center;
  margin-right: 6px;
  font-size: 11px;
}

.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.form-field { display: flex; flex-direction: column; }
.form-field.full { grid-column: 1/-1; }
.form-field label {
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 6px;
  color: var(--dark);
}
.form-field label .req { color: #ef4444; }
.form-field input,
.form-field select,
.form-field textarea {
  padding: 12px 14px;
  border: 1.5px solid var(--border);
  border-radius: 8px;
  font-size: 14px;
  font-family: inherit;
  transition: border .15s;
  outline: none;
  background: white;
}
.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus { border-color: var(--green); }
.form-field .hint { font-size: 12px; color: var(--gray); margin-top: 4px; }
.form-field .valid-icon {
  position: absolute;
  right: 12px;
  top: 38px;
  color: var(--green-dark);
}
.form-field.has-validation { position: relative; }

.input-prefix { position: relative; }
.input-prefix::before {
  content: attr(data-prefix);
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--gray);
  font-size: 14px;
  pointer-events: none;
  font-weight: 500;
}
.input-prefix input { padding-left: 50px; }

.checkbox-row {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 16px;
  background: var(--green-light);
  border-radius: 10px;
  border: 1.5px solid transparent;
  margin-top: 8px;
}
.checkbox-row.required {
  border-color: var(--green);
  background: white;
}
.checkbox-row input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--green); }
.checkbox-row label { font-size: 14px; cursor: pointer; }
.checkbox-row label strong { display: block; margin-bottom: 2px; }
.checkbox-row label .desc { color: var(--gray); font-size: 13px; }

.required-note {
  font-size: 13px;
  color: var(--gray);
  margin-bottom: 24px;
  padding: 12px 16px;
  background: #fffbeb;
  border-left: 3px solid #f59e0b;
  border-radius: 6px;
}

.form-actions {
  display: flex;
  justify-content: space-between;
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid var(--border);
}

/* Type selector cards */
.type-cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
.type-card {
  border: 1.5px solid var(--border);
  border-radius: 10px;
  padding: 16px 20px;
  cursor: pointer;
  text-align: center;
  font-weight: 600;
  transition: all .15s;
  background: white;
}
.type-card:hover { border-color: var(--green); }
.type-card.selected {
  border-color: var(--green);
  background: var(--green-light);
  color: var(--green-dark);
}
.type-card .icon { font-size: 28px; margin-bottom: 8px; display: block; color: var(--green-dark); }

/* ===== BROKER PROFILE ===== */
.broker-hero {
  background: linear-gradient(135deg, var(--dark) 0%, var(--dark-2) 100%);
  color: white;
  padding: 80px 0 60px;
}
.broker-hero .container { display: grid; grid-template-columns: 200px 1fr auto; gap: 40px; align-items: center; }
.broker-hero .face-crop {
  width: 200px;
  height: 200px;
  border: 5px solid var(--green);
}
.broker-hero h1 { font-size: 40px; font-weight: 800; margin-bottom: 6px; }
.broker-hero .role { color: var(--green); font-size: 16px; font-weight: 600; margin-bottom: 16px; }
.broker-hero .bio { color: rgba(255,255,255,.8); max-width: 540px; margin-bottom: 20px; }
.broker-hero-contacts { display: flex; gap: 12px; }

.broker-stats-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin: -36px 0 48px;
  position: relative;
  z-index: 5;
}
.stat-card {
  background: white;
  padding: 24px;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  text-align: center;
}
.stat-num { font-size: 32px; font-weight: 800; color: var(--green-dark); margin-bottom: 4px; }
.stat-label { font-size: 13px; color: var(--gray); text-transform: uppercase; letter-spacing: .05em; }

/* ===== MOBILE ===== */
@media (max-width: 1024px) {
  .hero h1 { font-size: 36px; }
  .props-grid { grid-template-columns: repeat(2, 1fr); }
  .props-grid.cols-2 { grid-template-columns: 1fr; }
  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .team-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .single-grid { grid-template-columns: 1fr; }
  .listing-layout { grid-template-columns: 1fr; }
  .team-strip { grid-template-columns: 1fr; padding: 32px; }
  .broker-hero .container { grid-template-columns: 1fr; text-align: center; }
  .broker-hero .face-crop { margin: 0 auto; }
  .broker-hero-contacts { justify-content: center; }
}

@media (max-width: 720px) {
  /* Само html е hidden (минава към прозореца); body с hidden ставаше отделен контейнер
     за превъртане и хедърът на телефон не оставаше горе (QA 30.10.2026) */
  html { overflow-x: hidden; }
  body { overflow-x: clip; }
  .container { padding: 0 16px; max-width: 100vw; }
  .nav { display: none; }
  .mobile-toggle { display: flex; }
  .header-actions .btn { display: none; }
  .header-actions { gap: 8px; }
  .header .container { gap: 12px; }
  .logo img { height: 40px; }
  .topbar { display: none; }

  section { padding: 48px 0; }
  .hero { min-height: auto; padding: 56px 0; }
  .hero h1 { font-size: 30px; }
  .hero p { font-size: 16px; margin-bottom: 24px; }
  .hero-stats { gap: 24px; margin-top: 28px; }
  .hero-stat-num { font-size: 24px; }

  .search-card {
    grid-template-columns: 1fr;
    padding: 12px;
    border-radius: 14px;
  }
  .search-field { border-right: none; border-bottom: 1px solid var(--border); padding: 12px 14px; }
  .search-field:last-of-type { border-bottom: none; }
  .search-submit { padding: 0; margin-top: 4px; }
  .search-submit button { width: 100%; justify-content: center; padding: 14px; }

  .section-head h2 { font-size: 26px; }
  .section-head p { font-size: 15px; }
  .props-grid { grid-template-columns: 1fr; gap: 16px; }
  .services-grid { grid-template-columns: 1fr; }
  .team-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
  .footer-grid { grid-template-columns: 1fr; gap: 32px; }

  .gallery { grid-template-columns: 1fr; }
  .gallery-side {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    flex-direction: initial;
  }
  .gallery-side .gallery-item {
    flex: initial;
    aspect-ratio: 4/3;
    min-height: 0;
  }
  .gallery-main { aspect-ratio: 4/3; }
  .gallery-item.has-more .view-all-photos { font-size: 13px; gap: 4px; padding: 8px 10px; }
  .gallery-count { right: 12px; bottom: 12px; }

  .prop-head-block { flex-direction: column; gap: 16px; }
  .prop-head-block .price-block { text-align: left; }
  .prop-head-block h1 { font-size: 24px; }
  .prop-head-block .price-block .main { font-size: 26px; }
  .spec-grid { grid-template-columns: repeat(2, 1fr); }
  .features-grid { grid-template-columns: 1fr; }

  .form-card { padding: 24px 20px; }
  .form-grid { grid-template-columns: 1fr; }
  .form-step-nav { flex-wrap: wrap; gap: 6px; }
  .step-pill { flex: 1 1 calc(50% - 3px); font-size: 12px; padding: 8px; }
  .form-actions { flex-direction: column-reverse; gap: 10px; }
  .form-actions .btn { width: 100%; }

  .broker-stats-row { grid-template-columns: 1fr 1fr; }
  .broker-hero h1 { font-size: 28px; }

  .filter-toolbar { flex-direction: column; align-items: stretch; gap: 10px; }
}

/* ===== Utilities ===== */
.text-center { text-align: center; }
.mt-4 { margin-top: 32px; }

/* Inline SVG icons default to 1em (matches surrounding text) */
svg[viewBox="0 0 24 24"]:not([width]) { width: 1em; height: 1em; display: inline-block; vertical-align: middle; }
.drawer-social svg { width: 18px !important; height: 18px !important; }
.footer .social-row svg { width: 18px !important; height: 18px !important; }
.btn svg[viewBox] { width: 16px; height: 16px; }

/* Responsive grids */
.grid { display: grid; gap: 24px; }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }
.grid-hero { grid-template-columns: 1.5fr 1fr; gap: 32px; }
.grid-about { grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.grid-contact-main { grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; }

@media (max-width: 1024px) {
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-about, .grid-contact-main, .grid-hero { grid-template-columns: 1fr; gap: 32px; }
}

@media (max-width: 720px) {
  .grid { gap: 16px; }
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .grid-4 { grid-template-columns: repeat(2, 1fr); gap: 16px; }
}

/* Category pill scroll on mobile */
.chips-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
@media (max-width: 720px) {
  .chips-row {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 6px;
    scrollbar-width: thin;
  }
  .chips-row > * { flex-shrink: 0; }
}

/* Contact info card */
.contact-card {
  background: white;
  padding: 28px 24px;
  border-radius: var(--radius);
  text-align: center;
  border: 1px solid var(--border);
  transition: all .2s;
}
.contact-card:hover { border-color: var(--green); transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.contact-card .service-icon { margin-bottom: 14px; }
.contact-card h3 { font-size: 17px; margin-bottom: 6px; }
.contact-card p { color: var(--gray); font-size: 14px; margin-bottom: 10px; }
.contact-card .val {
  font-weight: 700;
  color: var(--green-dark);
  font-size: 16px;
  word-break: break-word;
}

/* Blog card fixes */
.blog-card {
  background: white;
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
  transition: all .2s;
  display: block;
  color: inherit;
}
.blog-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.blog-card .img { aspect-ratio: 16/10; overflow: hidden; }
.blog-card .img img { width: 100%; height: 100%; object-fit: cover; }
.blog-card .body { padding: 18px 20px; }
.blog-card .meta { color: var(--gray); font-size: 12px; margin-bottom: 8px; }
.blog-card h3 { font-size: 17px; font-weight: 700; line-height: 1.35; margin-bottom: 10px; }
.blog-card p { color: var(--gray); font-size: 14px; margin-bottom: 14px; }

/* Blog featured */
.blog-featured {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 32px;
  background: white;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: var(--shadow);
  margin-bottom: 48px;
}
.blog-featured .img { aspect-ratio: 16/10; overflow: hidden; }
.blog-featured .img img { width: 100%; height: 100%; object-fit: cover; }
.blog-featured .body { padding: 32px; display: flex; flex-direction: column; justify-content: center; }
@media (max-width: 720px) {
  .blog-featured { grid-template-columns: 1fr; }
  .blog-featured .body { padding: 24px 20px; }
}

/* Stat card variant */
.stats-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; text-align: center; }
.stat-big { font-size: 48px; font-weight: 800; color: var(--green-dark); letter-spacing: -0.02em; line-height: 1; }
.stat-lbl { color: var(--gray); font-weight: 500; margin-top: 6px; font-size: 14px; }
@media (max-width: 720px) {
  .stats-row { grid-template-columns: repeat(2, 1fr); gap: 24px; }
  .stat-big { font-size: 32px; }
}

/* Broker profile hero mobile */
@media (max-width: 720px) {
  .broker-hero { padding: 48px 0 32px; }
  .broker-hero .face-crop { width: 140px; height: 140px; border-width: 4px; }
  .broker-hero h1 { font-size: 24px; }
  .broker-hero .bio { font-size: 14px; }
  .broker-hero-contacts { flex-direction: column; }
  .broker-hero-contacts .btn { width: 100%; justify-content: center; }
  .broker-stats-row { grid-template-columns: 1fr 1fr; margin-top: -20px; }
  .stat-card { padding: 16px 12px; }
  .stat-num { font-size: 24px; }
  .stat-label { font-size: 11px; }
}

/* Page head mobile */
@media (max-width: 720px) {
  .page-head { padding: 16px 0 14px; }
  .page-head h1 { font-size: 22px; }
  .breadcrumbs { font-size: 12px; margin-bottom: 4px; }
  .page-head .lead { font-size: 14px; margin-top: 4px; }
  /* Обявите максимално нагоре: по-малки отстъпи над списъка */
  .listing-layout { padding: 10px 0 48px; gap: 16px; }
  .mobile-filter-bar { padding: 8px 0; margin-bottom: 10px; }
  .filter-toolbar { padding: 8px 12px; margin-bottom: 12px; }
  .filter-toolbar .count-result { font-size: 14px; }
}

/* Working hours row */
.hours-row {
  display: flex;
  justify-content: space-between;
  padding: 8px 0;
  border-bottom: 1px solid var(--border);
  font-size: 14px;
}
.hours-row:last-child { border-bottom: none; }
.hours-row .day { color: var(--gray); }
.hours-row .time { font-weight: 600; }

/* ===== Reviews section ===== */
.reviews-summary {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 32px;
  padding: 20px 24px;
  background: white;
  border-radius: 14px;
  border: 1px solid var(--border);
  flex-wrap: wrap;
}
.reviews-summary .rating {
  font-size: 42px;
  font-weight: 800;
  color: var(--green-dark);
  letter-spacing: -0.02em;
  line-height: 1;
}
.reviews-summary .stars { display: flex; gap: 2px; color: #fbbf24; }
.reviews-summary .stars svg { width: 20px; height: 20px; fill: #fbbf24; }
.reviews-summary .count { color: var(--gray); font-size: 14px; margin-top: 4px; }
.reviews-summary .google-logo {
  padding: 6px 14px;
  background: white;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--dark);
  margin-left: auto;
}

.review-card {
  background: white;
  padding: 24px;
  border-radius: 14px;
  border: 1px solid var(--border);
  transition: all .2s;
}
.review-card:hover { border-color: var(--green); box-shadow: var(--shadow); }
.review-card .stars {
  color: #fbbf24;
  display: flex;
  gap: 2px;
  margin-bottom: 12px;
}
.review-card .stars svg { width: 16px; height: 16px; fill: #fbbf24; }
.review-card p { color: var(--dark); font-size: 15px; line-height: 1.6; margin-bottom: 16px; }
.review-card .author {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
}
.review-card .author img { width: 40px; height: 40px; border-radius: 50%; }
.review-card .author .name { font-weight: 700; font-size: 14px; }
.review-card .author .date { font-size: 12px; color: var(--gray); }

/* ===== SEO categories chips ===== */
.seo-chips {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.seo-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  background: white;
  border: 1px solid var(--border);
  border-radius: 30px;
  color: var(--dark);
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  transition: all .15s;
}
.seo-chip:hover {
  border-color: var(--green);
  color: var(--green-dark);
  transform: translateY(-2px);
  box-shadow: var(--shadow);
}
.seo-chip .count {
  color: var(--gray);
  font-size: 13px;
  padding-left: 6px;
  border-left: 1px solid var(--border);
  margin-left: 4px;
}

/* ===== Enhanced team-strip ===== */
.team-strip .cta-visual {
  position: relative;
  padding: 20px;
  background: rgba(255,255,255,.06);
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.1);
}
.team-strip .cta-visual .face-crop {
  width: 96px; height: 96px;
  border: 3px solid var(--green);
  margin-bottom: 12px;
}
.team-strip .cta-visual h4 { color: white; font-size: 18px; margin-bottom: 4px; }
.team-strip .cta-visual .role { color: var(--green); font-size: 13px; margin-bottom: 12px; font-weight: 600; }
.team-strip .cta-visual .phone-big {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 20px;
  font-weight: 800;
  color: white;
}
.team-strip .cta-visual .phone-big svg { color: var(--green); }

/* ===== MOBILE DRAWER ===== */
.drawer-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(15, 20, 25, .55);
  backdrop-filter: blur(2px);
  opacity: 0;
  visibility: hidden;
  transition: opacity .28s ease, visibility .28s;
  z-index: 200;
}
.drawer-backdrop.open { opacity: 1; visibility: visible; }

.drawer {
  position: fixed;
  top: 0; right: 0; bottom: 0;
  width: min(88%, 380px);
  background: white;
  z-index: 201;
  transform: translateX(100%);
  transition: transform .32s cubic-bezier(0.32, 0.72, 0, 1);
  display: flex;
  flex-direction: column;
  box-shadow: -20px 0 60px rgba(0,0,0,.15);
}
.drawer.open { transform: translateX(0); }

.drawer-head {
  padding: 18px 20px;
  border-bottom: 1px solid var(--border);
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-shrink: 0;
}
.drawer-head .logo img { height: 40px; display: block; }
.drawer-close {
  padding: 8px;
  border-radius: 8px;
  color: var(--dark);
  transition: background .15s;
  display: flex;
  align-items: center;
  justify-content: center;
}
.drawer-close:hover { background: var(--gray-light); }
.drawer-close svg { width: 24px; height: 24px; }

.drawer-nav {
  padding: 10px 12px;
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.drawer-nav a {
  display: flex;
  align-items: center;
  padding: 13px 14px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 500;
  color: var(--dark);
  transition: all .15s;
  text-decoration: none;
}
.drawer-nav a:hover { background: var(--gray-light); }
.drawer-nav a.active {
  background: var(--green-light);
  color: var(--green-dark);
  font-weight: 700;
}
.drawer-nav a.active::before {
  content: '';
  width: 3px;
  height: 20px;
  background: var(--green);
  border-radius: 3px;
  margin-right: 12px;
  margin-left: -14px;
}

.drawer-actions {
  padding: 16px 20px;
  border-top: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex-shrink: 0;
}

.drawer-footer {
  padding: 18px 20px;
  background: var(--gray-light);
  font-size: 13px;
  flex-shrink: 0;
}
.drawer-footer .row {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 6px 0;
  color: var(--dark);
  text-decoration: none;
  transition: color .15s;
}
.drawer-footer a.row:hover { color: var(--green-dark); }
.drawer-footer .row svg { color: var(--green-dark); width: 16px; height: 16px; flex-shrink: 0; }
.drawer-social {
  display: flex;
  gap: 8px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(0,0,0,.06);
}
.drawer-social a {
  width: 36px; height: 36px;
  border-radius: 8px;
  background: white;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--dark);
  transition: all .15s;
}
.drawer-social a:hover { background: var(--green); color: white; }
.drawer-social svg { width: 16px; height: 16px; }

body.no-scroll { overflow: hidden; }

/* ===== Detail polish ===== */
.btn { min-height: 40px; }
.btn-lg { min-height: 48px; }
.btn:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
a:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 2px;
}

/* Skip a11y — smoother nav */
.nav a { transition: all .15s ease; }
.nav a.active {
  color: var(--green-dark);
  font-weight: 700;
}
.nav a.active::after {
  content: '';
  display: block;
  height: 2px;
  background: var(--green);
  border-radius: 2px;
  margin-top: 3px;
  animation: navIn .2s ease;
}
@keyframes navIn { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* Consistent card hover */
.prop-card, .team-card, .blog-card, .service-card, .contact-card {
  will-change: transform;
}

/* Cleaner form focus */
.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
  border-color: var(--green);
  box-shadow: 0 0 0 3px rgba(109, 189, 70, .12);
}

/* Hero H1 on small screens fits properly */
@media (max-width: 720px) {
  .hero { min-height: auto; padding: 44px 0 40px; }
  .hero h1 { font-size: 26px; line-height: 1.2; }
  .hero p { font-size: 15px; }
  .search-tabs { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
  .search-tabs::-webkit-scrollbar { display: none; }
  .search-tab { flex-shrink: 0; }
}

/* Header polish on scroll */
.header { transition: box-shadow .2s; }
.header.scrolled { box-shadow: 0 4px 20px rgba(0,0,0,.08); }

/* Better spacing for section head on mobile */
@media (max-width: 720px) {
  .section-head { margin-bottom: 32px; }
}


/* Степен на завършеност - пояснение за минималната логика */
.filter-hint.act-hint { border-left: 3px solid var(--green); }
.filter-hint .act-rule {
  display: block;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dashed var(--border);
  color: var(--gray);
}
.check-list label.more-item { display: none; }
.link-more {
  background: none; border: 0; padding: 6px 0 0; font: inherit; font-size: 13px;
  color: var(--green-dark); font-weight: 600; cursor: pointer; text-decoration: underline;
}
.link-more:hover { color: var(--green); }
.check-list label.act-included { color: var(--green-dark); }
.check-list label.act-included .count { color: var(--green-dark); }

/* Типография на статия в блога и текстови страници */
.article-body { font-size: 17px; line-height: 1.75; color: var(--dark); }
.article-body p { margin: 0 0 20px; }
.article-body h2 { font-size: 26px; font-weight: 800; margin: 36px 0 14px; letter-spacing: -0.01em; }
.article-body h3 { font-size: 20px; font-weight: 700; margin: 28px 0 10px; }
.article-body ul, .article-body ol { margin: 0 0 20px; padding-left: 24px; }
.article-body li { margin-bottom: 8px; }
.article-body a { color: var(--green-dark); text-decoration: underline; }
.article-body blockquote { border-left: 4px solid var(--green); padding: 16px 24px; margin: 28px 0; background: var(--green-light); border-radius: 0 12px 12px 0; font-style: italic; }
.article-body img { max-width: 100%; border-radius: 12px; }

/* ===== Филтри - авто-прилагане (site.js крие бутона само на десктоп) ===== */
@media (min-width: 1025px) {
  .filters-apply-desktop.js-hidden { display: none; }
}

/* ===== Публични форми - грешка от PHP валидацията под полето ===== */
.is-invalid { border-color: #b3261e !important; outline: 2px solid rgba(179,38,30,.35); outline-offset: 0; }
.field-error { display: block; color: #b3261e; font-size: 13px; margin-top: 4px; }

/* ===== Падащи списъци на търсачката (site.js, data-picker / data-location-picker) ===== */
.lp { position: relative; }
.lp-native { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; overflow: hidden; }
.lp-trigger {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  width: 100%; text-align: left; font: inherit; color: var(--gray); background: white;
  border: 1.5px solid var(--border); border-radius: 8px; padding: 10px 12px;
  font-size: 14px; font-weight: 600; cursor: pointer; line-height: 1.4;
}
.lp-trigger:focus-visible { outline: none; border-color: var(--green); box-shadow: 0 0 0 3px rgba(109,189,70,.18); }
.lp-trigger[aria-expanded=true] { border-color: var(--green); }
.lp.has-value .lp-trigger { color: var(--dark); }
.lp-trigger-text { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lp-chevron { flex: none; color: var(--gray); transition: transform .15s; }
.lp-trigger[aria-expanded=true] .lp-chevron { transform: rotate(180deg); }
/* В търсачката на началната полетата са без рамка, както бяха native select-ите */
.search-field .lp-trigger { border: none; padding: 0; font-size: 16px; font-weight: 700; background: transparent; color: var(--dark); }
.search-field .lp-trigger:focus-visible { box-shadow: none; outline: 2px solid var(--green); outline-offset: 4px; border-radius: 4px; }
.search-field .lp-chevron { color: var(--dark); }
.lp-panel {
  position: absolute; z-index: 1200; background: white; border-radius: 12px;
  box-shadow: 0 16px 48px rgba(0,0,0,.18), 0 2px 8px rgba(0,0,0,.08);
  border: 1px solid var(--border); display: flex; flex-direction: column;
  max-height: min(440px, calc(100vh - 40px)); overflow: hidden; text-align: left; outline: none;
}
/* display:flex по-горе иначе надделява над атрибута hidden и панелът остава видим */
.lp-panel[hidden] { display: none !important; }
.lp-head { display: none; }
.lp-search { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--border); color: var(--gray); }
.lp-search input { flex: 1; min-width: 0; border: none; outline: none; font: inherit; font-size: 16px; font-weight: 500; color: var(--dark); background: transparent; }
.lp-list { overflow-y: auto; padding: 6px 0; -webkit-overflow-scrolling: touch; }
.lp-group { padding: 10px 14px 4px; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gray); }
.lp-item { display: flex; align-items: center; gap: 10px; padding: 9px 14px; font-size: 14.5px; font-weight: 500; color: var(--dark); cursor: pointer; line-height: 1.35; }
.lp-item-district { padding-left: 24px; }
/* Подрайоните на Пловдив - едно ниво по-навътре, с черта отляво (26.10.2026) */
/* (чертата е фон, защото ::before е квадратчето при няколко стойности) */
.lp-item-subdistrict { padding-left: 40px; font-size: 14px; font-weight: 400;
  background: linear-gradient(var(--green-light), var(--green-light)) no-repeat 28px 6px / 2px calc(100% - 12px); }
.lp-item-city, .lp-item-all { font-weight: 700; }
.lp-item.is-active { background: var(--green-light); }
.lp-item.is-selected { color: var(--green-dark); }
.lp-label { flex: 1; min-width: 0; }
.lp-count { flex: none; font-size: 12.5px; font-weight: 600; color: var(--gray); }
.lp-item.is-selected::after { content: ''; flex: none; width: 6px; height: 11px; border: solid var(--green-dark); border-width: 0 2px 2px 0; transform: rotate(45deg); margin: 0 4px 3px 2px; }
.lp-empty { padding: 18px 14px; color: var(--gray); font-size: 14px; }
.lp-backdrop { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1190; background: rgba(15,23,42,.45); }
.lp-backdrop[hidden] { display: none; }
body.lp-open { overflow: hidden; }
@media (max-width: 720px) {
  /* Локацията е на цял екран (трябва клавиатура), кратките списъци са лист отдолу */
  .lp-panel.lp-panel-mobile {
    position: fixed; top: 0; right: 0; bottom: 0; left: 0; width: auto; max-height: none;
    border-radius: 0; border: none; padding-bottom: env(safe-area-inset-bottom);
  }
  .lp-panel.lp-panel-sheet {
    position: fixed; top: auto; right: 0; bottom: 0; left: 0; width: auto; max-height: min(70vh, 520px);
    border-radius: 16px 16px 0 0; border: none; padding-bottom: env(safe-area-inset-bottom);
    box-shadow: 0 -8px 32px rgba(0,0,0,.22);
  }
  .lp-panel-mobile .lp-head, .lp-panel-sheet .lp-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; font-weight: 700; font-size: 16px; border-bottom: 1px solid var(--border); }
  .lp-close { font-size: 28px; line-height: 1; color: var(--gray); padding: 0 4px; }
  .lp-panel-mobile .lp-search { padding: 12px 16px; }
  .lp-panel-mobile .lp-list { flex: 1; }
  .lp-panel-sheet .lp-list { padding-bottom: 10px; }
  .lp-panel-mobile .lp-item, .lp-panel-sheet .lp-item { padding: 13px 16px; font-size: 16px; }
  .lp-panel-mobile .lp-item-district { padding-left: 28px; }
  .lp-panel-mobile .lp-item-subdistrict { padding-left: 46px; font-size: 15px; background-position: 32px 6px; }
}

/* ===== Лого на бяла табела, закачена за хедъра (вариант 1 от предложението на 07.10, направено 13.10.2026) =====
   Логото е 96 px (вместо 48) върху бяла плочка, която тръгва от тъмната горна лента без
   празно място и слиза под белия ред на менюто със сянка. При скрол табелата се прибира в
   хедъра (лого 48 px), за да не закрива съдържанието под лепкавия хедър. Страниците под
   хедъра оставят място за табелата чрез --logo-hang (колко слиза под хедъра при scrollY 0). */
:root { --logo-hang: 42px; }
.header > .container > .logo { display: block; position: relative; z-index: 2; line-height: 0; align-self: flex-start; }
.header > .container > .logo img {
  display: block; box-sizing: content-box; height: 96px;
  padding: 10px 22px 12px;
  /* горе -14px = padding-top на хедъра, за да опре в тъмната лента; долу - 56px, за да не вдига реда на менюто */
  margin: -14px 0 -56px;
  background: #fff; border-radius: 0 0 18px 18px;
  box-shadow: 0 14px 32px rgba(0,0,0,.2), 0 2px 6px rgba(0,0,0,.08);
  transition: height .25s ease, padding .25s ease, margin .25s ease, box-shadow .25s ease, border-radius .25s ease;
}
.header.scrolled > .container > .logo img {
  height: 48px; padding: 0; margin: 0; box-shadow: none; border-radius: 0; background: transparent;
}
/* Съдържанието непосредствено под хедъра започва под табелата */
.page-head.ph-photo { padding-top: calc(22px + var(--logo-hang)); }
.breadcrumbs-page { color: var(--gray); font-size: 13px; padding: calc(16px + var(--logo-hang)) 0 16px; }
@media (max-width: 1200px) {
  /* По-тясно меню, за да се събере по-широката табела на таблет */
  .nav a { padding: 10px 11px; }
  .header > .container > .logo img { height: 84px; padding: 9px 18px 11px; margin: -14px 0 -42px; }
}
@media (max-width: 720px) {
  /* На телефон логото е 80 px (вместо 40), табелата слиза 30 px под хедъра */
  :root { --logo-hang: 30px; }
  .header > .container > .logo img {
    height: 80px; padding: 8px 16px 10px; margin: -14px 0 -44px;
    border-radius: 0 0 14px 14px; box-shadow: 0 10px 24px rgba(0,0,0,.18);
  }
  .header.scrolled > .container > .logo img { height: 40px; }
  .page-head.ph-photo { padding-top: calc(12px + var(--logo-hang)); }
  .hero { padding-top: 60px; }
}
@media (prefers-reduced-motion: reduce) {
  .header > .container > .logo img { transition: none; }
}

/* ===== Телефони и имейли, защитени от ботове (x-site.contact, site.js) ===== */
.topbar-info .js-contact { display: inline-flex; align-items: center; gap: 8px; color: inherit; }
.js-contact[data-icon-only] .js-contact-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ===== Представяне на брокера до снимката: два реда + "Прочети повече" (13.10.2026) ===== */
.broker-hero .bio { line-height: 1.6; }
.broker-hero .bio.is-collapsed { max-height: 3.2em; overflow: hidden; }
.broker-hero .bio p { margin: 0 0 6px; }
.broker-hero .bio p:last-child { margin-bottom: 0; }
.broker-hero .bio ul, .broker-hero .bio ol { margin: 0 0 6px 20px; }
.broker-hero .bio a { color: var(--green); text-decoration: underline; }
.broker-hero .bio-more {
  background: none; border: none; padding: 0; margin: -12px 0 20px; cursor: pointer;
  font: inherit; font-weight: 700; color: var(--green);
}
.broker-hero .bio-more:hover { color: #fff; }
.broker-hero .bio-more[hidden] { display: none; }

/* ===== Локация с няколко стойности (20.10.2026): отметки, ред "Област ..." под името, "Готово" ===== */
.lp-label { display: flex; flex-direction: column; min-width: 0; }
.lp-name { display: block; }
.lp-sub { display: block; font-size: 11.5px; font-weight: 500; color: var(--gray); line-height: 1.25; margin-top: 1px; }
.lp-group { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.lp-group-sub { font-size: 10.5px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--gray); }
.lp-panel.lp-multi .lp-item::before {
  content: ''; flex: none; width: 18px; height: 18px; border-radius: 5px; box-sizing: border-box;
  border: 2px solid #c9ced6; background: #fff center / 12px no-repeat;
}
.lp-panel.lp-multi .lp-item.is-selected::before {
  border-color: var(--green); background-color: var(--green);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}
.lp-panel.lp-multi .lp-item.is-selected::after { content: none; }
.lp-panel.lp-multi .lp-item-all::before { border-radius: 50%; }
.lp-panel.lp-multi .lp-item.is-selected { color: var(--dark); }
.lp-foot {
  display: flex; align-items: center; gap: 10px; padding: 10px 12px;
  border-top: 1px solid var(--border); background: #fff; flex: none;
}
.lp-foot-count { flex: 1; font-size: 13px; color: var(--gray); text-align: center; }
.lp-clear { background: none; border: 0; padding: 6px 4px; font: inherit; font-size: 13px; font-weight: 600; color: var(--gray); cursor: pointer; visibility: hidden; }
.lp-panel.has-selection .lp-clear { visibility: visible; }
.lp-clear:hover { color: var(--dark); }
.lp-done {
  background: var(--green); color: #fff; border: 0; border-radius: 8px; padding: 9px 18px;
  font: inherit; font-size: 14px; font-weight: 700; cursor: pointer;
}
.lp-done:hover { background: var(--green-dark); }
@media (max-width: 720px) {
  .lp-panel-mobile .lp-foot, .lp-panel-sheet .lp-foot { padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); }
  .lp-done { padding: 12px 22px; font-size: 15px; }
  .lp-panel-mobile .lp-sub { font-size: 12.5px; }
}

/* ===== Панелът "Имате имот за продажба?" на телефон (снимка от клиента, 19.10.2026) =====
   Полетата на формата нямаха min-width:0 и двете колони бутаха панела извън екрана. */
.team-strip { min-width: 0; max-width: 100%; box-sizing: border-box; overflow: hidden; }
.team-strip > div { min-width: 0; }
.team-strip form { max-width: 100%; }
.team-strip form input, .team-strip form button { min-width: 0; width: 100%; box-sizing: border-box; }
.team-strip .cf-turnstile { max-width: 100%; overflow: hidden; }
.team-strip .cf-turnstile iframe { max-width: 100%; }
@media (max-width: 720px) {
  .team-strip { padding: 28px 20px; border-radius: 14px; }
  .team-strip h2 { font-size: 26px; }
  /* minmax(0, 1fr): кутийката на Cloudflare е 300 px (смалена с transform) и с 1fr разпъваше
     колоната и полетата до 300 px при 320 px екран (05.11.2026) */
  .team-strip form { grid-template-columns: minmax(0, 1fr) !important; }
  .team-strip form input, .team-strip form button, .team-strip .cf-turnstile { grid-column: 1 / -1; }
}
@media (max-width: 380px) {
  .team-strip { padding: 24px 16px; }
  .team-strip h2 { font-size: 23px; }
}

/* ===== Лента на брокера под числата (снимка на клиента от 19.10.2026) =====
   Първата карта е информацията за брокера, след нея снимките (сертификати, снимки с
   клиенти, сделки); превъртат се встрани със стрелките или с пръст, една карта на екран
   на телефон. Замества галерията "Успехи и отличия" от 07.10. */
.broker-band {
  background: #e9ecef; border-radius: 16px; padding: 24px 28px; margin: 0 0 48px;
  min-width: 0; max-width: 100%; box-sizing: border-box;
}
.broker-band-slider { position: relative; min-width: 0; }
.broker-band-track {
  display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; align-items: stretch;
  scrollbar-width: none; padding: 2px; min-width: 0;
}
.broker-band-track::-webkit-scrollbar { display: none; }
.bk-card {
  flex: 0 0 300px; min-width: 0; max-width: 100%; box-sizing: border-box; margin: 0;
  background: #fff; border: 1px solid var(--border); border-radius: 14px; overflow: hidden;
  scroll-snap-align: start; display: flex; flex-direction: column;
}
.bk-card-info { flex-basis: 420px; padding: 22px 24px; }
.bk-card-info h2 { font-size: 18px; font-weight: 800; margin: 0 0 12px; }
.bk-bio { color: var(--gray); font-size: 15px; line-height: 1.65; overflow-wrap: anywhere; }
.bk-bio.is-collapsed { max-height: 11.5em; overflow: hidden; position: relative; }
.bk-bio.is-collapsed::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2.6em; background: linear-gradient(rgba(255,255,255,0), #fff); }
.bk-bio p { margin: 0 0 8px; }
.bk-bio p:last-child { margin-bottom: 0; }
.bk-bio ul, .bk-bio ol { margin: 0 0 8px 20px; }
.bk-bio a { color: var(--green-dark); text-decoration: underline; }
.bk-card-info .bio-more {
  align-self: flex-start; background: none; border: none; padding: 0; margin: 10px 0 0; cursor: pointer;
  font: inherit; font-size: 14px; font-weight: 700; color: var(--green-dark);
}
.bk-card-info .bio-more[hidden] { display: none; }
.bk-card-photo a { display: block; background: #f3f4f3; }
.bk-card-photo img { width: 100%; height: 240px; object-fit: contain; display: block; }
.bk-card-photo figcaption { padding: 10px 14px; font-size: 13.5px; color: var(--gray); text-align: center; }
.broker-band .slider-btn.prev { left: -36px; }
.broker-band .slider-btn.next { right: -36px; }
.broker-band-slider:not(.is-slider) .broker-band-track { justify-content: flex-start; }
@media (max-width: 1024px) {
  .broker-band .slider-btn.prev { left: -14px; }
  .broker-band .slider-btn.next { right: -14px; }
}
@media (max-width: 720px) {
  .broker-band { padding: 16px; border-radius: 12px; margin-bottom: 36px; }
  .broker-band-track { gap: 12px; }
  .bk-card, .bk-card-info { flex-basis: 86%; }
  .bk-card-info { padding: 18px; }
  .bk-card-photo img { height: 210px; }
  .broker-band .slider-btn.prev { left: -6px; }
  .broker-band .slider-btn.next { right: -6px; }
  .broker-band .slider-btn { width: 34px; height: 34px; }
}

/* ===== Проверка 20.10.2026 при 8 ширини: нищо извън екрана =====
   При 721-900 px менюто и бутонът не се събираха в хедъра (страницата се
   разширяваше с ~30 px) - до 900 px се ползва мобилното меню. Turnstile е 300 px и
   пробиваше картата на формата в Контакти под 390 px - реже се до ширината. */
@media (max-width: 900px) {
  .nav { display: none; }
  .mobile-toggle { display: flex; }
  .header-actions .btn { display: none; }
  .header-actions { gap: 8px; }
  .header .container { gap: 12px; }
}
.cf-turnstile { max-width: 100%; overflow: hidden; }
.cf-turnstile iframe { max-width: 100%; }
.form-card { min-width: 0; max-width: 100%; box-sizing: border-box; }
@media (max-width: 380px) {
  .form-card { padding: 20px 14px; }
}
@media (max-width: 360px) {
  /* Трите числа под търсачката с по-дългия надпис "години на пазара" се увиват вместо да стърчат */
  .hero-stats { flex-wrap: wrap; gap: 16px 20px; }
  .hero-stat-label { font-size: 11.5px; }
}

/* Тагове на избраните локации в каталога (26.10.2026): линк = махане на локацията */
.loc-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 16px; }
/* Подрайоните под квартала в чекмеджето с филтрите (26.10.2026) - разгъват се */
.loc-subs { margin: -2px 0 2px 26px; padding-left: 12px; border-left: 2px solid var(--green-light); }
.loc-subs > summary { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; font-size: 13px; font-weight: 600; color: var(--green-dark); cursor: pointer; list-style: none; }
.loc-subs > summary::-webkit-details-marker { display: none; }
.loc-subs > summary::before { content: ''; width: 6px; height: 6px; border: solid currentColor; border-width: 0 2px 2px 0; transform: rotate(-45deg); transition: transform .15s; margin-right: 2px; }
.loc-subs[open] > summary::before { transform: rotate(45deg); }
.loc-subs-n { color: var(--gray); font-weight: 500; }
.filter-group .check-list .loc-subs label { font-size: 13.5px; }
.loc-tags-label { font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gray); margin-right: 2px; }
.loc-tag { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; min-height: 36px; padding: 6px 8px 6px 14px; border-radius: 999px; background: var(--green-light); color: var(--green-dark); font-size: 14px; font-weight: 600; text-decoration: none; line-height: 1.3; transition: background .15s, color .15s; }
.loc-tag-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.loc-tag-x { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: rgba(0,0,0,.08); font-size: 18px; font-weight: 700; line-height: 1; }
.loc-tag:hover, .loc-tag:focus-visible { background: var(--green); color: #fff; outline: none; }
.loc-tag:hover .loc-tag-x, .loc-tag:focus-visible .loc-tag-x { background: rgba(255,255,255,.28); }
.loc-tags-clear { font-size: 13.5px; font-weight: 600; color: var(--gray); text-decoration: underline; text-underline-offset: 3px; padding: 6px 4px; }
.loc-tags-clear:hover { color: var(--dark); }
@media (max-width: 720px) {
  .loc-tags { gap: 8px 6px; margin-bottom: 14px; }
  .loc-tags-label { width: 100%; margin: 0; }
  .loc-tag { min-height: 40px; }
  .loc-tag-x { width: 26px; height: 26px; }
}

/* ===== Мобилни филтри по образеца на Mobisector (26.10.2026, public/site/filters.js) =====
   До 1024 px: сделката е превключвател горе, отдолу две колони - вляво групите с избраното
   под името, вдясно само активната група; долу "Изчисти" и "Покажи N имота" (бройка на живо).
   Над 1024 px .fd-nav е скрит и групите са една под друга, както досега. */
.fd-nav { display: none; }
.fd-status { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.fd-zero[hidden] { display: none; }
@media (max-width: 1024px) {
  .filters.fd-on { padding: 0; top: max(44px, 5vh); overflow: hidden; flex-direction: column; }
  .filters.fd-on.is-mounted { display: flex; }
  .filters.fd-on [hidden] { display: none !important; }
  .filters.fd-on .filter-drawer-head { position: static; flex: none; margin: 0; padding: 12px 12px 12px 16px; }
  .filters.fd-on .filter-drawer-head .drawer-close { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }

  /* Сделка - превключвател над колоните */
  .filters.fd-on .fd-deal { flex: none; display: block; margin: 0; padding: 10px 14px; border-bottom: 1px solid var(--border); }
  .filters.fd-on .fd-deal label.head { display: none; }
  .filters.fd-on .fd-deal .check-list { flex-direction: row; gap: 0; padding: 3px; background: var(--gray-light); border-radius: 10px; }
  .filters.fd-on .fd-deal .check-list label { position: relative; flex: 1; justify-content: center; gap: 6px; min-height: 42px; padding: 6px 4px; border-radius: 8px; font-size: 14px; font-weight: 700; color: var(--gray); }
  .filters.fd-on .fd-deal input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; pointer-events: none; }
  .filters.fd-on .fd-deal label.is-checked { background: #fff; color: var(--green-dark); box-shadow: 0 1px 4px rgba(0,0,0,.12); }
  .filters.fd-on .fd-deal label:focus-within { outline: 2px solid var(--green); outline-offset: -2px; }
  .filters.fd-on .fd-deal .count { margin-left: 0; font-size: 11.5px; font-weight: 600; }

  /* Две колони */
  .filters.fd-on .fd-body { flex: 1 1 auto; display: flex; min-height: 0; }
  .filters.fd-on .fd-nav {
    display: block; flex: 0 0 34%; min-width: 106px; max-width: 210px; overflow-y: auto;
    background: #f4f6f8; border-right: 1px solid var(--border); overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
  }
  .fd-tab {
    display: block; width: 100%; min-height: 54px; padding: 13px 10px 13px 12px; text-align: left; cursor: pointer;
    background: transparent; border: 0; border-left: 3px solid transparent; border-bottom: 1px solid #e5e8ec;
    font: inherit; font-size: 14px; font-weight: 600; line-height: 1.3; color: var(--dark);
  }
  .fd-tab[aria-selected=true] { background: #fff; border-left-color: var(--green); font-weight: 800; }
  .fd-tab:focus-visible { outline: 2px solid var(--green); outline-offset: -2px; }
  .fd-tab-name { display: block; overflow-wrap: anywhere; }
  .fd-tab-sub { display: block; margin-top: 3px; font-size: 12px; font-weight: 700; color: var(--green-dark); overflow-wrap: anywhere; }
  .fd-tab-sub:empty { display: none; }
  .filters.fd-on .fd-pane { flex: 1 1 auto; min-width: 0; overflow-y: auto; padding: 14px 14px 24px; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
  .filters.fd-on .fd-pane .filter-group { display: none; margin: 0; padding: 0; border: 0; }
  .filters.fd-on .fd-pane .filter-group.is-active { display: block; }
  .filters.fd-on .filter-group label.head { margin-bottom: 10px; font-size: 13px; }

  /* Опциите - по-големи за пръст */
  .filters.fd-on .check-list { gap: 0; font-size: 15px; }
  .filters.fd-on .fd-pane .check-list label { min-height: 44px; padding: 8px 0; line-height: 1.3; }
  .filters.fd-on .fd-pane .check-list input[type=checkbox], .filters.fd-on .fd-pane .check-list input[type=radio] { flex: none; width: 20px; height: 20px; accent-color: var(--green); }
  .filters.fd-on .check-list label.more-item { display: flex; }
  .filters.fd-on [data-more-toggle] { display: none; }
  .filters.fd-on label.is-zero { color: var(--gray); }
  .filters.fd-on .fd-districts { margin-left: 10px !important; padding-left: 10px !important; }
  /* "(Област ...)" под името на града, иначе стърчи вдясно на 320 px */
  .filters.fd-on .fd-pane .check-list label { flex-wrap: wrap; }
  .filters.fd-on .fd-pane .check-list .muted { order: 3; flex: 0 0 100%; padding-left: 28px; margin-top: -2px; }

  /* Цена и квадратура */
  .filters.fd-on .filter-range { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
  .filters.fd-on .filter-range input, .filters.fd-on .fd-pane input[type=search] { width: 100%; min-height: 46px; padding: 10px 12px; border: 1.5px solid var(--border); border-radius: 8px; font-size: 16px; }
  .filters.fd-on .filter-range input:focus, .filters.fd-on .fd-pane input[type=search]:focus { outline: none; border-color: var(--green); }
  .filters.fd-on .filter-range input[aria-invalid=true] { border-color: #d64545; }
  .fd-range-error { margin: 8px 0 0; font-size: 13px; line-height: 1.4; color: #b42318; }

  /* Търсене в локациите - стои горе, докато се скролира списъкът */
  .fd-loc-search {
    position: sticky; top: -14px; z-index: 2; display: flex; align-items: center; gap: 8px;
    margin: -14px -14px 8px; padding: 10px 14px; background: #fff; border-bottom: 1px solid var(--border); color: var(--gray);
  }
  .filters.fd-on .fd-loc-search input[type=search] { flex: 1; min-width: 0; min-height: 42px; border: 1.5px solid var(--border); padding: 8px 10px; }
  .fd-loc-empty { padding: 12px 0; font-size: 14px; color: var(--gray); }

  /* Долна лента */
  .filters.fd-on .filter-drawer-actions { position: static; flex: none; flex-wrap: wrap; margin: 0; gap: 10px; padding: 10px 14px calc(10px + env(safe-area-inset-bottom)); }
  .filters.fd-on .filter-drawer-actions .btn { min-height: 48px; }
  .fd-zero { flex: 0 0 100%; margin: 0; font-size: 13px; font-weight: 600; text-align: center; color: #b42318; }
  .filter-drawer-actions [data-clear-filters].is-empty { color: #9aa3ad; border-color: #e3e6ea; cursor: default; }
  #apply-filters-mobile.is-loading { opacity: .8; }
  #apply-filters-mobile.is-zero { background: #5b6472; border-color: #5b6472; }

  /* Бутонът "Подреди" до "Филтри": надпис отгоре, краткият избор отдолу (до два реда) */
  .mobile-filter-bar .lp { flex: 1; min-width: 0; display: flex; }
  .mobile-filter-bar .lp-trigger {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 6px;
    min-height: 48px; padding: 6px 12px; border-radius: 10px; color: var(--dark); background: #fff;
  }
  .mobile-filter-bar .lp-trigger::before { content: '\41f\43e\434\440\435\434\438'; grid-column: 1 / -1; font-size: 10.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; line-height: 1.2; color: var(--gray); }
  .mobile-filter-bar .lp-trigger-text { white-space: normal; font-size: 14px; font-weight: 700; line-height: 1.25; }
  /* "Филтри" е колкото съдържанието си, останалото е за "Подреди" (иначе "Препоръчано" се реже) */
  .mobile-filter-bar .filter-btn { flex: 0 0 auto; min-height: 48px; padding: 10px 16px; }
  .mobile-filter-bar .lp-trigger-text { overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
}
@media (max-width: 380px) {
  .filters.fd-on .fd-nav { flex-basis: 36%; min-width: 112px; }
  .fd-tab { padding: 12px 6px 12px 9px; font-size: 13px; }
  .filters.fd-on .fd-pane { padding: 12px 12px 20px; }
  .fd-loc-search { top: -12px; margin: -12px -12px 8px; padding: 10px 12px; }
  .filters.fd-on .filter-range { grid-template-columns: minmax(0, 1fr); }
}
/* Таблет: "Филтри" и "Подреди" са на равна ширина */
@media (min-width: 721px) and (max-width: 1024px) {
  .mobile-filter-bar .filter-btn, .mobile-filter-bar .lp { flex: 1 1 0; }
}

/* ===== Любими обяви (26.10.2026): сърце с брояч в хедъра, страница /lubimi, известие отдолу =====
   Сърцето на картата и на обявата е червено и плътно, когато обявата е в любимите. */
.prop-fav { z-index: 2; }
.prop-fav.active { color: #ef4444; }
.prop-fav.active svg, .gallery-actions button.active svg { fill: currentColor; }
.prop-fav.fav-pop svg, .gallery-actions button.fav-pop svg { animation: fav-pop .3s ease; }
@keyframes fav-pop { 50% { transform: scale(1.35); } }

.header-fav {
  position: relative; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px; border-radius: 50%;
  color: var(--dark); transition: background .15s, color .15s;
}
.header-fav:hover, .header-fav.active { background: var(--green-light); color: var(--green-dark); }
.header-fav svg { width: 22px; height: 22px; }
.header-fav-count {
  position: absolute; top: 1px; right: -2px;
  min-width: 18px; height: 18px; padding: 0 5px; box-sizing: border-box;
  border-radius: 9px; background: #ef4444; color: #fff;
  font-size: 11px; font-weight: 700; line-height: 18px; text-align: center;
}
.header-fav-count[hidden] { display: none; }

.fav-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 20px; }
.fav-clear { color: var(--gray); font-size: 14px; font-weight: 600; text-decoration: underline; cursor: pointer; }
.fav-clear:hover { color: #ef4444; }
.fav-note {
  display: flex; align-items: flex-start; gap: 8px; margin-bottom: 20px; padding: 12px 14px;
  background: var(--green-light); border-radius: 8px; color: var(--dark); font-size: 14px;
}
.fav-note svg { flex: none; width: 18px; height: 18px; color: var(--green-dark); margin-top: 1px; }
.fav-empty { padding: 56px 20px; text-align: center; background: #fff; border: 1px solid var(--border); border-radius: 12px; }
.fav-empty > svg { width: 40px; height: 40px; color: #ef4444; }
.fav-empty h2 { font-size: 22px; margin: 14px 0 6px; }
.fav-empty p { color: var(--gray); font-size: 15px; max-width: 460px; margin: 0 auto 20px; }
.prop-card.is-removed { opacity: .45; }
.prop-card.is-removed:hover { opacity: .75; }

/* Центрирано с left/right + margin auto: при left: 50% ширината стига само до половината екран и текстът се пречупва */
.fav-toast {
  position: fixed; left: 0; right: 0; bottom: calc(20px + env(safe-area-inset-bottom)); z-index: 1300;
  display: flex; align-items: center; gap: 14px;
  width: fit-content; max-width: calc(100vw - 32px); margin: 0 auto; box-sizing: border-box; padding: 12px 16px;
  border-radius: 10px; background: var(--dark); color: #fff; font-size: 14px; font-weight: 600;
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
  opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(12px);
  transition: opacity .2s, transform .2s, visibility .2s;
}
.fav-toast.is-on { opacity: 1; visibility: visible; pointer-events: auto; transform: none; }
.fav-toast span, .fav-toast a { white-space: nowrap; }
.fav-toast a { color: var(--green); text-decoration: underline; }
/* Над долната лента с бутоните на обявата на телефон */
@media (max-width: 720px) { body.single-page .fav-toast { bottom: calc(88px + env(safe-area-inset-bottom)); } }
@media (prefers-reduced-motion: reduce) {
  .fav-toast { transition: none; }
  .prop-fav.fav-pop svg, .gallery-actions button.fav-pop svg { animation: none; }
}

/* ===== Корекции на клиента от 28.10.2026 ===== */

/* Полето "Локация" не мени ширината си според избрания текст (видео и снимка на клиента):
   колоните с 1fr растяха по дългото име, а падащият списък подскачаше встрани */
.search-card { grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr) minmax(0, 1fr) auto; }
.quick-fields { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.3fr) auto; }
@media (min-width: 1025px) and (max-width: 1279px) {
  .quick-fields { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.2fr) auto; }
}
@media (max-width: 720px) {
  .search-card, .quick-fields { grid-template-columns: minmax(0, 1fr); }
}

/* Дървото на локациите: горе областните градове с "Област: ..." под тях, кварталите и
   селата се отварят с клик (стрелката е на мястото на квадратчето) */
.lp-item.lp-branch-head { font-weight: 700; border-top: 1px solid #eef0f2; padding-top: 11px; }
.lp-list > .lp-branch-head:first-child, .lp-list > .lp-item-all + .lp-branch-head { border-top: 0; }
.lp-panel.lp-multi .lp-item.lp-toggle::before {
  border: 0; border-radius: 0; background-color: transparent; transition: transform .15s;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E");
  background-size: 16px;
}
.lp-panel.lp-multi .lp-item.lp-toggle.is-open::before { transform: rotate(90deg); }
.lp-item.lp-toggle.is-open { color: var(--green-dark); }
.lp-item.lp-oblast-line { font-size: 13.5px; font-weight: 600; color: #4b5563; padding-top: 5px; }
.lp-oblast-empty { padding: 0 14px 10px 42px; font-size: 13px; font-weight: 500; color: var(--gray); }
.lp-item.lp-in-center, .lp-item.lp-in-oblast { padding-left: 40px; font-weight: 500; }
.lp-item.lp-item-subdistrict.lp-in-center, .lp-item.lp-in-oblast.lp-child { padding-left: 58px; background-position: 48px 6px; }
.lp-chosen {
  display: inline-block; margin-left: 8px; padding: 1px 7px; border-radius: 10px; vertical-align: 1px;
  font-size: 11px; font-weight: 700; color: var(--green-dark); background: var(--green-light); white-space: nowrap;
}
@media (max-width: 720px) {
  .lp-panel-mobile .lp-item.lp-in-center, .lp-panel-mobile .lp-item.lp-in-oblast { padding-left: 42px; }
  .lp-panel-mobile .lp-item.lp-item-subdistrict.lp-in-center { padding-left: 60px; background-position: 50px 6px; }
  .lp-panel-mobile .lp-item.lp-oblast-line { font-size: 14.5px; padding-top: 4px; }
  .lp-panel-mobile .lp-oblast-empty { padding: 0 16px 12px 44px; font-size: 14px; }
}

/* Дървото в чекмеджето на каталога (същото като в търсачката): клон = областният град
   (отваря кварталите) и "Област: ..." под него (отваря селата и малките градове) */
.filter-group .check-list.loc-tree { gap: 0; }
.loc-branch { border-top: 1px solid var(--border); padding: 4px 0; }
.loc-branch:first-child { border-top: 0; }
.loc-node > summary { display: flex; align-items: center; gap: 8px; min-height: 40px; cursor: pointer; list-style: none; }
.loc-node > summary::-webkit-details-marker { display: none; }
.loc-node > summary::before {
  content: ''; flex: none; width: 7px; height: 7px; margin: 0 6px 0 4px; border: solid var(--gray);
  border-width: 0 2px 2px 0; transform: rotate(-45deg); transition: transform .15s;
}
.loc-node[open] > summary::before { transform: rotate(45deg); border-color: var(--green-dark); }
.loc-node > summary .count { margin-left: auto; color: var(--gray); font-size: 12px; font-weight: 500; }
.loc-head { font-size: 15px; font-weight: 700; color: var(--dark); }
.filter-group .check-list label.loc-head { font-weight: 700; min-height: 40px; }
.loc-oblast-head { font-size: 13.5px; font-weight: 600; color: #4b5563; min-height: 34px !important; }
.loc-node[open] > summary { color: var(--green-dark); }
.loc-body { padding: 2px 0 6px 24px; display: flex; flex-direction: column; }
.loc-body .fd-districts { margin-left: 12px; padding: 2px 0 2px 12px; border-left: 2px solid var(--green-light); display: flex; flex-direction: column; }
.filter-group .check-list label.loc-whole { font-weight: 600; }
.loc-oblast-empty { padding: 0 0 8px 23px; font-size: 13px; color: var(--gray); }

/* Лентата под търсачката - 4 точки от снимката на клиента (Етика с емблемата на НСНИ,
   Квалификация, Лично отношение, Услуга от начало до край), по-едри от петте преди */
.trust-items.trust-items-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; }
.trust-items-4 .trust-item { padding: 4px 22px; border-left: 1px solid var(--border); gap: 14px; }
.trust-items-4 .trust-item:first-child { border-left: 0; padding-left: 0; }
.trust-items-4 .trust-item svg { width: 34px; height: 34px; stroke-width: 1.6; margin-top: 0; }
.trust-items-4 .trust-item strong { font-size: 17px; }
.trust-items-4 .trust-item span { font-size: 14px; }
.trust-nsni { display: block; flex: none; line-height: 0; }
.trust-nsni img { width: 58px; height: auto; display: block; }
@media (max-width: 1024px) {
  .trust-items.trust-items-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 18px; }
  .trust-items-4 .trust-item:nth-child(odd) { border-left: 0; padding-left: 0; }
  /* точките са една под друга - иконите стоят в средата на мястото на емблемата (58 px),
     за да започват всички текстове на една линия */
  .trust-items-4 .trust-item > svg { margin: 0 12px; }
}
@media (max-width: 720px) {
  .trust-items-4 .trust-item { padding: 0 0 0 12px; gap: 10px; }
  .trust-items-4 .trust-item svg { width: 28px; height: 28px; }
  .trust-items-4 .trust-item strong { font-size: 15px; }
  .trust-items-4 .trust-item span { font-size: 13px; }
  .trust-items-4 .trust-item:last-child { grid-column: auto; }
  .trust-nsni img { width: 46px; }
  .trust-items-4 .trust-item > svg { margin: 0 9px; }
}
@media (max-width: 380px) {
  .trust-items.trust-items-4 { grid-template-columns: minmax(0, 1fr); }
  .trust-items-4 .trust-item { border-left: 0; padding-left: 0; }
}

/* Бутонът за оценка в хедъра по макета на клиента (28.10.2026): лимонено зелено, два реда */
.header-actions .header-cta {
  flex-direction: column; justify-content: center; gap: 2px; min-height: 50px; width: 196px; white-space: normal;
  padding: 6px 16px; border-radius: 14px; background: #b5e31f; text-align: center; line-height: 1.15;
  text-transform: uppercase; box-shadow: 0 4px 12px rgba(140, 190, 20, .28);
}
.header-cta-main { font-size: 12px; font-weight: 800; letter-spacing: .02em; color: #fff; text-shadow: 0 1px 2px rgba(50, 80, 0, .55); white-space: normal; }
.header-cta-sub { font-size: 10.5px; font-weight: 800; letter-spacing: .04em; color: #1c2610; white-space: nowrap; }
.header-actions .header-cta:hover { background: #a5d313; transform: translateY(-1px); box-shadow: 0 8px 18px rgba(140, 190, 20, .4); }
.header-actions .header-cta:focus-visible { outline: 2px solid var(--dark); outline-offset: 2px; }
@media (max-width: 1200px) {
  .header-actions .header-cta { width: 172px; padding: 6px 12px; }
  .header-cta-main { font-size: 11px; }
  .header-cta-sub { font-size: 10px; }
}

/* Лентата на брокера (писмо на клиента от 28.10.2026): светъл фон като мъгла, картите с
   лека рамка като обявите, всяка със свое "Вижте повече"; разгъната карта не разтяга
   останалите, снимката започва на нивото на заглавието, под нея два реда текст */
.broker-band { background: linear-gradient(180deg, #fbfcfb 0%, #f3f6f3 100%); border: 1px solid #e9ede9; }
.broker-band-track { align-items: flex-start; }
.bk-card { border: 1px solid #edf0f2; box-shadow: var(--shadow); border-radius: var(--radius); }
.bk-card-photo { padding: 22px 20px 16px; }
.bk-card-photo a { background: transparent; border-radius: 8px; overflow: hidden; }
.bk-card-photo img { width: auto; max-width: 100%; height: auto; max-height: 200px; margin: 0 auto; border-radius: 8px; object-fit: contain; }
.bk-card-photo figcaption { padding: 12px 0 0; text-align: left; font-size: 14px; line-height: 1.55; }
.bk-cap { display: block; overflow-wrap: anywhere; }
.bk-cap.is-collapsed { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.bk-card .bio-more {
  align-self: flex-start; background: none; border: none; padding: 0; margin: 8px 0 0; cursor: pointer;
  font: inherit; font-size: 14px; font-weight: 700; color: var(--green-dark);
}
.bk-card .bio-more[hidden] { display: none; }
.bk-card-info .bk-bio.is-collapsed { max-height: 9.9em; }
/* Писмо на клиента от 02.11.2026: малко по-тъмни букви в информацията и под снимките */
.bk-bio, .bk-card-photo figcaption { color: #374151; }
@media (max-width: 720px) {
  .bk-card-photo { padding: 18px 16px 14px; }
  .bk-card-photo img { max-height: 190px; }
}
/* В чекмеджето на телефон: квадратчето и името на един ред, дългото име се пренася само;
   по-малки отстъпи, за да има място в тясната колона */
.filters.fd-on .fd-pane .check-list.loc-tree label { flex-wrap: nowrap; }
.filters.fd-on .loc-body { padding-left: 12px; }
.filters.fd-on .loc-body .fd-districts { margin-left: 4px !important; padding-left: 8px !important; }
.filters.fd-on .loc-subs { margin-left: 14px; padding-left: 8px; }
.filters.fd-on .loc-oblast-empty { padding-left: 23px; }

/* Затвореното мобилно меню стои вдясно извън екрана, а сянката му влизаше 60 px в
   страницата като сиво преливане по десния край на телефон */
.drawer:not(.open) { box-shadow: none; }

/* ===== "Колко струва моят имот?" (/ocenka-na-imot, 29.10.2026) ===== */
.page-head.ph-ocenka { --ph-img: url('bg/uslugi.webp'); }
@media (max-width: 720px) { .page-head.ph-ocenka { --ph-img: url('bg/uslugi-m.webp'); } }
.vf-section { padding-top: 28px; }
.vf-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); gap: 28px; align-items: start; }
.vf-card { background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 28px 30px 24px; box-shadow: var(--shadow); min-width: 0; }
.vf-title { font-size: 22px; font-weight: 800; line-height: 1.25; margin: 0 0 16px; }
.vf-title-contact { margin-top: 26px; padding-top: 24px; border-top: 1px solid var(--border); }
.vf-label { font-size: 13px; font-weight: 600; margin-bottom: 8px; color: var(--dark); }
.vf-label .req, .vf-card .req { color: #ef4444; }
.vf-card .vf-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 18px; margin-top: 16px; }
.vf-card .form-field input, .vf-card .form-field select, .vf-card .form-field textarea { width: 100%; min-width: 0; }
.vf-card .form-field select:disabled { background: var(--gray-light); color: var(--gray); }
.vf-optional .vf-req-district { display: none; }

/* Вид имот - четири карти с икона */
.vf-types { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.vf-type {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
  min-height: 86px; padding: 12px 6px; border: 1.5px solid var(--border); border-radius: 12px; background: #fff;
  font-size: 14px; font-weight: 600; color: var(--dark); text-align: center; cursor: pointer; transition: border-color .15s, background .15s;
}
.vf-type input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.vf-type svg { width: 26px; height: 26px; stroke-width: 1.7; color: var(--dark-2); }
.vf-type:hover { border-color: var(--green); }
.vf-type:has(input:checked) { border-color: var(--green); background: var(--green-light); color: var(--green-dark); }
.vf-type:has(input:checked) svg { color: var(--green-dark); }
.vf-type:has(input:focus-visible) { outline: 2px solid var(--green-dark); outline-offset: 2px; }

/* Полета с икона отляво */
.vf-ico { position: relative; }
.vf-ico > svg { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); width: 18px; height: 18px; color: var(--gray); pointer-events: none; }
.vf-ico > input, .vf-ico > select { padding-left: 44px !important; }

/* Още детайли и снимки */
.vf-more { margin-top: 18px; border: 1px solid var(--border); border-radius: 12px; background: #f7f9f6; }
.vf-more > summary { display: flex; align-items: center; gap: 10px; padding: 13px 16px; cursor: pointer; list-style: none; font-size: 14px; font-weight: 600; }
.vf-more > summary::-webkit-details-marker { display: none; }
.vf-more > summary svg { width: 20px; height: 20px; color: #fff; fill: var(--green); flex: none; }
.vf-more > summary::after {
  content: ""; margin-left: auto; width: 8px; height: 8px; border: solid var(--gray); border-width: 0 2px 2px 0;
  transform: rotate(45deg); transition: transform .15s; flex: none;
}
.vf-more[open] > summary::after { transform: rotate(-135deg); }
.vf-card .vf-more-body { margin-top: 0; padding: 0 16px 16px; }
.vf-drop {
  position: relative; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 18px 12px;
  border: 1.5px dashed #c9d3c4; border-radius: 10px; background: #fff; text-align: center; cursor: pointer;
}
.vf-drop:hover, .vf-drop:focus-within { border-color: var(--green); }
.vf-drop svg { width: 26px; height: 26px; color: var(--green-dark); }
.vf-drop-text { font-size: 14px; font-weight: 600; }
.vf-drop small { font-size: 12px; color: var(--gray); }
.vf-drop input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.vf-thumbs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.vf-thumbs:empty { display: none; }
.vf-thumb { position: relative; width: 72px; height: 72px; border-radius: 8px; overflow: hidden; border: 1px solid var(--border); background: var(--gray-light); }
.vf-thumb img { width: 100%; height: 100%; object-fit: cover; }
.vf-thumb-rm {
  position: absolute; top: 3px; right: 3px; width: 22px; height: 22px; border-radius: 50%; background: rgba(26, 29, 36, .75);
  color: #fff; font-size: 15px; line-height: 22px; text-align: center; padding: 0;
}
.vf-thumbs-note { flex-basis: 100%; font-size: 12.5px; color: var(--gray); margin: 0; }

/* Съгласие, бутон, бележка */
.vf-consent { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-start; margin-top: 20px; font-size: 14px; }
.vf-consent input { width: 18px; height: 18px; margin-top: 2px; flex: none; accent-color: var(--green); }
.vf-consent label { flex: 1; min-width: 0; cursor: pointer; }
.vf-consent a { color: var(--green-dark); text-decoration: underline; }
.vf-consent .field-error { flex-basis: 100%; }
.vf-submit { margin-top: 18px; gap: 10px; }
.vf-submit svg { width: 18px; height: 18px; }
.vf-submit.is-busy { opacity: .7; cursor: progress; }
.vf-hint { margin-top: 10px; text-align: center; font-size: 13px; color: var(--gray); }
.vf-success { display: flex; gap: 14px; align-items: flex-start; padding: 18px 20px; background: var(--green-light); border: 1px solid var(--green); border-radius: 12px; color: var(--green-dark); }
.vf-success svg { width: 28px; height: 28px; flex: none; }
.vf-success strong { display: block; font-size: 16px; }
.vf-success span { display: block; margin-top: 4px; color: var(--dark-2); font-size: 14px; }
.vf-success-links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }

/* Вдясно - снимка и "Какво следва?" */
.vf-side { display: flex; flex-direction: column; gap: 20px; min-width: 0; position: sticky; top: 100px; }
.vf-photo { border-radius: 16px; overflow: hidden; aspect-ratio: 16 / 10; border: 1px solid var(--border); background: var(--gray-light); }
.vf-photo img { width: 100%; height: 100%; object-fit: cover; }
.vf-next { background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 24px 26px; box-shadow: var(--shadow); }
.vf-next h2 { font-size: 22px; font-weight: 800; margin: 0 0 18px; }
.vf-steps { list-style: none; margin: 0; padding: 0; }
.vf-steps li { position: relative; display: flex; gap: 16px; padding-bottom: 22px; }
.vf-steps li:last-child { padding-bottom: 0; }
.vf-steps li:not(:last-child)::before { content: ""; position: absolute; left: 17px; top: 38px; bottom: 2px; width: 2px; background: var(--green); opacity: .45; }
.vf-step-n {
  position: relative; z-index: 1; flex: none; display: flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 50%; border: 2px solid var(--green); background: #fff; font-weight: 800; color: var(--dark);
}
.vf-steps strong { display: block; font-size: 16px; line-height: 1.35; margin-top: 6px; }
.vf-steps span:not(.vf-step-n) { display: block; font-size: 14px; color: var(--gray); margin-top: 2px; }

@media (max-width: 1024px) {
  .vf-grid { grid-template-columns: minmax(0, 1fr); }
  .vf-side { position: static; }
  .vf-photo { display: none; }
}
@media (max-width: 600px) {
  .vf-card { padding: 20px 16px 18px; border-radius: 14px; }
  .vf-card .vf-form-grid { grid-template-columns: minmax(0, 1fr); }
  .vf-types { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .vf-type { min-height: 76px; }
  .vf-title { font-size: 20px; }
  .vf-next { padding: 20px 16px; }
}

/* Страница "Няма такава страница" (404, QA 30.10.2026) */
.error-page { padding: 36px 0 72px; }
.error-actions { display: flex; flex-wrap: wrap; gap: 12px; }
@media (max-width: 480px) {
  .error-actions .btn { width: 100%; justify-content: center; }
}

/* Банер за бисквитки (31.10.2026) - като на стария сайт: долу вляво, тъмен, Отказ / Приемам.
   Над долната лента с бутоните на обявата (z 100), под панелите с филтри (200-201), лайтбокса
   (1000) и известието за любими (1300). На телефон е на цялата ширина, на обява стои над лентата. */
.cookie-bar {
  position: fixed; left: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 150;
  width: 300px; max-width: calc(100vw - 32px); box-sizing: border-box; padding: 16px;
  background: var(--dark); color: #fff; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,.25);
  font-size: 14px; line-height: 1.45;
  opacity: 0; transform: translateY(12px); transition: opacity .2s, transform .2s;
}
.cookie-bar.is-on { opacity: 1; transform: none; }
.cookie-bar[hidden] { display: none; }
.cookie-bar p { margin: 0 0 12px; }
.cookie-bar a { color: var(--green); text-decoration: underline; }
.cookie-bar-actions { display: flex; gap: 8px; }
.cookie-bar-actions .btn { flex: 1; justify-content: center; min-height: 40px; padding: 9px 12px; font-size: 14px; }
.cookie-bar-actions .btn-outline { background: transparent; color: #fff; border-color: rgba(255,255,255,.35); }
.cookie-bar-actions .btn-outline:hover { border-color: #fff; color: #fff; }
@media (max-width: 720px) {
  .cookie-bar { left: 12px; right: 12px; width: auto; max-width: none; bottom: calc(12px + env(safe-area-inset-bottom)); }
  body.single-page .cookie-bar { bottom: calc(88px + env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion: reduce) { .cookie-bar { transition: none; } }