/* ==========================================================================
   BurgasTop.bg — Design System "Пристанище" (Harbour)  v2.0
   --------------------------------------------------------------------------
   Палитра, вдъхновена от Бургас: дълбоката вода на пристанището (тъмно синьо),
   Черно море (тюркоаз), залезът над залива (корал) и розовите солници
   на Атанасовското езеро (роза за VIP).
   Шрифтове: Manrope (заглавия) + Inter (текст) — и двата с отличен кирилица.
   ========================================================================== */

/* ================== 1. TOKENS ================== */
:root {
  /* Марка */
  --ink:        #072A3F;   /* пристанищно тъмносиньо — заглавия, тъмни повърхности */
  --ink-700:    #0F4059;
  --ink-500:    #4A6B80;   /* приглушен текст */
  --ink-300:    #8FA7B5;
  --ink-100:    #C9D8E0;

  --sea:        #0D7490;   /* черноморско тюркоазено — основен бранд цвят */
  --sea-600:    #0A5C74;
  --sea-400:    #1D9BB8;
  --sea-100:    #CDEAF1;
  --sea-50:     #EAF6F9;

  --signal:     #FF5A2C;   /* залез над залива — главен CTA */
  --signal-600: #E8431A;
  --signal-50:  #FFF1EC;

  --salt:       #E4467A;   /* розови солници — VIP */
  --salt-50:    #FDEDF3;
  --gold:       #F5A524;   /* TOP */
  --gold-50:    #FEF6E7;
  --kelp:       #12A15E;   /* успех / верифициран / обаждане */
  --kelp-50:    #E7F7EF;
  --alert:      #DC2B2B;
  --alert-50:   #FDECEC;

  /* Повърхности */
  --paper:      #F2F6F9;   /* фон на страницата — студен, „морска мъгла" */
  --surface:    #FFFFFF;
  --surface-2:  #F8FBFC;
  --line:       #DEE8ED;
  --line-soft:  #EDF3F6;

  /* Съвместимост със стария код (не пипай) */
  --primary: var(--sea);
  --primary-dark: var(--sea-600);
  --primary-light: var(--sea-400);
  --primary-bg: var(--sea-50);
  --accent: var(--sea-400);
  --purple: var(--salt);
  --green: var(--kelp);
  --red: var(--alert);
  --dark: var(--ink);
  --text: #143246;
  --text-muted: var(--ink-500);
  --border: var(--line);
  --bg: var(--paper);
  --white: var(--surface);

  /* Сенки — със син оттенък, за да пасват на палитрата */
  --shadow-xs: 0 1px 2px rgba(7,42,63,.06);
  --shadow:    0 1px 3px rgba(7,42,63,.08), 0 1px 2px rgba(7,42,63,.04);
  --shadow-md: 0 4px 12px rgba(7,42,63,.08), 0 2px 4px rgba(7,42,63,.04);
  --shadow-lg: 0 12px 32px rgba(7,42,63,.12), 0 4px 8px rgba(7,42,63,.06);
  --shadow-xl: 0 24px 56px rgba(7,42,63,.16);
  --ring:      0 0 0 3px rgba(13,116,144,.22);

  /* Радиуси */
  --r-xs: 6px;
  --r-sm: 10px;
  --r:    14px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-full: 999px;
  --radius: var(--r);
  --radius-sm: var(--r-sm);
  --radius-lg: var(--r-lg);

  /* Шрифтове */
  --font-display: 'Manrope', 'Inter', system-ui, -apple-system, sans-serif;
  --font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* Оформление */
  --header-h: 68px;
  --max-w: 1560px;
  --sidebar-w: 288px;
  --gap: 20px;

  /* Преходи */
  --t-fast: .15s cubic-bezier(.4,0,.2,1);
  --t: .25s cubic-bezier(.4,0,.2,1);
  --t-slow: .4s cubic-bezier(.16,1,.3,1);
}

/* ================== 2. RESET ================== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-h) + 16px);
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font-body);
  color: var(--text);
  background: var(--paper);
  line-height: 1.6;
  font-size: 15px;
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "cv02","cv03","cv04","cv11";
}

a { color: var(--sea); text-decoration: none; transition: color var(--t-fast); }
a:hover { color: var(--sea-600); }
img, svg, video { max-width: 100%; height: auto; display: block; }
ul, ol { list-style: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { background: none; border: 0; cursor: pointer; }
table { border-collapse: collapse; width: 100%; }

::selection { background: var(--sea-100); color: var(--ink); }

:focus-visible {
  outline: 2px solid var(--sea);
  outline-offset: 2px;
  border-radius: 4px;
}

/* Скролбар */
@supports (scrollbar-width: thin) {
  * { scrollbar-width: thin; scrollbar-color: var(--ink-100) transparent; }
}
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--ink-100); border-radius: 99px; border: 3px solid var(--paper); }
::-webkit-scrollbar-thumb:hover { background: var(--ink-300); }

/* Достъпност: намалена анимация */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ================== 3. TYPOGRAPHY ================== */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  color: var(--ink);
  line-height: 1.18;
  letter-spacing: -.02em;
  font-weight: 800;
}
h1 { font-size: clamp(1.6rem, 1.1rem + 2.2vw, 2.5rem); }
h2 { font-size: clamp(1.25rem, 1rem + 1.3vw, 1.85rem); font-weight: 800; }
h3 { font-size: clamp(1.05rem, .95rem + .5vw, 1.25rem); font-weight: 700; letter-spacing: -.01em; }
h4 { font-size: 1rem; font-weight: 700; }
p { margin: 0; }

.eyebrow {
  font-family: var(--font-display);
  font-size: .7rem; font-weight: 800;
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--sea);
}

/* „Пристанищна черта" — повтарящ се структурен елемент.
   Цветът кодира ранг: тюркоаз = стандартно, злато = TOP, роза = VIP. */
.rule::after {
  content: ""; display: block;
  width: 44px; height: 3px; border-radius: 2px;
  margin-top: 10px;
  background: var(--sea);
}
.rule-gold::after { background: var(--gold); }
.rule-salt::after { background: var(--salt); }
.rule-signal::after { background: var(--signal); }

.num { font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; }

/* ================== 4. LAYOUT ================== */
.container {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 20px;
  width: 100%;
}

.page-wrapper {
  display: grid;
  grid-template-columns: var(--sidebar-w) minmax(0, 1fr);
  gap: 28px;
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 24px 20px 56px;
  align-items: start;
}

.main-content { min-width: 0; }

.section { margin-bottom: 44px; }
.section:last-child { margin-bottom: 0; }

.section-header {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 16px; flex-wrap: wrap;
  margin-bottom: 20px;
}
.section-title {
  font-family: var(--font-display);
  font-size: clamp(1.15rem, 1rem + .7vw, 1.55rem);
  font-weight: 800; color: var(--ink);
  display: flex; align-items: center; gap: 10px;
  letter-spacing: -.02em;
  position: relative;
}
.section-title::after {
  content: ""; position: absolute; left: 0; bottom: -9px;
  width: 44px; height: 3px; border-radius: 2px; background: var(--sea);
}
.section-title.t-gold::after { background: var(--gold); }
.section-title.t-salt::after { background: var(--salt); }
.section-title.t-signal::after { background: var(--signal); }
.section-title i { font-size: .9em; }

@media (max-width: 1180px) {
  .page-wrapper { grid-template-columns: 1fr; padding-top: 16px; }
  .sidebar { display: none; }
}

/* ================== 5. HEADER ================== */
.site-header {
  background: rgba(255,255,255,.88);
  backdrop-filter: saturate(180%) blur(14px);
  -webkit-backdrop-filter: saturate(180%) blur(14px);
  border-bottom: 1px solid var(--line);
  position: sticky; top: 0; z-index: 200;
}
.site-header::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 3px;
  background: linear-gradient(90deg, var(--sea) 0%, var(--sea-400) 34%, var(--gold) 67%, var(--signal) 100%);
}

.header-inner {
  display: flex; align-items: center; gap: 18px;
  height: var(--header-h);
  padding: 0 20px;
  max-width: var(--max-w); margin: 0 auto;
}

.logo { display: flex; align-items: center; flex-shrink: 0; font-family: var(--font-display); font-size: 1.4rem; font-weight: 800; white-space: nowrap; }
.logo img { height: 40px; width: auto; object-fit: contain; }
.logo-now { color: var(--sea); }
.logo-bg { color: var(--ink); }
.logo-dot { color: var(--ink-300); font-size: 1rem; }

/* Търсачка в хедъра */
.header-search {
  flex: 1; max-width: 520px;
  display: flex; align-items: center; gap: 8px;
  background: var(--surface-2);
  border: 1.5px solid var(--line);
  border-radius: var(--r-full);
  padding: 0 6px 0 16px; height: 42px;
  transition: border-color var(--t-fast), box-shadow var(--t-fast), background var(--t-fast);
}
.header-search:focus-within { border-color: var(--sea); background: var(--surface); box-shadow: var(--ring); }
.header-search i { color: var(--ink-300); font-size: .9rem; }
.header-search input { flex: 1; border: 0; background: none; outline: none; font-size: .9rem; min-width: 0; }
.header-search input::placeholder { color: var(--ink-300); }
.header-search button {
  background: var(--sea); color: #fff; height: 32px; padding: 0 16px;
  border-radius: var(--r-full); font-size: .82rem; font-weight: 700;
  transition: background var(--t-fast);
}
.header-search button:hover { background: var(--sea-600); }

.main-nav { display: flex; gap: 4px; margin-left: auto; }
.main-nav a {
  color: var(--ink-500); font-weight: 600; font-size: .875rem;
  padding: 8px 12px; border-radius: var(--r-sm);
  transition: background var(--t-fast), color var(--t-fast);
}
.main-nav a:hover { color: var(--ink); background: var(--sea-50); }

.header-actions { display: flex; align-items: center; gap: 10px; margin-left: auto; }

.credits-badge {
  display: inline-flex; align-items: center; gap: 7px;
  background: var(--gold-50); color: #8A5A00;
  border: 1px solid #F6DFAE;
  padding: 7px 13px; border-radius: var(--r-full);
  font-size: .8rem; font-weight: 700;
  transition: transform var(--t-fast), box-shadow var(--t-fast);
}
.credits-badge:hover { color: #8A5A00; transform: translateY(-1px); box-shadow: var(--shadow); }
.credits-badge i { color: var(--gold); }

/* Икона-бутон в хедъра (любими, съобщения) */
.hicon {
  position: relative;
  width: 40px; height: 40px; border-radius: var(--r-full);
  display: grid; place-items: center;
  color: var(--ink-500); background: transparent;
  transition: background var(--t-fast), color var(--t-fast);
}
.hicon:hover { background: var(--sea-50); color: var(--sea); }
.hicon-count {
  position: absolute; top: 2px; right: 2px;
  min-width: 17px; height: 17px; padding: 0 4px;
  background: var(--signal); color: #fff;
  border-radius: 99px; border: 2px solid var(--surface);
  font-size: .62rem; font-weight: 800; line-height: 13px;
  display: grid; place-items: center;
}

/* Потребителско меню */
.user-menu { position: relative; }
.user-menu-btn {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 12px 6px 8px; border-radius: var(--r-full);
  border: 1px solid var(--line); background: var(--surface);
  font-size: .85rem; font-weight: 600; color: var(--ink);
  transition: border-color var(--t-fast), box-shadow var(--t-fast);
}
.user-menu-btn:hover { border-color: var(--sea); box-shadow: var(--shadow-xs); }
.user-menu-btn > i:first-child { font-size: 1.35rem; color: var(--sea); }
.user-menu-btn > i:last-child { font-size: .65rem; color: var(--ink-300); transition: transform var(--t-fast); }
.user-menu.open .user-menu-btn > i:last-child { transform: rotate(180deg); }

.notif-bubble {
  min-width: 18px; height: 18px; padding: 0 5px;
  background: var(--signal); color: #fff; border-radius: 99px;
  font-size: .65rem; font-weight: 800; display: grid; place-items: center;
}

.user-dropdown {
  position: absolute; right: 0; top: calc(100% + 10px);
  min-width: 244px; background: var(--surface);
  border: 1px solid var(--line); border-radius: var(--r);
  box-shadow: var(--shadow-lg); padding: 7px; z-index: 300;
  animation: dropIn .18s cubic-bezier(.16,1,.3,1);
}
@keyframes dropIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.user-dropdown a {
  display: flex; align-items: center; gap: 11px;
  padding: 10px 12px; border-radius: var(--r-sm);
  color: var(--text); font-size: .875rem; font-weight: 500;
  transition: background var(--t-fast), color var(--t-fast);
}
.user-dropdown a:hover { background: var(--sea-50); color: var(--sea-600); }
.user-dropdown a i { width: 17px; text-align: center; color: var(--ink-300); }
.user-dropdown a:hover i { color: var(--sea); }
.dropdown-divider { height: 1px; background: var(--line-soft); margin: 6px 4px; }

.notif-badge {
  margin-left: auto; background: var(--signal); color: #fff;
  font-size: .65rem; font-weight: 800; padding: 2px 7px; border-radius: 99px;
}
.notif-badge-green { background: var(--kelp); }

/* Мобилно меню */
.mobile-menu-btn {
  display: none;
  width: 42px; height: 42px; border-radius: var(--r-sm);
  color: var(--ink); font-size: 1.15rem;
  transition: background var(--t-fast);
}
.mobile-menu-btn:hover { background: var(--sea-50); }

.mobile-menu {
  display: none; background: var(--surface);
  border-top: 1px solid var(--line);
  max-height: 0; overflow: hidden;
  transition: max-height var(--t-slow);
}
.mobile-menu.open { max-height: 90vh; overflow-y: auto; }
.mobile-menu-inner { padding: 10px 16px 18px; display: flex; flex-direction: column; gap: 2px; }
.mobile-menu-inner a {
  display: flex; align-items: center; gap: 12px;
  padding: 13px 12px; border-radius: var(--r-sm);
  color: var(--text); font-weight: 600; font-size: .95rem;
}
.mobile-menu-inner a:active { background: var(--sea-50); }
.mobile-menu-inner a i { width: 20px; text-align: center; color: var(--sea); }
.mobile-menu-sep { height: 1px; background: var(--line-soft); margin: 8px 0; }

.mobile-only-publish { display: none; }

/* Админ лента */
.admin-nav-bar { background: var(--ink); border-top: 1px solid rgba(255,255,255,.08); }
.admin-nav-pill {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 6px 13px; border-radius: var(--r-full);
  background: rgba(255,255,255,.08); color: #DCE9F0;
  font-size: .78rem; font-weight: 600;
  transition: background var(--t-fast), color var(--t-fast);
}
.admin-nav-pill:hover { background: var(--sea); color: #fff; }

/* ================== 6. SIDEBAR ================== */
.sidebar { position: sticky; top: calc(var(--header-h) + 20px); }
.sidebar-inner {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: 18px 14px;
  box-shadow: var(--shadow-xs);
  max-height: calc(100vh - var(--header-h) - 48px);
  overflow-y: auto;
}
.sidebar-title {
  font-family: var(--font-display);
  font-size: .72rem; font-weight: 800;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--ink-500);
  display: flex; align-items: center; gap: 8px;
  padding: 0 8px 10px;
}
.sidebar-title i { color: var(--sea); font-size: .9rem; }

.cat-menu { display: flex; flex-direction: column; gap: 1px; }
.cat-menu a {
  display: flex; align-items: center; gap: 11px;
  padding: 9px 10px; border-radius: var(--r-sm);
  color: var(--text); font-size: .855rem; font-weight: 500;
  transition: background var(--t-fast), color var(--t-fast);
}
.cat-menu a:hover { background: var(--sea-50); color: var(--sea-600); }
.cat-menu a.active { background: var(--sea); color: #fff; font-weight: 600; }
.cat-menu a.active em, .cat-menu a.active i { color: #fff; }
.cat-menu i { width: 17px; text-align: center; color: var(--sea); font-size: .9rem; flex-shrink: 0; }
.cat-menu span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cat-menu em {
  font-style: normal; font-size: .7rem; font-weight: 700;
  color: var(--ink-300); background: var(--surface-2);
  padding: 1px 7px; border-radius: 99px;
  font-variant-numeric: tabular-nums;
}

/* ================== 7. BUTTONS ================== */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 11px 20px;
  border-radius: var(--r-sm);
  font-family: var(--font-display);
  font-size: .875rem; font-weight: 700;
  line-height: 1; white-space: nowrap;
  border: 1.5px solid transparent;
  cursor: pointer; text-align: center;
  transition: transform var(--t-fast), box-shadow var(--t-fast), background var(--t-fast), border-color var(--t-fast), color var(--t-fast);
}
.btn:active { transform: translateY(1px); }
.btn:disabled, .btn.disabled { opacity: .5; cursor: not-allowed; pointer-events: none; }

.btn-primary { background: var(--sea); color: #fff; box-shadow: 0 1px 2px rgba(7,42,63,.12); }
.btn-primary:hover { background: var(--sea-600); color: #fff; box-shadow: 0 4px 14px rgba(13,116,144,.3); transform: translateY(-1px); }

/* Основен CTA — залезен корал. Използва се за „Публикувай", „Обади се" и т.н. */
.btn-cta { background: var(--signal); color: #fff; box-shadow: 0 1px 2px rgba(232,67,26,.2); }
.btn-cta:hover { background: var(--signal-600); color: #fff; box-shadow: 0 6px 18px rgba(255,90,44,.34); transform: translateY(-1px); }

.btn-call { background: var(--kelp); color: #fff; }
.btn-call:hover { background: #0C8A4E; color: #fff; box-shadow: 0 6px 18px rgba(18,161,94,.3); transform: translateY(-1px); }

.btn-outline { background: transparent; color: var(--sea); border-color: var(--sea-100); }
.btn-outline:hover { background: var(--sea-50); border-color: var(--sea); color: var(--sea-600); }

.btn-ghost { background: transparent; color: var(--ink-500); }
.btn-ghost:hover { background: var(--surface-2); color: var(--ink); }

.btn-dark { background: var(--ink); color: #fff; }
.btn-dark:hover { background: var(--ink-700); color: #fff; }

.btn-white { background: #fff; color: var(--sea-600); }
.btn-white:hover { background: #F2FAFC; color: var(--sea-600); transform: translateY(-1px); box-shadow: var(--shadow-md); }

.btn-outline-white { background: rgba(255,255,255,.08); color: #fff; border-color: rgba(255,255,255,.45); }
.btn-outline-white:hover { background: rgba(255,255,255,.18); color: #fff; border-color: #fff; }

.btn-success { background: var(--kelp); color: #fff; }
.btn-success:hover { background: #0C8A4E; color: #fff; }
.btn-danger { background: var(--alert); color: #fff; }
.btn-danger:hover { background: #B91C1C; color: #fff; }
.btn-warning { background: var(--gold); color: #452B00; }
.btn-warning:hover { background: #E09612; color: #452B00; }
.btn-facebook, .btn-fb { background: #1877F2; color: #fff; }
.btn-facebook:hover, .btn-fb:hover { background: #145FC4; color: #fff; }
.btn-google { background: #fff; color: #33404A; border-color: var(--line); }
.btn-google:hover { background: var(--surface-2); color: #33404A; border-color: var(--ink-100); }

.btn-xs { padding: 6px 11px; font-size: .74rem; gap: 5px; border-radius: var(--r-xs); }
.btn-sm { padding: 8px 15px; font-size: .8rem; gap: 6px; }
.btn-lg { padding: 15px 30px; font-size: 1rem; border-radius: var(--r); }
.btn-block { display: flex; width: 100%; }
.btn-round { border-radius: var(--r-full); }

/* ================== 8. FORMS ================== */
.form-group { margin-bottom: 18px; }
.form-group > label,
.form-label {
  display: block;
  font-family: var(--font-display);
  font-size: .82rem; font-weight: 700; color: var(--ink);
  margin-bottom: 7px;
}
.form-group > label small { font-weight: 500; color: var(--ink-300); font-size: .76rem; }
.req { color: var(--signal); font-weight: 800; }

.form-control {
  width: 100%;
  padding: 12px 14px;
  border: 1.5px solid var(--line);
  border-radius: var(--r-sm);
  background: var(--surface);
  font-size: .92rem; color: var(--text);
  transition: border-color var(--t-fast), box-shadow var(--t-fast), background var(--t-fast);
}
.form-control::placeholder { color: var(--ink-300); }
.form-control:hover { border-color: var(--ink-100); }
.form-control:focus { outline: none; border-color: var(--sea); box-shadow: var(--ring); }
.form-control:disabled { background: var(--surface-2); color: var(--ink-300); cursor: not-allowed; }
.form-control.is-invalid { border-color: var(--alert); box-shadow: 0 0 0 3px rgba(220,43,43,.14); }
textarea.form-control { min-height: 130px; resize: vertical; line-height: 1.65; }
.form-control-sm { padding: 8px 11px; font-size: .84rem; border-radius: var(--r-xs); }

select.form-control {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%234A6B80' d='M1.4 0 6 4.6 10.6 0 12 1.4 6 7.4 0 1.4z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 38px;
  cursor: pointer;
}

.form-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 16px; }
.form-row-between { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }

.form-section {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: 24px;
  margin-bottom: 20px;
}
.form-section > h3 {
  font-size: 1.05rem; margin-bottom: 18px; padding-bottom: 12px;
  border-bottom: 1px solid var(--line-soft);
  display: flex; align-items: center; gap: 9px;
}
.form-section > h3 i { color: var(--sea); }
.form-sub { font-size: .84rem; color: var(--ink-500); margin: -10px 0 16px; }

.form-hint { display: block; font-size: .78rem; color: var(--ink-500); margin-top: 5px; line-height: 1.5; }
.form-hint i { color: var(--sea-400); }
.form-error { display: block; font-size: .78rem; color: var(--alert); font-weight: 600; margin-top: 5px; }

.char-count {
  display: block; text-align: right;
  font-size: .72rem; color: var(--ink-300);
  margin-top: 5px; font-variant-numeric: tabular-nums;
}
.char-count.warn { color: var(--gold); font-weight: 700; }
.char-count.over { color: var(--alert); font-weight: 700; }

.form-check { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.form-check input[type="checkbox"], .form-check input[type="radio"] { width: 18px; height: 18px; accent-color: var(--sea); cursor: pointer; }

.input-icon { position: relative; }
.input-icon i { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--ink-300); pointer-events: none; }
.input-icon .form-control { padding-left: 40px; }

.form-actions {
  display: flex; gap: 12px; flex-wrap: wrap;
  padding-top: 20px; margin-top: 4px;
  border-top: 1px solid var(--line-soft);
}

/* Превключвател */
.switch { position: relative; display: inline-block; width: 44px; height: 25px; flex-shrink: 0; }
.switch input { opacity: 0; width: 0; height: 0; }
.switch-track {
  position: absolute; inset: 0; cursor: pointer;
  background: var(--ink-100); border-radius: 99px;
  transition: background var(--t);
}
.switch-track::before {
  content: ""; position: absolute;
  height: 19px; width: 19px; left: 3px; bottom: 3px;
  background: #fff; border-radius: 50%;
  box-shadow: var(--shadow-xs);
  transition: transform var(--t);
}
.switch input:checked + .switch-track { background: var(--kelp); }
.switch input:checked + .switch-track::before { transform: translateX(19px); }

/* ================== 9. FLASH СЪОБЩЕНИЯ ================== */
.flash {
  position: fixed; top: calc(var(--header-h) + 14px); left: 50%;
  transform: translateX(-50%);
  z-index: 500; width: min(560px, calc(100% - 32px));
  animation: flashIn .35s cubic-bezier(.16,1,.3,1);
}
@keyframes flashIn { from { opacity: 0; transform: translate(-50%, -14px); } to { opacity: 1; transform: translate(-50%, 0); } }
.flash .container {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 18px; border-radius: var(--r);
  box-shadow: var(--shadow-lg);
  font-size: .9rem; font-weight: 600;
  border: 1px solid;
  background: var(--surface);
}
.flash i { font-size: 1.1rem; flex-shrink: 0; }
.flash-success .container { background: var(--kelp-50); border-color: #A7E3C5; color: #0A6B3E; }
.flash-success i { color: var(--kelp); }
.flash-error .container { background: var(--alert-50); border-color: #F5C0C0; color: #9B1C1C; }
.flash-error i { color: var(--alert); }
.flash-warning .container { background: var(--gold-50); border-color: #F6DFAE; color: #8A5A00; }
.flash-warning i { color: var(--gold); }
.flash-close {
  margin-left: auto; font-size: 1.4rem; line-height: 1;
  color: inherit; opacity: .5; transition: opacity var(--t-fast);
}
.flash-close:hover { opacity: 1; }

/* ==========================================================================
   10. ОБЯВНА КАРТА  —  подписният елемент на BurgasTop
   --------------------------------------------------------------------------
   Един компонент, два режима: .lc-grid (плочки) и .lc-list (редове).
   Детайлите: цветна лента за ранг отгоре, галерия със сегментен индикатор
   вътре в снимката, „хартиен" ценови етикет, който преминава през ръба на
   снимката, и лента за бърз контакт, която изплува при hover.
   ========================================================================== */

.listings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(268px, 1fr));
  gap: 22px;
}
.listings-list { display: flex; flex-direction: column; gap: 16px; }

/* ---- Обща база ---- */
.lc {
  position: relative;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  overflow: hidden;
  display: flex; flex-direction: column;
  transition: transform var(--t), box-shadow var(--t), border-color var(--t);
  isolation: isolate;
}
.lc::before {           /* лента за ранг */
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: var(--sea-100); z-index: 3;
}
.lc:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: var(--sea-100); }

.lc.is-top::before  { background: linear-gradient(90deg, var(--gold), #FFD37A); }
.lc.is-vip::before  { background: linear-gradient(90deg, var(--salt), #F79BBB); }
.lc.is-boost::before{ background: linear-gradient(90deg, var(--signal), #FF9B7A); }
.lc.is-top    { border-color: #F6DFAE; }
.lc.is-vip    { border-color: #F8CFDE; }

/* ---- Медия / галерия ---- */
.lc-media {
  position: relative; display: block;
  aspect-ratio: 16 / 10;
  background: linear-gradient(135deg, var(--sea-50), #E4EEF3);
  overflow: hidden;
}
.lc-media img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .6s cubic-bezier(.16,1,.3,1), opacity var(--t-fast);
}
.lc:hover .lc-media img { transform: scale(1.045); }
.lc-media .lc-slide { position: absolute; inset: 0; opacity: 0; transition: opacity .2s ease; }
.lc-media .lc-slide.active { opacity: 1; }

/* Невидими зони за смяна на снимка при hover (desktop) */
.lc-zones { position: absolute; inset: 0; display: flex; z-index: 2; }
.lc-zones span { flex: 1; cursor: pointer; }

/* Сегментен индикатор — като „stories" */
.lc-dots {
  position: absolute; top: 9px; left: 9px; right: 9px;
  display: flex; gap: 3px; z-index: 3;
  opacity: 0; transition: opacity var(--t-fast);
}
.lc:hover .lc-dots, .lc-media:focus-within .lc-dots { opacity: 1; }
.lc-dots i {
  flex: 1; height: 3px; border-radius: 2px;
  background: rgba(255,255,255,.45);
  box-shadow: 0 1px 2px rgba(0,0,0,.25);
  transition: background var(--t-fast);
}
.lc-dots i.on { background: #fff; }

/* Брой снимки */
.lc-count {
  position: absolute; bottom: 10px; left: 10px; z-index: 3;
  display: inline-flex; align-items: center; gap: 5px;
  background: rgba(7,42,63,.72); backdrop-filter: blur(6px);
  color: #fff; font-size: .68rem; font-weight: 700;
  padding: 4px 9px; border-radius: var(--r-full);
}

/* Ъглов флаг за ранг */
.lc-flag {
  position: absolute; top: 11px; left: 0; z-index: 4;
  display: inline-flex; align-items: center; gap: 5px;
  padding: 5px 11px 5px 9px;
  font-family: var(--font-display);
  font-size: .66rem; font-weight: 800;
  letter-spacing: .09em; text-transform: uppercase;
  color: #fff;
  border-radius: 0 var(--r-xs) var(--r-xs) 0;
  box-shadow: 0 2px 8px rgba(7,42,63,.28);
}
.lc-flag.f-top   { background: linear-gradient(100deg, #C97C00, var(--gold)); }
.lc-flag.f-vip   { background: linear-gradient(100deg, #B82C5C, var(--salt)); }
.lc-flag.f-boost { background: linear-gradient(100deg, var(--signal-600), var(--signal)); top: auto; bottom: 11px; }

/* Действия върху снимката */
.lc-tools {
  position: absolute; top: 9px; right: 9px; z-index: 4;
  display: flex; flex-direction: column; gap: 6px;
  opacity: 0; transform: translateX(6px);
  transition: opacity var(--t), transform var(--t);
}
.lc:hover .lc-tools { opacity: 1; transform: none; }
.lc-tool {
  width: 34px; height: 34px; border-radius: 50%;
  display: grid; place-items: center;
  background: rgba(255,255,255,.94); backdrop-filter: blur(6px);
  color: var(--ink-500); font-size: .82rem;
  box-shadow: var(--shadow);
  transition: background var(--t-fast), color var(--t-fast), transform var(--t-fast);
}
.lc-tool:hover { background: #fff; color: var(--sea); transform: scale(1.08); }
.lc-tool.is-fav { color: var(--signal); }
.lc-tool.is-fav i { font-weight: 900; }

/* „Хартиен" ценови етикет — преминава през долния ръб на снимката */
.lc-tag {
  position: absolute; right: 12px; bottom: -15px; z-index: 5;
  display: inline-flex; align-items: center; gap: 7px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-left: 3px solid var(--signal);
  border-radius: var(--r-xs);
  padding: 7px 12px 7px 10px;
  font-family: var(--font-display);
  font-size: .95rem; font-weight: 800; color: var(--ink);
  box-shadow: var(--shadow-md);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.lc-tag::before {   /* дупчица като на хартиен етикет */
  content: ""; width: 5px; height: 5px; border-radius: 50%;
  background: var(--line); flex-shrink: 0;
}
.lc-tag small { font-size: .68rem; font-weight: 600; color: var(--ink-300); }

/* ---- Тяло ---- */
.lc-body { padding: 24px 16px 14px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.lc-grid .lc-body { padding-top: 26px; }

.lc-eyebrow {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  font-size: .72rem; font-weight: 700; color: var(--sea);
  text-transform: uppercase; letter-spacing: .04em;
}
.lc-eyebrow i { font-size: .78rem; }
.lc-eyebrow .sep { color: var(--ink-100); }
.lc-eyebrow .place { color: var(--ink-500); font-weight: 600; text-transform: none; letter-spacing: 0; }

.lc-title {
  font-family: var(--font-display);
  font-size: 1.02rem; font-weight: 800; line-height: 1.32;
  letter-spacing: -.015em;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
.lc-title a { color: var(--ink); }
.lc-title a:hover { color: var(--sea); }
.lc-verified { color: var(--kelp); font-size: .82em; margin-left: 3px; vertical-align: 1px; }

.lc-desc {
  font-size: .85rem; color: var(--ink-500); line-height: 1.6;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
.lc-list .lc-desc { -webkit-line-clamp: 3; }

/* Характеристики (кв.м, легла, особености) */
.lc-specs { display: flex; flex-wrap: wrap; gap: 6px; }
.lc-spec {
  display: inline-flex; align-items: center; gap: 5px;
  background: var(--surface-2); border: 1px solid var(--line-soft);
  padding: 3px 9px; border-radius: var(--r-xs);
  font-size: .74rem; font-weight: 600; color: var(--ink-500);
}
.lc-spec i { color: var(--sea-400); font-size: .72rem; }
.lc-spec-more { color: var(--sea); font-weight: 700; background: var(--sea-50); border-color: var(--sea-100); }

/* Рейтинг */
.lc-rating { display: inline-flex; align-items: center; gap: 6px; font-size: .78rem; }
.lc-stars { display: inline-flex; gap: 1px; color: var(--gold); font-size: .68rem; }
.lc-stars .off { color: #DDE5EA; }
.lc-rating b { font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; }
.lc-rating span { color: var(--ink-300); }
.lc-rating.none { color: var(--ink-300); font-style: italic; font-size: .74rem; }

/* ---- Долна лента ---- */
.lc-foot {
  margin-top: auto;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 10px 16px;
  border-top: 1px solid var(--line-soft);
  background: var(--surface-2);
}
.lc-meta { display: flex; align-items: center; gap: 12px; font-size: .73rem; color: var(--ink-300); }
.lc-meta span { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.lc-meta i { font-size: .74rem; }

/* Бърз контакт — изплува при hover в grid, винаги видим в list */
.lc-quick { display: flex; gap: 6px; }
.lc-quick .btn { padding: 7px 12px; font-size: .74rem; border-radius: var(--r-xs); }
.lc-grid .lc-quick { opacity: 0; transform: translateY(3px); transition: opacity var(--t), transform var(--t); }
.lc-grid:hover .lc-quick { opacity: 1; transform: none; }

/* ---- Режим „ред" (list) ---- */
.lc-list { flex-direction: row; align-items: stretch; }
.lc-list .lc-media { width: 292px; flex-shrink: 0; aspect-ratio: auto; }
.lc-list .lc-tag { bottom: 12px; right: -18px; }
.lc-list .lc-body { padding: 16px 20px 12px; }
.lc-list .lc-title { font-size: 1.14rem; -webkit-line-clamp: 2; }
.lc-list .lc-foot { border-top: 1px solid var(--line-soft); background: transparent; padding: 10px 20px; }
.lc-list-wrap { display: flex; flex-direction: column; flex: 1; min-width: 0; }

@media (max-width: 720px) {
  .lc-list { flex-direction: column; }
  .lc-list .lc-media { width: 100%; aspect-ratio: 16/10; }
  .lc-list .lc-tag { right: 12px; bottom: -15px; }
  .lc-list .lc-body { padding-top: 26px; }
}

/* Превключвател grid/list */
.view-toggle { display: inline-flex; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 3px; gap: 2px; }
.view-toggle button {
  width: 34px; height: 30px; border-radius: var(--r-xs);
  color: var(--ink-300); font-size: .85rem;
  display: grid; place-items: center;
  transition: background var(--t-fast), color var(--t-fast);
}
.view-toggle button.active { background: var(--surface); color: var(--sea); box-shadow: var(--shadow-xs); }

/* ---- Скелет при зареждане ---- */
.lc-skeleton { pointer-events: none; }
.sk { background: linear-gradient(90deg, #EDF2F5 25%, #F6F9FB 50%, #EDF2F5 75%); background-size: 200% 100%; animation: skWave 1.4s infinite; border-radius: var(--r-xs); }
@keyframes skWave { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }

/* ==========================================================================
   11. СТАР КАРТОВ КОМПОНЕНТ (.lc2) — препокрит с новия стил,
   за да изглеждат добре и още неактуализираните изгледи.
   ========================================================================== */
.lc2 {
  position: relative;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  overflow: hidden;
  transition: transform var(--t), box-shadow var(--t), border-color var(--t);
}
.lc2::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--sea-100); }
.lc2:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); border-color: var(--sea-100); }
.lc2.boosted::before { background: linear-gradient(90deg, var(--signal), #FF9B7A); }
.lc2-main { display: flex; gap: 0; }
.lc2-img-wrap { width: 268px; flex-shrink: 0; overflow: hidden; background: var(--sea-50); }
.lc2-img-wrap img { width: 100%; height: 100%; min-height: 178px; object-fit: cover; transition: transform .6s cubic-bezier(.16,1,.3,1); }
.lc2:hover .lc2-img-wrap img { transform: scale(1.04); }
.lc2-content { padding: 18px 20px; flex: 1; min-width: 0; }
.lc2-title { font-family: var(--font-display); font-size: 1.1rem; font-weight: 800; line-height: 1.3; letter-spacing: -.015em; margin-bottom: 7px; }
.lc2-title a { color: var(--ink); }
.lc2-title a:hover { color: var(--sea); }
.lc2-desc { font-size: .855rem; color: var(--ink-500); line-height: 1.62; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.lc2-price-row { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 11px; }
.lc2-price {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--font-display); font-weight: 800; font-size: 1rem; color: var(--ink);
  background: var(--signal-50); border: 1px solid #FFD6C7; border-left: 3px solid var(--signal);
  padding: 5px 11px; border-radius: var(--r-xs); font-variant-numeric: tabular-nums;
}
.lc2-price i { color: var(--signal); font-size: .8rem; }
.lc2-area { display: inline-flex; align-items: center; gap: 6px; font-size: .82rem; font-weight: 600; color: var(--ink-500); background: var(--surface-2); border: 1px solid var(--line-soft); padding: 5px 11px; border-radius: var(--r-xs); }
.lc2-area i { color: var(--sea-400); }
.lc2-extras-bar { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 20px 12px; }
.lc2-extra-tag, .lc2-extra-item {
  display: inline-flex; align-items: center; gap: 5px;
  background: var(--sea-50); border: 1px solid var(--sea-100); color: var(--sea-600);
  font-size: .72rem; font-weight: 600; padding: 3px 9px; border-radius: var(--r-xs);
}
.lc2-extra-tag i { font-size: .62rem; color: var(--kelp); }
.lc2-extra-more { font-size: .72rem; font-weight: 700; color: var(--sea); align-self: center; }
.lc2-footer { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px 20px; border-top: 1px solid var(--line-soft); background: var(--surface-2); }
.lc2-meta { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; font-size: .74rem; color: var(--ink-300); }
.lc2-meta-item { display: inline-flex; align-items: center; gap: 5px; }
.lc2-meta-item a { color: var(--sea); font-weight: 600; }
.lc2-badge {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: var(--font-display); font-size: .64rem; font-weight: 800;
  letter-spacing: .08em; text-transform: uppercase;
  padding: 4px 10px; border-radius: var(--r-full); color: #fff;
}
.b-top   { background: linear-gradient(100deg, #C97C00, var(--gold)); }
.b-vip   { background: linear-gradient(100deg, #B82C5C, var(--salt)); }
.b-boost { background: linear-gradient(100deg, var(--signal-600), var(--signal)); }
@media (max-width: 720px) {
  .lc2-main { flex-direction: column; }
  .lc2-img-wrap { width: 100%; }
  .lc2-img-wrap img { min-height: 0; aspect-ratio: 16/10; }
}

/* ==========================================================================
   12. БЕЙДЖОВЕ
   ========================================================================== */
.badge {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: var(--font-display);
  font-size: .68rem; font-weight: 800;
  letter-spacing: .05em; text-transform: uppercase;
  padding: 4px 10px; border-radius: var(--r-full);
  background: var(--surface-2); color: var(--ink-500);
  border: 1px solid var(--line);
}
.badge-top { background: linear-gradient(100deg, #C97C00, var(--gold)); color: #fff; border-color: transparent; }
.badge-vip { background: linear-gradient(100deg, #B82C5C, var(--salt)); color: #fff; border-color: transparent; }
.badge-standard { background: var(--surface-2); color: var(--ink-500); }
.badge-verified { background: var(--kelp-50); color: #0A6B3E; border-color: #A7E3C5; }
.badge-warning { background: var(--gold-50); color: #8A5A00; border-color: #F6DFAE; }
.badge-success { background: var(--kelp-50); color: #0A6B3E; border-color: #A7E3C5; }
.badge-danger  { background: var(--alert-50); color: #9B1C1C; border-color: #F5C0C0; }
.badge-info    { background: var(--sea-50); color: var(--sea-600); border-color: var(--sea-100); }
.admin-badge { background: var(--ink); color: #fff; border-color: transparent; }
.boost-active-badge { background: var(--signal-50); color: var(--signal-600); border: 1px solid #FFD6C7; font-size: .68rem; font-weight: 700; padding: 4px 10px; border-radius: var(--r-full); display: inline-flex; align-items: center; gap: 5px; }
.validity-badge { display: inline-flex; align-items: center; gap: 5px; font-size: .72rem; font-weight: 700; padding: 3px 9px; border-radius: var(--r-full); background: var(--kelp-50); color: #0A6B3E; }
.validity-warning { background: var(--gold-50); color: #8A5A00; }
.validity-expired { background: var(--alert-50); color: #9B1C1C; }

/* ==========================================================================
   13. HERO + ТЪРСАЧКА
   ========================================================================== */
.hero-section {
  position: relative;
  background:
    radial-gradient(1200px 400px at 15% -10%, rgba(29,155,184,.30), transparent 60%),
    radial-gradient(900px 380px at 88% 0%, rgba(255,90,44,.20), transparent 58%),
    linear-gradient(165deg, #062334 0%, #0A3A52 52%, #0D5E77 100%);
  border-radius: var(--r-xl);
  padding: clamp(30px, 4.5vw, 56px) clamp(20px, 4vw, 48px);
  margin-bottom: 26px;
  overflow: hidden;
  color: #fff;
}
/* Вълнообразна текстура — намек за морето */
.hero-section::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 90px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 90' preserveAspectRatio='none'%3E%3Cpath fill='rgba(255,255,255,0.045)' d='M0 46c120-26 240-26 360 0s240 26 360 0 240-26 360 0 240 26 360 0v44H0z'/%3E%3Cpath fill='rgba(255,255,255,0.035)' d='M0 62c140-22 280-22 420 0s280 22 420 0 280-22 420 0 180 14 180 14v14H0z'/%3E%3C/svg%3E") no-repeat bottom / cover;
  pointer-events: none;
}
.hero-content { position: relative; z-index: 1; max-width: 940px; }

.hero-badge {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(255,255,255,.13);
  border: 1px solid rgba(255,255,255,.24);
  backdrop-filter: blur(8px);
  padding: 6px 15px; border-radius: var(--r-full);
  font-size: .78rem; font-weight: 700; color: #DCF0F6;
  margin-bottom: 18px;
}
.hero-badge i { color: var(--signal); }

.hero-section h1 {
  color: #fff; font-size: clamp(1.9rem, 1.2rem + 3.4vw, 3.35rem);
  line-height: 1.06; letter-spacing: -.035em; margin-bottom: 12px;
}
.hero-section h1 span {
  background: linear-gradient(96deg, var(--gold) 0%, var(--signal) 62%, #FF8A6B 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.hero-sub { font-size: clamp(.95rem, .9rem + .3vw, 1.1rem); color: #B9D6E2; margin-bottom: 26px; max-width: 640px; line-height: 1.6; }

/* Търсачка */
.search-form { margin-bottom: 20px; }
.search-row {
  display: grid;
  grid-template-columns: minmax(0, 2.1fr) minmax(0, 1.15fr) minmax(0, 1.15fr) auto;
  gap: 8px;
  background: rgba(255,255,255,.97);
  padding: 8px; border-radius: var(--r-lg);
  box-shadow: var(--shadow-xl);
}
.search-field { position: relative; display: flex; align-items: center; min-width: 0; }
.search-field > i { position: absolute; left: 15px; color: var(--ink-300); font-size: .88rem; pointer-events: none; z-index: 1; }
.search-field input, .search-field select {
  width: 100%; height: 50px;
  padding: 0 14px 0 40px;
  border: 1.5px solid transparent; background: var(--surface-2);
  border-radius: var(--r-sm); font-size: .92rem; color: var(--text);
  outline: none; min-width: 0;
  transition: border-color var(--t-fast), background var(--t-fast);
}
.search-field input:focus, .search-field select:focus { border-color: var(--sea); background: #fff; }
.search-field select { appearance: none; cursor: pointer; padding-right: 34px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%234A6B80' d='M1.4 0 6 4.6 10.6 0 12 1.4 6 7.4 0 1.4z'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 13px center; }
.btn-search { height: 50px; padding: 0 30px; font-size: .95rem; background: var(--signal); color: #fff; border-radius: var(--r-sm); }
.btn-search:hover { background: var(--signal-600); color: #fff; box-shadow: 0 6px 20px rgba(255,90,44,.4); }

@media (max-width: 900px) {
  .search-row { grid-template-columns: 1fr 1fr; }
  .search-field-keyword { grid-column: 1 / -1; }
  .btn-search { grid-column: 1 / -1; }
}
@media (max-width: 520px) {
  .search-row { grid-template-columns: 1fr; }
}

/* Автодовършване */
.ac-panel {
  position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 400;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r); box-shadow: var(--shadow-lg);
  overflow: hidden; max-height: 340px; overflow-y: auto;
}
.ac-item { display: flex; align-items: center; gap: 11px; padding: 10px 14px; cursor: pointer; font-size: .88rem; color: var(--text); }
.ac-item:hover, .ac-item.sel { background: var(--sea-50); }
.ac-item i { color: var(--ink-300); width: 16px; text-align: center; }
.ac-item b { color: var(--sea); font-weight: 700; }
.ac-item .ac-cat { margin-left: auto; font-size: .72rem; color: var(--ink-300); }
.ac-head { padding: 8px 14px 4px; font-size: .68rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; color: var(--ink-300); }

/* Популярни тагове */
.hero-tags { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.hero-tags > span { font-size: .8rem; color: #8FB6C8; font-weight: 600; margin-right: 2px; }
.hero-tags a {
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.18);
  color: #E4F2F7; font-size: .8rem; font-weight: 600;
  padding: 6px 13px; border-radius: var(--r-full);
  transition: background var(--t-fast), transform var(--t-fast), border-color var(--t-fast);
}
.hero-tags a:hover { background: rgba(255,255,255,.2); border-color: rgba(255,255,255,.4); color: #fff; transform: translateY(-2px); }
.hero-tags a i { color: var(--gold); font-size: .78rem; }

/* Лента със статистика */
.stats-bar {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-lg); margin-bottom: 34px;
  box-shadow: var(--shadow-xs); overflow: hidden;
}
.stats-bar-inner { display: flex; align-items: stretch; }
.stat-item { flex: 1; text-align: center; padding: 18px 12px; display: flex; flex-direction: column; gap: 2px; }
.stat-item strong { font-family: var(--font-display); font-size: clamp(1.15rem, 1rem + .8vw, 1.6rem); font-weight: 800; color: var(--ink); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.stat-item span { font-size: .74rem; color: var(--ink-300); font-weight: 600; text-transform: uppercase; letter-spacing: .06em; }
.stat-divider { width: 1px; background: var(--line-soft); }
@media (max-width: 640px) {
  .stats-bar-inner { flex-wrap: wrap; }
  .stat-item { flex: 1 1 50%; }
  .stat-divider { display: none; }
  .stat-item:nth-child(-n+4) { border-bottom: 1px solid var(--line-soft); }
}

/* ==========================================================================
   14. КАТЕГОРИИ
   ========================================================================== */
.categories-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(198px, 1fr)); gap: 14px; }
.cat-card-wrap { position: relative; }
.cat-card {
  display: flex; flex-direction: column; align-items: flex-start; gap: 4px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r); padding: 17px 16px;
  height: 100%;
  transition: transform var(--t), box-shadow var(--t), border-color var(--t);
}
.cat-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: var(--sea-100); }
.cat-icon {
  width: 42px; height: 42px; border-radius: var(--r-sm);
  background: var(--sea-50); color: var(--sea);
  display: grid; place-items: center; font-size: 1.05rem;
  margin-bottom: 8px;
  transition: background var(--t), color var(--t), transform var(--t);
}
.cat-card:hover .cat-icon { background: var(--sea); color: #fff; transform: scale(1.06) rotate(-4deg); }
.cat-name { font-family: var(--font-display); font-weight: 700; font-size: .9rem; color: var(--ink); line-height: 1.3; }
.cat-count { font-style: normal; font-size: .73rem; color: var(--ink-300); font-weight: 600; font-variant-numeric: tabular-nums; }
.cat-desc { font-size: .8rem; color: var(--ink-500); line-height: 1.55; }
.cat-children { display: none; }
.cat-card-wrap:hover .cat-children {
  display: flex; flex-direction: column; gap: 1px;
  position: absolute; top: calc(100% - 6px); left: 0; z-index: 60;
  min-width: 216px; background: var(--surface);
  border: 1px solid var(--line); border-radius: var(--r);
  box-shadow: var(--shadow-lg); padding: 7px;
  animation: dropIn .16s ease;
}
.cat-child-link { display: flex; align-items: center; gap: 9px; padding: 8px 11px; border-radius: var(--r-xs); font-size: .82rem; color: var(--text); }
.cat-child-link:hover { background: var(--sea-50); color: var(--sea-600); }
.cat-child-link i { color: var(--sea-400); width: 15px; text-align: center; font-size: .8rem; }

.subcats-grid { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.subcats-grid a {
  display: inline-flex; align-items: center; gap: 7px;
  background: var(--surface); border: 1px solid var(--line);
  padding: 8px 15px; border-radius: var(--r-full);
  font-size: .84rem; font-weight: 600; color: var(--text);
  transition: all var(--t-fast);
}
.subcats-grid a:hover, .subcats-grid a.active { background: var(--sea); border-color: var(--sea); color: #fff; }
.subcats-grid a i { color: var(--sea-400); }
.subcats-grid a:hover i, .subcats-grid a.active i { color: #fff; }

/* Квартали */
.neighborhoods-grid { display: flex; flex-wrap: wrap; gap: 8px; }
.neighborhood-chip {
  display: inline-flex; align-items: center; gap: 7px;
  background: var(--surface); border: 1px solid var(--line);
  padding: 8px 15px; border-radius: var(--r-full);
  font-size: .84rem; font-weight: 600; color: var(--text);
  transition: all var(--t-fast);
}
.neighborhood-chip:hover { background: var(--sea); border-color: var(--sea); color: #fff; transform: translateY(-2px); box-shadow: var(--shadow); }
.neighborhood-chip i { color: var(--sea-400); font-size: .8rem; }
.neighborhood-chip:hover i { color: #fff; }
.neighborhood-chip-sea { background: var(--sea-50); border-color: var(--sea-100); }
.neighborhood-chip-sea:hover { background: var(--sea-400); border-color: var(--sea-400); }

/* Хоризонтален скрол с нови обяви */
.new-listings-scroll {
  display: flex; gap: 13px; overflow-x: auto;
  padding: 4px 4px 14px; scroll-snap-type: x mandatory;
  scrollbar-width: thin;
}
.new-listing-card {
  flex: 0 0 208px; scroll-snap-align: start;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r); overflow: hidden;
  transition: transform var(--t), box-shadow var(--t);
}
.new-listing-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.new-listing-card img { width: 100%; height: 124px; object-fit: cover; }
.new-listing-body { padding: 11px 13px 13px; }
.new-listing-cat { font-size: .68rem; font-weight: 700; color: var(--sea); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 5px; display: flex; align-items: center; gap: 5px; }
.new-listing-title { font-family: var(--font-display); font-size: .85rem; font-weight: 700; color: var(--ink); line-height: 1.34; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ==========================================================================
   15. ФИЛТРИ И ЛЕНТА С РЕЗУЛТАТИ
   ========================================================================== */
.filter-bar {
  position: sticky; top: calc(var(--header-h) + 8px); z-index: 90;
  background: rgba(255,255,255,.94); backdrop-filter: blur(10px);
  border: 1px solid var(--line); border-radius: var(--r);
  padding: 11px 14px; margin-bottom: 20px;
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  box-shadow: var(--shadow-xs);
}
.filter-bar .spacer { flex: 1; }
.filter-chip {
  display: inline-flex; align-items: center; gap: 7px;
  background: var(--surface-2); border: 1px solid var(--line);
  padding: 7px 13px; border-radius: var(--r-full);
  font-size: .8rem; font-weight: 600; color: var(--text);
  cursor: pointer; transition: all var(--t-fast);
}
.filter-chip:hover { border-color: var(--sea); color: var(--sea); }
.filter-chip.active { background: var(--sea); border-color: var(--sea); color: #fff; }
.filter-chip .x { opacity: .7; font-size: .74rem; }
.filter-chip .x:hover { opacity: 1; }

.results-header {
  display: flex; align-items: center; justify-content: space-between;
  gap: 14px; flex-wrap: wrap; margin-bottom: 18px;
}
.results-count { font-size: .88rem; color: var(--ink-500); }
.results-count b { font-family: var(--font-display); color: var(--ink); font-weight: 800; font-variant-numeric: tabular-nums; }

.price-filter-bar { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 14px; margin-bottom: 18px; }
.price-filter-inner { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.price-filter-input { width: 118px; }
.cp-label { font-size: .8rem; font-weight: 700; color: var(--ink-500); }

.cat-search-bar { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 12px; margin-bottom: 18px; }
.cat-search-inner { display: flex; gap: 8px; flex-wrap: wrap; }
.cat-search-input { flex: 1; min-width: 190px; }
.cat-search-btn { flex-shrink: 0; }
.search-form-sm { display: flex; gap: 8px; flex-wrap: wrap; }
.neighborhood-dropdown-wrap { min-width: 180px; }
.neighborhood-select { width: 100%; }

.empty-state {
  text-align: center; padding: 60px 24px;
  background: var(--surface); border: 1px dashed var(--ink-100);
  border-radius: var(--r-lg);
}
.empty-state i { font-size: 2.6rem; color: var(--ink-100); margin-bottom: 16px; display: block; }
.empty-state h3 { color: var(--ink); margin-bottom: 8px; }
.empty-state p { color: var(--ink-500); font-size: .9rem; max-width: 420px; margin: 0 auto 20px; line-height: 1.65; }

/* Пагинация */
.pagination { display: flex; justify-content: center; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 32px; }
.pagination a, .pagination span {
  min-width: 40px; height: 40px; padding: 0 12px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-sm); font-size: .88rem; font-weight: 700;
  color: var(--text); font-variant-numeric: tabular-nums;
  transition: all var(--t-fast);
}
.pagination a:hover { border-color: var(--sea); color: var(--sea); background: var(--sea-50); }
.pagination .active, .pagination span.active { background: var(--sea); border-color: var(--sea); color: #fff; }
.pagination .disabled { opacity: .4; pointer-events: none; }

/* Троха (breadcrumb) */
.breadcrumb {
  display: flex; align-items: center; gap: 7px; flex-wrap: wrap;
  font-size: .8rem; color: var(--ink-300); margin-bottom: 16px;
}
.breadcrumb a { color: var(--ink-500); font-weight: 600; }
.breadcrumb a:hover { color: var(--sea); }
.breadcrumb .sep { color: var(--ink-100); font-size: .7rem; }
.breadcrumb .current { color: var(--ink); font-weight: 700; }

/* ==========================================================================
   16. СТРАНИЦА НА ОБЯВА
   ========================================================================== */
.listing-detail { display: block; }
.detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) 348px; gap: 26px; align-items: start; }
.detail-main { min-width: 0; }
.detail-sidebar { position: sticky; top: calc(var(--header-h) + 20px); display: flex; flex-direction: column; gap: 16px; }
@media (max-width: 1024px) { .detail-grid { grid-template-columns: 1fr; } .detail-sidebar { position: static; } }

.detail-title { font-size: clamp(1.4rem, 1.1rem + 1.6vw, 2.1rem); line-height: 1.16; margin-bottom: 10px; }
.detail-badges { display: flex; gap: 7px; flex-wrap: wrap; margin-bottom: 12px; }
.detail-meta { display: flex; gap: 18px; flex-wrap: wrap; font-size: .82rem; color: var(--ink-300); margin-bottom: 20px; }
.detail-meta span { display: inline-flex; align-items: center; gap: 6px; }
.detail-meta i { color: var(--sea-400); }

/* Галерия */
.gallery { margin-bottom: 24px; }
.gallery-main {
  position: relative; border-radius: var(--r-lg); overflow: hidden;
  background: var(--ink); aspect-ratio: 16/10;
  box-shadow: var(--shadow-md);
}
.gallery-main-img { width: 100%; height: 100%; object-fit: contain; background: #061E2C; cursor: zoom-in; }
.gallery-zoom-hint {
  position: absolute; bottom: 12px; right: 12px;
  background: rgba(7,42,63,.76); backdrop-filter: blur(6px); color: #fff;
  font-size: .74rem; font-weight: 600; padding: 6px 12px; border-radius: var(--r-full);
  display: inline-flex; align-items: center; gap: 6px; pointer-events: none;
}
.gallery-nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 42px; height: 42px; border-radius: 50%;
  background: rgba(255,255,255,.9); color: var(--ink);
  display: grid; place-items: center; box-shadow: var(--shadow);
  transition: background var(--t-fast), transform var(--t-fast);
}
.gallery-nav:hover { background: #fff; transform: translateY(-50%) scale(1.07); }
.gallery-nav.prev { left: 12px; }
.gallery-nav.next { right: 12px; }
.gallery-thumbs { display: flex; gap: 9px; margin-top: 11px; overflow-x: auto; padding-bottom: 5px; }
.gallery-thumb {
  width: 90px; height: 66px; object-fit: cover; flex-shrink: 0;
  border-radius: var(--r-xs); cursor: pointer;
  border: 2px solid transparent; opacity: .62;
  transition: all var(--t-fast);
}
.gallery-thumb:hover { opacity: 1; }
.gallery-thumb.active { border-color: var(--sea); opacity: 1; }

/* Лайтбокс */
.lightbox {
  position: fixed; inset: 0; z-index: 900;
  background: rgba(4,18,28,.96);
  display: none; align-items: center; justify-content: center;
  padding: 24px;
}
.lightbox.open { display: flex; animation: fadeIn .2s ease; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
.lightbox img { max-width: 94vw; max-height: 88vh; object-fit: contain; border-radius: var(--r-sm); }
.lightbox-close, .lightbox-prev, .lightbox-next {
  position: absolute; width: 48px; height: 48px; border-radius: 50%;
  background: rgba(255,255,255,.12); color: #fff; font-size: 1.15rem;
  display: grid; place-items: center; backdrop-filter: blur(6px);
  transition: background var(--t-fast);
}
.lightbox-close:hover, .lightbox-prev:hover, .lightbox-next:hover { background: rgba(255,255,255,.24); }
.lightbox-close { top: 22px; right: 22px; }
.lightbox-prev { left: 22px; top: 50%; transform: translateY(-50%); }
.lightbox-next { right: 22px; top: 50%; transform: translateY(-50%); }
.lightbox-counter { position: absolute; bottom: 22px; left: 50%; transform: translateX(-50%); color: #B9D6E2; font-size: .84rem; font-variant-numeric: tabular-nums; }

/* Ценова лента */
.detail-price-bar {
  display: flex; gap: 12px; flex-wrap: wrap;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r); padding: 16px 18px; margin-bottom: 22px;
}
.dpb-item { display: flex; flex-direction: column; gap: 2px; padding-right: 22px; border-right: 1px solid var(--line-soft); }
.dpb-item:last-child { border-right: 0; padding-right: 0; }
.dpb-label { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--ink-300); }
.dpb-price { font-family: var(--font-display); font-size: 1.5rem; font-weight: 800; color: var(--ink); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.dpb-price.accent { color: var(--signal); }

/* Съдържание */
.detail-description {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: 24px; margin-bottom: 22px;
  font-size: .94rem; line-height: 1.78; color: var(--text);
}
.detail-description h2, .detail-description h3 { margin: 22px 0 10px; }
.detail-description h2:first-child, .detail-description h3:first-child { margin-top: 0; }
.detail-description p { margin-bottom: 13px; }
.detail-description ul, .detail-description ol { margin: 0 0 14px 20px; }
.detail-description ul li { list-style: none; position: relative; padding-left: 20px; margin-bottom: 7px; }
.detail-description ul li::before { content: ""; position: absolute; left: 0; top: .62em; width: 6px; height: 6px; border-radius: 50%; background: var(--sea-400); }
.detail-description ol { list-style: decimal; }
.detail-description ol li { margin-bottom: 7px; }
.detail-description a { color: var(--sea); text-decoration: underline; text-underline-offset: 2px; }
.detail-description strong { color: var(--ink); font-weight: 700; }
.desc-text { line-height: 1.78; }
.read-more-link { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: .86rem; color: var(--sea); margin-top: 10px; }

.detail-features, .features-display { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.feature-tag {
  display: inline-flex; align-items: center; gap: 7px;
  background: var(--kelp-50); border: 1px solid #BDEBD4; color: #0A6B3E;
  padding: 7px 13px; border-radius: var(--r-full);
  font-size: .82rem; font-weight: 600;
}
.feature-tag i { color: var(--kelp); font-size: .76rem; }

/* Контактна карта */
.contact-card {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: 20px;
  box-shadow: var(--shadow-md);
}
.contact-card .btn { margin-bottom: 9px; }
.contact-card .btn:last-of-type { margin-bottom: 0; }
.contact-address, .contact-web, .contact-email, .contact-viber, .contact-maps {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: .86rem; color: var(--ink-500);
  padding: 10px 0; border-bottom: 1px solid var(--line-soft);
}
.contact-card > div:last-child { border-bottom: 0; }
.contact-address i, .contact-web i, .contact-email i, .contact-viber i, .contact-maps i { color: var(--sea); width: 17px; text-align: center; margin-top: 2px; }
.contact-viber i { color: #7360F2; }
.contact-msg-btn { width: 100%; }
.contact-msg-login { font-size: .82rem; color: var(--ink-300); text-align: center; padding: 10px 0; }

/* Разкриване на телефон */
.phone-reveal {
  display: flex; align-items: center; justify-content: center; gap: 9px;
  width: 100%; padding: 15px;
  background: var(--kelp); color: #fff;
  border-radius: var(--r-sm);
  font-family: var(--font-display); font-size: 1.06rem; font-weight: 800;
  letter-spacing: .01em; font-variant-numeric: tabular-nums;
  transition: background var(--t-fast), box-shadow var(--t-fast), transform var(--t-fast);
}
.phone-reveal:hover { background: #0C8A4E; color: #fff; transform: translateY(-1px); box-shadow: 0 8px 22px rgba(18,161,94,.34); }
.phone-reveal .masked { letter-spacing: .06em; }
.phone-reveal small { display: block; font-size: .68rem; font-weight: 600; opacity: .85; letter-spacing: .05em; text-transform: uppercase; }

/* Работно време */
.detail-working-hours, .wh-table { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; }
.wh-row, .wh-table tr { display: flex; align-items: center; justify-content: space-between; padding: 9px 15px; border-bottom: 1px solid var(--line-soft); font-size: .85rem; }
.wh-row:last-child, .wh-table tr:last-child { border-bottom: 0; }
.wh-row.today { background: var(--sea-50); font-weight: 700; }
.wh-day, .wh-table-day { color: var(--ink-500); font-weight: 600; }
.wh-times, .wh-table-hours { font-variant-numeric: tabular-nums; color: var(--ink); font-weight: 600; }
.wh-closed, .wh-closed-label { color: var(--ink-300); font-style: italic; font-weight: 500; }
.wh-status { display: inline-flex; align-items: center; gap: 6px; font-size: .8rem; font-weight: 700; padding: 4px 11px; border-radius: var(--r-full); }
.wh-status.open { background: var(--kelp-50); color: #0A6B3E; }
.wh-status.closed { background: var(--alert-50); color: #9B1C1C; }
.wh-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.wh-grid { display: grid; gap: 8px; }
.wh-sep { color: var(--ink-300); }
.wh-toggle { display: flex; align-items: center; gap: 9px; }
.wh-toggle-label { font-size: .8rem; color: var(--ink-500); font-weight: 600; }
.wh-toggle-track { width: 40px; height: 22px; border-radius: 99px; background: var(--ink-100); position: relative; cursor: pointer; }
.wh-time-input { width: 96px; }
.chow-item { display: flex; align-items: center; gap: 8px; font-size: .84rem; }
.chow-icon { color: var(--sea); }
.chow-sep { color: var(--ink-300); }
.chow-text { color: var(--ink-500); }

/* Карта */
.detail-map { border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--line); }
.detail-map iframe { display: block; width: 100%; height: 320px; border: 0; }

/* Отзиви */
.reviews-section { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 24px; margin-bottom: 22px; }
.review-card { padding: 16px 0; border-bottom: 1px solid var(--line-soft); }
.review-card:last-child { border-bottom: 0; padding-bottom: 0; }
.review-header { display: flex; align-items: center; gap: 11px; margin-bottom: 8px; flex-wrap: wrap; }
.review-header strong { font-family: var(--font-display); font-weight: 700; color: var(--ink); }
.review-stars { display: inline-flex; gap: 2px; color: var(--gold); font-size: .8rem; }
.review-stars .off { color: #DDE5EA; }
.review-date { font-size: .74rem; color: var(--ink-300); margin-left: auto; }
.review-yours-badge { background: var(--sea-50); color: var(--sea-600); font-size: .68rem; font-weight: 700; padding: 2px 8px; border-radius: var(--r-full); }
.no-reviews-msg { color: var(--ink-300); font-style: italic; text-align: center; padding: 24px; }
.add-review { background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r); padding: 18px; margin-top: 18px; }
.star-rating-input { display: inline-flex; flex-direction: row-reverse; gap: 4px; }
.star-rating-input input { display: none; }
.star-rating-input label { font-size: 1.6rem; color: #DDE5EA; cursor: pointer; transition: color var(--t-fast), transform var(--t-fast); }
.star-rating-input label:hover, .star-rating-input label:hover ~ label,
.star-rating-input input:checked ~ label { color: var(--gold); }
.star-rating-input label:hover { transform: scale(1.15); }
.login-prompt { text-align: center; padding: 18px; color: var(--ink-500); font-size: .88rem; }

.related-section { margin-top: 34px; }
.share-box { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.btn-share { display: inline-flex; align-items: center; justify-content: center; gap: 7px; width: 38px; height: 38px; border-radius: 50%; background: var(--surface-2); border: 1px solid var(--line); color: var(--ink-500); font-size: .88rem; transition: all var(--t-fast); }
.btn-share:hover { background: var(--sea); border-color: var(--sea); color: #fff; transform: translateY(-2px); }

/* Плаващ бутон „Обади се" на мобилни */
.sticky-call-btn {
  position: fixed; bottom: 18px; right: 18px; z-index: 300;
  display: none; align-items: center; gap: 9px;
  background: var(--kelp); color: #fff;
  padding: 14px 22px; border-radius: var(--r-full);
  font-family: var(--font-display); font-weight: 800; font-size: .95rem;
  box-shadow: 0 8px 26px rgba(18,161,94,.42);
  animation: pulseCall 2.6s infinite;
}
@keyframes pulseCall { 0%,100% { box-shadow: 0 8px 26px rgba(18,161,94,.42); } 50% { box-shadow: 0 8px 26px rgba(18,161,94,.42), 0 0 0 12px rgba(18,161,94,0); } }
.sticky-call-btn:hover { background: #0C8A4E; color: #fff; }
@media (max-width: 1024px) { .sticky-call-btn { display: inline-flex; } }

/* ==========================================================================
   17. МАЙСТОР ЗА ДОБАВЯНЕ НА ОБЯВА
   ========================================================================== */
.wizard { max-width: 940px; margin: 0 auto; }
.wizard-steps { display: flex; align-items: center; gap: 0; margin-bottom: 28px; }
.wz-step { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 7px; position: relative; }
.wz-step::before, .wz-step::after {
  content: ""; position: absolute; top: 17px; height: 2px; background: var(--line);
  width: 50%; z-index: 0;
}
.wz-step::before { left: 0; }
.wz-step::after { right: 0; }
.wz-step:first-child::before, .wz-step:last-child::after { display: none; }
.wz-step.done::before, .wz-step.done::after, .wz-step.active::before { background: var(--sea); }
.wz-dot {
  position: relative; z-index: 1;
  width: 36px; height: 36px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--surface); border: 2px solid var(--line);
  font-family: var(--font-display); font-weight: 800; font-size: .85rem; color: var(--ink-300);
  transition: all var(--t);
}
.wz-step.active .wz-dot { border-color: var(--sea); background: var(--sea); color: #fff; box-shadow: 0 0 0 5px var(--sea-50); }
.wz-step.done .wz-dot { border-color: var(--sea); background: var(--sea); color: #fff; }
.wz-label { font-size: .76rem; font-weight: 700; color: var(--ink-300); text-align: center; }
.wz-step.active .wz-label, .wz-step.done .wz-label { color: var(--ink); }
@media (max-width: 640px) { .wz-label { display: none; } }

.wz-panel { display: none; animation: dropIn .25s ease; }
.wz-panel.active { display: block; }
.wz-nav { display: flex; justify-content: space-between; gap: 12px; margin-top: 20px; }

/* Избор на категория с плочки */
.pick-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(146px, 1fr)); gap: 10px; }
.pick {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  padding: 16px 10px; text-align: center;
  background: var(--surface); border: 1.5px solid var(--line);
  border-radius: var(--r); cursor: pointer;
  transition: all var(--t-fast);
}
.pick:hover { border-color: var(--sea-400); background: var(--sea-50); transform: translateY(-2px); }
.pick.selected { border-color: var(--sea); background: var(--sea-50); box-shadow: var(--ring); }
.pick i { font-size: 1.35rem; color: var(--sea); }
.pick span { font-size: .8rem; font-weight: 700; color: var(--ink); line-height: 1.3; }
.pick input { display: none; }

/* Зона за качване на снимки */
.dropzone {
  border: 2px dashed var(--ink-100); border-radius: var(--r-lg);
  padding: 34px 20px; text-align: center; cursor: pointer;
  background: var(--surface-2);
  transition: all var(--t);
}
.dropzone:hover, .dropzone.dragover { border-color: var(--sea); background: var(--sea-50); }
.dropzone.dragover { transform: scale(1.01); }
.dropzone i { font-size: 2.2rem; color: var(--sea-400); margin-bottom: 12px; display: block; }
.dropzone strong { display: block; font-family: var(--font-display); font-size: 1rem; color: var(--ink); margin-bottom: 5px; }
.dropzone span { font-size: .82rem; color: var(--ink-500); }

.img-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 11px; margin-top: 16px; }
.img-item { position: relative; border-radius: var(--r-sm); overflow: hidden; aspect-ratio: 4/3; background: var(--surface-2); border: 1px solid var(--line); }
.img-item img { width: 100%; height: 100%; object-fit: cover; }
.img-item.is-primary { border-color: var(--sea); box-shadow: 0 0 0 2px var(--sea-100); }
.img-badge { position: absolute; bottom: 6px; left: 6px; background: var(--sea); color: #fff; font-size: .62rem; font-weight: 800; padding: 3px 8px; border-radius: var(--r-full); text-transform: uppercase; letter-spacing: .05em; }
.img-actions { position: absolute; top: 6px; right: 6px; display: flex; gap: 4px; opacity: 0; transition: opacity var(--t-fast); }
.img-item:hover .img-actions { opacity: 1; }
.img-actions button, .img-actions a { width: 26px; height: 26px; border-radius: 50%; background: rgba(255,255,255,.94); color: var(--ink-500); font-size: .68rem; display: grid; place-items: center; box-shadow: var(--shadow-xs); transition: all var(--t-fast); }
.img-actions button:hover, .img-actions a:hover { background: #fff; color: var(--sea); }
.img-actions .del:hover { color: var(--alert); }
.img-progress { position: absolute; inset: 0; background: rgba(7,42,63,.6); display: grid; place-items: center; color: #fff; font-size: .74rem; font-weight: 700; }
.img-drag-item { cursor: grab; }
.img-drag-item.dragging { opacity: .4; }
.img-drag-handle { position: absolute; top: 6px; left: 6px; width: 24px; height: 24px; border-radius: 50%; background: rgba(255,255,255,.9); color: var(--ink-300); display: grid; place-items: center; font-size: .66rem; cursor: grab; }

/* Карти за тип обява */
.listing-type-cards, .type-card { display: block; }
.listing-type-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(196px, 1fr)); gap: 13px; }
.type-card { position: relative; cursor: pointer; }
.type-card input { position: absolute; opacity: 0; }
.type-card-body {
  border: 1.5px solid var(--line); border-radius: var(--r);
  padding: 18px 16px; background: var(--surface); height: 100%;
  transition: all var(--t-fast); text-align: center;
}
.type-card:hover .type-card-body { border-color: var(--sea-400); transform: translateY(-2px); }
.type-card input:checked + .type-card-body { border-color: var(--sea); background: var(--sea-50); box-shadow: var(--ring); }
.type-icon { font-size: 1.5rem; margin-bottom: 9px; }
.type-price { font-family: var(--font-display); font-weight: 800; font-size: 1.15rem; color: var(--ink); margin-top: 6px; }
.type-locked { opacity: .55; cursor: not-allowed; }

.extras-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(184px, 1fr)); gap: 9px; }
.extra-check {
  display: flex; align-items: center; gap: 9px;
  padding: 10px 13px; border: 1.5px solid var(--line);
  border-radius: var(--r-sm); background: var(--surface);
  font-size: .84rem; font-weight: 600; cursor: pointer;
  transition: all var(--t-fast);
}
.extra-check:hover { border-color: var(--sea-400); background: var(--sea-50); }
.extra-check input { width: 17px; height: 17px; accent-color: var(--sea); cursor: pointer; }
.extra-check:has(input:checked) { border-color: var(--sea); background: var(--sea-50); color: var(--sea-600); }

/* Живо визуализиране на обявата */
.live-preview { position: sticky; top: calc(var(--header-h) + 20px); }
.live-preview-label { font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-300); margin-bottom: 10px; display: flex; align-items: center; gap: 7px; }
.live-preview-label::after { content: ""; flex: 1; height: 1px; background: var(--line); }

/* Индикатор за качество на обявата */
.quality-meter { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 16px; }
.quality-bar { height: 8px; background: var(--line-soft); border-radius: 99px; overflow: hidden; margin: 10px 0 12px; }
.quality-fill { height: 100%; border-radius: 99px; background: linear-gradient(90deg, var(--signal), var(--gold), var(--kelp)); transition: width var(--t-slow); }
.quality-list { display: flex; flex-direction: column; gap: 6px; }
.quality-list li { display: flex; align-items: center; gap: 8px; font-size: .8rem; color: var(--ink-300); }
.quality-list li.ok { color: var(--kelp); }
.quality-list li.ok i::before { content: "\f058"; }
.quality-list li i { font-size: .82rem; }

/* ==========================================================================
   18. ПРОФИЛ / ТАБЛО
   ========================================================================== */
.profile-page, .profile-dashboard, .credits-page, .credits-profile-page, .msg-page, .admin-page, .search-page, .category-page, .blog-page, .static-page, .faq-page, .kontakti-page, .za-nas-page, .legal-page, .news-page { min-width: 0; }

.page-hero {
  background: linear-gradient(150deg, var(--ink) 0%, var(--ink-700) 62%, var(--sea-600) 100%);
  border-radius: var(--r-xl); padding: 28px 30px; color: #fff;
  margin-bottom: 24px; position: relative; overflow: hidden;
}
.page-hero::after {
  content: ""; position: absolute; right: -60px; top: -60px;
  width: 240px; height: 240px; border-radius: 50%;
  background: radial-gradient(circle, rgba(29,155,184,.36), transparent 70%);
}
.page-hero h1 { color: #fff; margin-bottom: 6px; }
.page-hero p { color: #A9CBDA; font-size: .92rem; }
.page-sub { color: var(--ink-500); font-size: .92rem; margin-bottom: 22px; }
.profile-page-header, .credits-page-header, .msg-page-header, .cat-page-header, .admin-header, .faq-header, .legal-header, .news-header, .post-header, .blog-header {
  margin-bottom: 22px;
}
.msg-page-title { display: flex; align-items: center; gap: 10px; }

/* Табло — герой */
.pd-hero {
  display: grid; grid-template-columns: auto 1fr auto; gap: 22px; align-items: center;
  background: linear-gradient(150deg, var(--ink) 0%, var(--ink-700) 58%, var(--sea-600) 100%);
  border-radius: var(--r-xl); padding: 26px 28px; margin-bottom: 22px;
  color: #fff; position: relative; overflow: hidden;
}
.pd-hero::after { content: ""; position: absolute; right: -70px; top: -70px; width: 250px; height: 250px; border-radius: 50%; background: radial-gradient(circle, rgba(29,155,184,.32), transparent 70%); }
.pd-avatar { position: relative; z-index: 1; }
.pd-avatar > i { font-size: 4rem; color: rgba(255,255,255,.9); }
.pd-avatar img { width: 76px; height: 76px; border-radius: 50%; object-fit: cover; border: 3px solid rgba(255,255,255,.3); }
.pd-avatar-badge { position: absolute; bottom: -4px; left: 50%; transform: translateX(-50%); font-size: .6rem; font-weight: 800; padding: 2px 9px; border-radius: 99px; background: var(--gold); color: #452B00; text-transform: uppercase; letter-spacing: .05em; white-space: nowrap; }
.badge-user { background: rgba(255,255,255,.9); color: var(--ink); }
.pd-info { position: relative; z-index: 1; min-width: 0; }
.pd-info h1 { color: #fff; font-size: clamp(1.3rem, 1.1rem + 1vw, 1.75rem); margin-bottom: 5px; }
.pd-email, .pd-member { font-size: .84rem; color: #A9CBDA; display: flex; align-items: center; gap: 7px; }
.pd-credits-big { position: relative; z-index: 1; text-align: center; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); border-radius: var(--r); padding: 16px 22px; backdrop-filter: blur(8px); }
.pd-credits-num { font-family: var(--font-display); font-size: 2.1rem; font-weight: 800; color: var(--gold); line-height: 1; font-variant-numeric: tabular-nums; }
.pd-credits-label { font-size: .72rem; color: #A9CBDA; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; margin-top: 3px; }
@media (max-width: 760px) { .pd-hero { grid-template-columns: 1fr; text-align: center; } .pd-email, .pd-member { justify-content: center; } }

/* Статистики */
.pd-stats, .admin-stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(155px, 1fr)); gap: 13px; margin-bottom: 24px; }
.pd-stat, .stat-card {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r); padding: 17px;
  display: flex; align-items: center; gap: 13px;
  transition: transform var(--t), box-shadow var(--t);
}
.pd-stat:hover, .stat-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.pd-stat-icon, .stat-icon {
  width: 42px; height: 42px; border-radius: var(--r-sm);
  display: grid; place-items: center; font-size: 1.05rem;
  background: var(--sea-50); color: var(--sea); flex-shrink: 0;
}
.pd-stat-num, .stat-num { font-family: var(--font-display); font-size: 1.5rem; font-weight: 800; color: var(--ink); line-height: 1.1; font-variant-numeric: tabular-nums; }
.pd-stat-label, .stat-label { font-size: .74rem; color: var(--ink-300); font-weight: 600; text-transform: uppercase; letter-spacing: .05em; }
.stat-info { min-width: 0; }

/* Известия */
.pd-notif-panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 20px; margin-bottom: 24px; }
.pd-notif-panel h3 { margin-bottom: 14px; display: flex; align-items: center; gap: 9px; }
.pd-notif-list { display: flex; flex-direction: column; gap: 9px; }
.pd-notif-item { display: flex; align-items: center; gap: 13px; padding: 13px 15px; border-radius: var(--r-sm); background: var(--surface-2); border: 1px solid var(--line-soft); transition: all var(--t-fast); }
.pd-notif-item:hover { border-color: var(--sea-100); background: var(--sea-50); transform: translateX(3px); }
.pd-notif-icon { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: var(--sea-50); color: var(--sea); flex-shrink: 0; }
.pd-notif-msg .pd-notif-icon { background: var(--signal-50); color: var(--signal); }
.pd-notif-review .pd-notif-icon { background: var(--gold-50); color: var(--gold); }
.pd-notif-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pd-notif-body strong { font-size: .88rem; color: var(--ink); font-weight: 700; }
.pd-notif-body span { font-size: .78rem; color: var(--ink-500); }
.pd-notif-badge { background: var(--signal); color: #fff; font-size: .7rem; font-weight: 800; padding: 3px 9px; border-radius: 99px; }
.pd-notif-stars { color: var(--gold); font-size: .74rem; }

/* Бързи действия */
.pd-actions-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(214px, 1fr)); gap: 13px; margin-bottom: 24px; }
.pd-action-card {
  display: flex; align-items: center; gap: 14px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r); padding: 17px;
  transition: all var(--t);
}
.pd-action-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: var(--sea-100); }
.pd-action-featured { background: linear-gradient(140deg, var(--sea), var(--sea-600)); border-color: transparent; }
.pd-action-featured .pd-action-body strong, .pd-action-featured .pd-action-body span, .pd-action-featured .pd-action-arrow { color: #fff; }
.pd-action-featured .pd-action-icon { background: rgba(255,255,255,.18); color: #fff; }
.pd-action-icon { width: 44px; height: 44px; border-radius: var(--r-sm); display: grid; place-items: center; background: var(--sea-50); color: var(--sea); font-size: 1.1rem; flex-shrink: 0; }
.pd-action-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pd-action-body strong { font-family: var(--font-display); font-size: .92rem; font-weight: 700; color: var(--ink); }
.pd-action-body span { font-size: .78rem; color: var(--ink-500); }
.pd-action-arrow { color: var(--ink-100); transition: transform var(--t-fast); }
.pd-action-card:hover .pd-action-arrow { transform: translateX(4px); }

.pd-tips { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 20px; }
.pd-tips-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 13px; margin-top: 14px; }
.pd-tip { display: flex; gap: 11px; font-size: .84rem; color: var(--ink-500); line-height: 1.6; }
.pd-tip i { color: var(--gold); flex-shrink: 0; margin-top: 3px; }

/* Моите обяви */
.my-listings-cards { display: flex; flex-direction: column; gap: 14px; }
.mlc {
  display: grid; grid-template-columns: 156px 1fr auto; gap: 16px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: 14px; align-items: center;
  transition: box-shadow var(--t), border-color var(--t);
}
.mlc:hover { box-shadow: var(--shadow-md); border-color: var(--sea-100); }
.mlc-image { width: 156px; height: 104px; border-radius: var(--r-sm); overflow: hidden; background: var(--sea-50); }
.mlc-image img { width: 100%; height: 100%; object-fit: cover; }
.mlc-body { min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.mlc-title { font-family: var(--font-display); font-size: 1rem; font-weight: 700; color: var(--ink); line-height: 1.32; }
.mlc-status-row { display: flex; gap: 7px; flex-wrap: wrap; align-items: center; }
.mlc-meta { display: flex; gap: 14px; flex-wrap: wrap; font-size: .76rem; color: var(--ink-300); }
.mlc-meta span { display: inline-flex; align-items: center; gap: 5px; }
.mlc-actions { display: flex; flex-direction: column; gap: 6px; min-width: 132px; }
@media (max-width: 860px) { .mlc { grid-template-columns: 1fr; } .mlc-image { width: 100%; height: 168px; } .mlc-actions { flex-direction: row; flex-wrap: wrap; min-width: 0; } }

/* Кредити */
.credits-balance-pill, .crp-balance {
  display: inline-flex; align-items: center; gap: 12px;
  background: linear-gradient(140deg, var(--gold), #FFC65C);
  color: #452B00; padding: 14px 24px; border-radius: var(--r-lg);
  box-shadow: 0 6px 20px rgba(245,165,36,.3);
}
.crp-balance-num { font-family: var(--font-display); font-size: 2.2rem; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.crp-balance-label { font-size: .76rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; opacity: .8; }
.crp-hero { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-xl); padding: 24px; margin-bottom: 24px; }
.crp-hero-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.crp-section { margin-bottom: 26px; }
.crp-section-header { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 14px; flex-wrap: wrap; }
.crp-uses, .credits-how { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 13px; }
.crp-use { display: flex; gap: 13px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 16px; }
.crp-use-icon { width: 40px; height: 40px; border-radius: var(--r-sm); display: grid; place-items: center; background: var(--sea-50); color: var(--sea); flex-shrink: 0; }
.crp-use-body { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.crp-use-body strong { font-family: var(--font-display); font-size: .9rem; color: var(--ink); }
.crp-use-body span { font-size: .8rem; color: var(--ink-500); line-height: 1.5; }
.crp-use-price { font-family: var(--font-display); font-weight: 800; color: var(--gold); font-size: .88rem; }
.crp-transactions { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; }
.crp-tx { display: flex; align-items: center; gap: 13px; padding: 13px 17px; border-bottom: 1px solid var(--line-soft); }
.crp-tx:last-child { border-bottom: 0; }
.crp-tx-body { flex: 1; min-width: 0; }
.crp-tip { background: var(--sea-50); border: 1px solid var(--sea-100); border-radius: var(--r); padding: 14px 17px; font-size: .85rem; color: var(--sea-600); display: flex; gap: 11px; }
.crp-tip i { color: var(--sea); margin-top: 2px; }
.crp-buy-cta { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; background: linear-gradient(140deg, var(--ink), var(--sea-600)); color: #fff; border-radius: var(--r-lg); padding: 22px 26px; }
.crp-buy-cta-text h3 { color: #fff; margin-bottom: 5px; }
.crp-buy-cta-text p { color: #A9CBDA; font-size: .86rem; }

.packages-grid, .credits-packages { display: grid; grid-template-columns: repeat(auto-fit, minmax(232px, 1fr)); gap: 16px; }
.pkg-card { position: relative; background: var(--surface); border: 1.5px solid var(--line); border-radius: var(--r-lg); padding: 24px 20px; text-align: center; transition: all var(--t); }
.pkg-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: var(--sea-100); }
.pkg-card-featured { border-color: var(--gold); box-shadow: 0 8px 26px rgba(245,165,36,.2); }
.pkg-featured-label { position: absolute; top: -11px; left: 50%; transform: translateX(-50%); background: var(--gold); color: #452B00; font-size: .66rem; font-weight: 800; padding: 4px 14px; border-radius: 99px; text-transform: uppercase; letter-spacing: .08em; white-space: nowrap; }
.pkg-top { margin-bottom: 14px; }
.pkg-name { font-size: .78rem; font-weight: 700; color: var(--ink-300); text-transform: uppercase; letter-spacing: .08em; }
.pkg-credits-num { font-family: var(--font-display); font-size: 2.6rem; font-weight: 800; color: var(--ink); line-height: 1; font-variant-numeric: tabular-nums; }
.pkg-price-area { margin: 14px 0; }
.pkg-price { font-family: var(--font-display); font-size: 1.7rem; font-weight: 800; color: var(--sea); font-variant-numeric: tabular-nums; }
.pkg-vat { font-size: .72rem; color: var(--ink-300); }
.pkg-per-credit { font-size: .78rem; color: var(--ink-500); }
.pkg-save-badge { display: inline-block; background: var(--kelp-50); color: #0A6B3E; font-size: .7rem; font-weight: 700; padding: 3px 10px; border-radius: 99px; margin-top: 7px; }
.pkg-save-green { background: var(--kelp); color: #fff; }
.pkg-divider { height: 1px; background: var(--line-soft); margin: 16px 0; }
.pkg-list { display: flex; flex-direction: column; gap: 8px; text-align: left; margin-bottom: 18px; }
.pkg-list li { display: flex; gap: 9px; font-size: .82rem; color: var(--ink-500); }
.pkg-list li i { color: var(--kelp); margin-top: 3px; }
.pkg-btn { width: 100%; }
.lct-header, .lct-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line-soft); font-size: .86rem; }
.lct-bonus { color: var(--kelp); font-weight: 700; }
.credits-info, .credits-trust, .credits-contact-cta { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 18px; margin-top: 18px; }
.ct-badges { display: flex; gap: 10px; flex-wrap: wrap; }
.ct-badge { display: inline-flex; align-items: center; gap: 7px; font-size: .8rem; font-weight: 600; color: var(--ink-500); background: var(--surface-2); border: 1px solid var(--line); padding: 7px 13px; border-radius: var(--r-full); }
.ct-badge i { color: var(--kelp); }
.ct-title { font-family: var(--font-display); font-weight: 700; margin-bottom: 10px; }
.ct-payment { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.ct-payment-icons { display: flex; gap: 8px; font-size: 1.5rem; color: var(--ink-300); }
.ctp-icon { color: var(--ink-300); }

/* ==========================================================================
   19. СЪОБЩЕНИЯ
   ========================================================================== */
.msg-list { display: flex; flex-direction: column; gap: 9px; }
.msg-item, .msg-list > a {
  display: flex; align-items: flex-start; gap: 13px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r); padding: 15px;
  transition: all var(--t-fast);
}
.msg-item:hover, .msg-list > a:hover { border-color: var(--sea-100); box-shadow: var(--shadow); transform: translateX(3px); }
.msg-item-avatar { width: 42px; height: 42px; border-radius: 50%; background: var(--sea-50); color: var(--sea); display: grid; place-items: center; font-size: 1.05rem; flex-shrink: 0; }
.msg-item-body { flex: 1; min-width: 0; }
.msg-item-top { display: flex; align-items: center; gap: 9px; margin-bottom: 3px; flex-wrap: wrap; }
.msg-item-top strong { font-family: var(--font-display); font-weight: 700; color: var(--ink); font-size: .92rem; }
.msg-item-date { font-size: .74rem; color: var(--ink-300); margin-left: auto; }
.msg-item-listing { font-size: .74rem; color: var(--sea); font-weight: 600; }
.msg-item-preview { font-size: .84rem; color: var(--ink-500); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.msg-item-arrow { color: var(--ink-100); align-self: center; }
.msg-unread-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--signal); flex-shrink: 0; }
.msg-thread { display: flex; flex-direction: column; gap: 13px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 20px; margin-bottom: 16px; max-height: 62vh; overflow-y: auto; }
.msg-bubble { max-width: 76%; padding: 12px 15px; border-radius: var(--r); background: var(--surface-2); border: 1px solid var(--line-soft); font-size: .89rem; line-height: 1.6; }
.msg-bubble.mine { align-self: flex-end; background: var(--sea); border-color: var(--sea); color: #fff; }
.msg-bubble.mine .msg-bubble-name, .msg-bubble.mine .msg-bubble-time { color: rgba(255,255,255,.75); }
.msg-bubble-name { font-size: .74rem; font-weight: 700; color: var(--sea); margin-bottom: 3px; }
.msg-bubble-time { font-size: .68rem; color: var(--ink-300); margin-top: 5px; }
.msg-bubble-avatar { width: 30px; height: 30px; border-radius: 50%; background: var(--sea-50); color: var(--sea); display: grid; place-items: center; font-size: .8rem; }
.msg-reply-form { display: flex; gap: 9px; align-items: flex-end; }
.msg-reply-input { flex: 1; min-height: 46px; max-height: 140px; resize: vertical; }
.msg-empty { text-align: center; padding: 46px 20px; color: var(--ink-300); }

/* ==========================================================================
   20. АУТЕНТИКАЦИЯ
   ========================================================================== */
.auth-wrapper { max-width: 448px; margin: 30px auto 60px; }
.auth-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-xl); padding: 34px 30px; box-shadow: var(--shadow-lg); }
.auth-logo { text-align: center; margin-bottom: 20px; }
.auth-logo img { height: 46px; margin: 0 auto; }
.auth-title { text-align: center; font-size: 1.5rem; margin-bottom: 6px; }
.auth-sub { text-align: center; color: var(--ink-500); font-size: .88rem; margin-bottom: 26px; }
.auth-form .form-group { margin-bottom: 15px; }
.auth-switch { text-align: center; font-size: .87rem; color: var(--ink-500); margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--line-soft); }
.auth-switch a { font-weight: 700; }
.forgot-link { display: block; text-align: right; font-size: .8rem; margin-top: 6px; }
.oauth-divider { display: flex; align-items: center; gap: 13px; margin: 20px 0; color: var(--ink-300); font-size: .78rem; font-weight: 600; }
.oauth-divider::before, .oauth-divider::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.btn-oauth { width: 100%; margin-bottom: 9px; }

/* Индикатор за сила на паролата */
.pw-meter { display: flex; gap: 4px; margin-top: 7px; }
.pw-meter i { flex: 1; height: 4px; border-radius: 2px; background: var(--line); transition: background var(--t-fast); }
.pw-meter.s1 i:nth-child(1) { background: var(--alert); }
.pw-meter.s2 i:nth-child(-n+2) { background: var(--gold); }
.pw-meter.s3 i:nth-child(-n+3) { background: #8BC34A; }
.pw-meter.s4 i { background: var(--kelp); }
.pw-hint { font-size: .74rem; color: var(--ink-300); margin-top: 5px; }

/* ==========================================================================
   21. АДМИН
   ========================================================================== */
.admin-section { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 20px; margin-bottom: 20px; }
.admin-filter-bar { display: flex; gap: 9px; flex-wrap: wrap; margin-bottom: 18px; }
.admin-nav-btn, .admin-quick-nav a {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 8px 15px; border-radius: var(--r-full);
  background: var(--surface-2); border: 1px solid var(--line);
  font-size: .82rem; font-weight: 600; color: var(--text);
  transition: all var(--t-fast);
}
.admin-nav-btn:hover, .admin-nav-btn.active, .admin-quick-nav a:hover { background: var(--sea); border-color: var(--sea); color: #fff; }
.admin-quick-nav { display: flex; gap: 9px; flex-wrap: wrap; margin-bottom: 20px; }
.nav-badge { background: var(--signal); color: #fff; font-size: .66rem; font-weight: 800; padding: 1px 7px; border-radius: 99px; }

.table-wrapper { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); }
.table { width: 100%; min-width: 660px; }
.table th {
  text-align: left; padding: 12px 15px;
  background: var(--surface-2);
  font-family: var(--font-display); font-size: .72rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: .07em; color: var(--ink-500);
  border-bottom: 1px solid var(--line);
  white-space: nowrap;
}
.table td { padding: 12px 15px; border-bottom: 1px solid var(--line-soft); font-size: .86rem; vertical-align: middle; }
.table tr:last-child td { border-bottom: 0; }
.table tbody tr:hover { background: var(--surface-2); }
.td-actions { display: flex; gap: 6px; flex-wrap: wrap; }

/* ==========================================================================
   22. СТАТИЧНИ СТРАНИЦИ / БЛОГ / НОВИНИ / FAQ
   ========================================================================== */
.static-page, .legal-page, .za-nas-page, .faq-page, .kontakti-page {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-xl); padding: clamp(22px, 3vw, 40px);
}
.static-page h1, .legal-page h1 { margin-bottom: 8px; }
.static-page h2, .legal-page h2, .legal-section h2 { margin: 30px 0 12px; font-size: 1.28rem; }
.static-page h3, .legal-page h3 { margin: 22px 0 9px; }
.static-page p, .legal-page p { margin-bottom: 13px; line-height: 1.78; color: var(--text); }
.static-page ul li, .legal-page ul li, .legal-list li { position: relative; padding-left: 22px; margin-bottom: 8px; line-height: 1.7; }
.static-page ul li::before, .legal-page ul li::before, .legal-list li::before { content: ""; position: absolute; left: 2px; top: .68em; width: 6px; height: 6px; border-radius: 50%; background: var(--sea-400); }
.legal-updated { font-size: .8rem; color: var(--ink-300); margin-bottom: 22px; }
.legal-intro { font-size: 1rem; color: var(--ink-500); line-height: 1.75; padding: 16px 18px; background: var(--sea-50); border-left: 3px solid var(--sea); border-radius: 0 var(--r-sm) var(--r-sm) 0; margin-bottom: 24px; }
.legal-toc { background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r); padding: 18px; margin-bottom: 26px; }
.legal-toc a { display: block; padding: 5px 0; font-size: .88rem; }
.legal-section { scroll-margin-top: calc(var(--header-h) + 20px); }
.legal-highlight, .legal-info-box { background: var(--gold-50); border: 1px solid #F6DFAE; border-radius: var(--r); padding: 15px 18px; margin: 18px 0; font-size: .88rem; }
.legal-icon { color: var(--sea); }
.legal-rights-grid, .legal-security-grid, .legal-use-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 13px; margin: 18px 0; }
.legal-right, .legal-security-item, .legal-use-item { background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r); padding: 15px; font-size: .86rem; }
.legal-credits-table { width: 100%; margin: 18px 0; }
.legal-contact { background: var(--sea-50); border: 1px solid var(--sea-100); border-radius: var(--r); padding: 18px; margin-top: 26px; }

/* FAQ */
.faq-header { display: flex; align-items: center; gap: 16px; margin-bottom: 26px; }
.faq-header-icon { width: 58px; height: 58px; border-radius: var(--r); background: var(--sea-50); color: var(--sea); display: grid; place-items: center; font-size: 1.5rem; flex-shrink: 0; }
.faq-cats { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 24px; }
.faq-cat { display: inline-flex; align-items: center; gap: 7px; padding: 8px 15px; border-radius: var(--r-full); background: var(--surface-2); border: 1px solid var(--line); font-size: .83rem; font-weight: 600; color: var(--text); cursor: pointer; transition: all var(--t-fast); }
.faq-cat:hover, .faq-cat.active { background: var(--sea); border-color: var(--sea); color: #fff; }
.faq-group { margin-bottom: 30px; }
.faq-group-title { font-family: var(--font-display); font-size: 1.15rem; font-weight: 800; color: var(--ink); margin-bottom: 14px; display: flex; align-items: center; gap: 9px; }
.faq-item { border: 1px solid var(--line); border-radius: var(--r); margin-bottom: 9px; overflow: hidden; background: var(--surface); transition: border-color var(--t-fast); }
.faq-item:hover { border-color: var(--sea-100); }
.faq-item.open { border-color: var(--sea-100); box-shadow: var(--shadow-xs); }
.faq-q {
  display: flex; align-items: center; justify-content: space-between; gap: 13px;
  padding: 15px 18px; cursor: pointer; width: 100%; text-align: left;
  font-family: var(--font-display); font-weight: 700; font-size: .94rem; color: var(--ink);
}
.faq-q::after { content: "\f078"; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: .72rem; color: var(--ink-300); transition: transform var(--t); flex-shrink: 0; }
.faq-item.open .faq-q::after { transform: rotate(180deg); color: var(--sea); }
.faq-a { padding: 0 18px 16px; font-size: .89rem; color: var(--ink-500); line-height: 1.75; display: none; }
.faq-item.open .faq-a { display: block; animation: dropIn .2s ease; }
.faq-cta { background: linear-gradient(140deg, var(--ink), var(--sea-600)); color: #fff; border-radius: var(--r-lg); padding: 26px; text-align: center; margin-top: 30px; }
.faq-cta h3 { color: #fff; margin-bottom: 8px; }
.faq-cta p { color: #A9CBDA; margin-bottom: 18px; }

/* Блог / новини */
.blog-grid, .news-grid, .blog-grid-full { display: grid; grid-template-columns: repeat(auto-fill, minmax(292px, 1fr)); gap: 20px; }
.blog-card, .news-card {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-lg); overflow: hidden;
  transition: transform var(--t), box-shadow var(--t);
  display: flex; flex-direction: column;
}
.blog-card:hover, .news-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.blog-card img, .news-card-img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.news-card-no-img { aspect-ratio: 16/9; background: linear-gradient(135deg, var(--sea-50), #E0EDF2); display: grid; place-items: center; color: var(--sea-400); font-size: 2rem; }
.blog-card-body, .news-card-body { padding: 17px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.blog-card-body h3, .news-card-title { font-family: var(--font-display); font-size: 1.02rem; font-weight: 700; line-height: 1.35; color: var(--ink); }
.blog-meta, .news-card-date, .news-card-source { font-size: .74rem; color: var(--ink-300); display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.news-card-excerpt { font-size: .85rem; color: var(--ink-500); line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.blog-card-lg { grid-column: span 2; }
@media (max-width: 720px) { .blog-card-lg { grid-column: span 1; } }
.blog-post, .news-article, .post-content { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-xl); padding: clamp(22px, 3vw, 40px); }
.post-header { margin-bottom: 24px; padding-bottom: 20px; border-bottom: 1px solid var(--line-soft); }
.post-excerpt { font-size: 1.02rem; color: var(--ink-500); line-height: 1.75; margin-bottom: 16px; }
.post-meta { display: flex; gap: 16px; flex-wrap: wrap; font-size: .8rem; color: var(--ink-300); }
.post-content p { margin-bottom: 15px; line-height: 1.8; }
.post-content h2 { margin: 30px 0 12px; }
.post-links, .internal-links, .tag-links { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--line-soft); }
.post-back, .na-back { display: inline-flex; align-items: center; gap: 7px; font-size: .86rem; font-weight: 600; color: var(--ink-500); margin-bottom: 16px; }
.post-back:hover, .na-back:hover { color: var(--sea); }
.na-header { margin-bottom: 20px; }
.na-image { border-radius: var(--r-lg); overflow: hidden; margin-bottom: 22px; }
.na-content { line-height: 1.8; }
.na-content p { margin-bottom: 15px; }
.na-meta, .na-breadcrumb { font-size: .8rem; color: var(--ink-300); display: flex; gap: 13px; flex-wrap: wrap; }
.na-source-link { color: var(--sea); font-weight: 600; }

/* Контакти */
.kontakti-hero { background: linear-gradient(150deg, var(--ink), var(--sea-600)); color: #fff; border-radius: var(--r-xl); padding: 30px; margin-bottom: 26px; }
.kontakti-hero h1 { color: #fff; }
.kontakti-hero-text { color: #A9CBDA; margin-top: 8px; }
.kontakti-grid { display: grid; grid-template-columns: minmax(0,1fr) 340px; gap: 24px; align-items: start; }
@media (max-width: 900px) { .kontakti-grid { grid-template-columns: 1fr; } }
.kontakti-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 13px; margin-bottom: 24px; }
.kcard { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 18px; transition: all var(--t); position: relative; }
.kcard:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.kcard-icon { width: 42px; height: 42px; border-radius: var(--r-sm); background: var(--sea-50); color: var(--sea); display: grid; place-items: center; font-size: 1.05rem; margin-bottom: 11px; }
.kcard-link { font-weight: 700; color: var(--sea); font-size: .9rem; }
.kcard-badge { position: absolute; top: 13px; right: 13px; font-size: .64rem; font-weight: 800; padding: 2px 8px; border-radius: 99px; background: var(--kelp-50); color: #0A6B3E; }
.kontakti-form-wrap, .kinfo-box { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 22px; }
.kinfo-list { display: flex; flex-direction: column; gap: 11px; }
.kinfo-list li { display: flex; gap: 10px; font-size: .86rem; color: var(--ink-500); padding-left: 0; }
.kinfo-list li::before { display: none; }
.kinfo-list i { color: var(--sea); width: 17px; text-align: center; }
.kh-icon { color: var(--sea); }
.ksocial-btn { display: inline-flex; align-items: center; gap: 9px; padding: 10px 17px; border-radius: var(--r-sm); font-weight: 700; font-size: .86rem; }
.ksocial-fb { background: #1877F2; color: #fff; }
.ksocial-fb:hover { background: #145FC4; color: #fff; }

/* За нас */
.zn-hero { background: linear-gradient(150deg, var(--ink), var(--sea-600)); color: #fff; border-radius: var(--r-xl); padding: 34px; margin-bottom: 30px; position: relative; overflow: hidden; }
.zn-hero::after { content: ""; position: absolute; right: -60px; bottom: -60px; width: 240px; height: 240px; border-radius: 50%; background: radial-gradient(circle, rgba(29,155,184,.3), transparent 70%); }
.zn-hero-top { position: relative; z-index: 1; display: flex; align-items: center; gap: 16px; margin-bottom: 16px; }
.zn-hero-icon { width: 56px; height: 56px; border-radius: var(--r); background: rgba(255,255,255,.14); display: grid; place-items: center; font-size: 1.4rem; }
.zn-hero-badge { display: inline-flex; align-items: center; gap: 7px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24); padding: 5px 13px; border-radius: 99px; font-size: .76rem; font-weight: 700; }
.zn-hero-head { color: #fff; position: relative; z-index: 1; }
.zn-hero-stats { display: flex; gap: 24px; flex-wrap: wrap; margin-top: 22px; position: relative; z-index: 1; }
.zn-stat { display: flex; flex-direction: column; }
.zn-stat strong { font-family: var(--font-display); font-size: 1.8rem; font-weight: 800; color: var(--gold); font-variant-numeric: tabular-nums; }
.zn-stat span { font-size: .76rem; color: #A9CBDA; text-transform: uppercase; letter-spacing: .06em; }
.zn-stat-sep { width: 1px; background: rgba(255,255,255,.16); }
.zn-section { margin-bottom: 34px; }
.zn-section-title { font-family: var(--font-display); font-size: 1.35rem; font-weight: 800; color: var(--ink); margin-bottom: 16px; }
.zn-mission { display: flex; gap: 16px; background: var(--sea-50); border: 1px solid var(--sea-100); border-radius: var(--r-lg); padding: 22px; }
.zn-mission-icon { font-size: 1.6rem; color: var(--sea); flex-shrink: 0; }
.zn-mission-text { line-height: 1.78; }
.zn-features, .zn-values-list, .zn-coverage-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(226px, 1fr)); gap: 15px; }
.zn-feature, .zn-value, .zn-coverage-col { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 18px; }
.zn-feature-icon { width: 42px; height: 42px; border-radius: var(--r-sm); background: var(--sea-50); color: var(--sea); display: grid; place-items: center; font-size: 1.05rem; margin-bottom: 11px; }
.zn-value-num { font-family: var(--font-display); font-size: 1.7rem; font-weight: 800; color: var(--sea); }
.zn-tags { display: flex; gap: 8px; flex-wrap: wrap; }
.zn-cta { background: linear-gradient(140deg, var(--signal), #FF8A5C); color: #fff; border-radius: var(--r-xl); padding: 30px; text-align: center; }
.zn-cta h2 { color: #fff; margin-bottom: 9px; }
.zn-cta-inner p { color: rgba(255,255,255,.9); margin-bottom: 20px; }
.zn-cta-btns { display: flex; gap: 11px; justify-content: center; flex-wrap: wrap; }

/* Защо ние */
.why-us-header { text-align: center; max-width: 620px; margin: 0 auto 30px; }
.why-us-header p { color: var(--ink-500); margin-top: 8px; }
.why-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(258px, 1fr)); gap: 18px; }
.why-card {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: 24px;
  transition: transform var(--t), box-shadow var(--t);
}
.why-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.why-icon { width: 48px; height: 48px; border-radius: var(--r-sm); display: grid; place-items: center; font-size: 1.2rem; margin-bottom: 14px; }
.why-card h3 { margin-bottom: 8px; font-size: 1.02rem; }
.why-card p { font-size: .87rem; color: var(--ink-500); line-height: 1.65; }

/* CTA банер */
.home-cta-banner {
  background: linear-gradient(140deg, var(--ink) 0%, var(--ink-700) 50%, var(--sea-600) 100%);
  border-radius: var(--r-xl); padding: 34px; margin-bottom: 44px;
  position: relative; overflow: hidden;
}
.home-cta-banner::after { content: ""; position: absolute; right: -70px; top: -70px; width: 260px; height: 260px; border-radius: 50%; background: radial-gradient(circle, rgba(255,90,44,.26), transparent 70%); }
.home-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; position: relative; z-index: 1; }
.home-cta-text h2 { color: #fff; margin-bottom: 8px; }
.home-cta-text p { color: #A9CBDA; font-size: .92rem; max-width: 480px; }
.home-cta-actions { display: flex; gap: 11px; flex-wrap: wrap; }

/* SEO текст */
.seo-text-block {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-xl); padding: clamp(20px, 3vw, 32px);
  margin-top: 40px; font-size: .92rem; line-height: 1.78; color: var(--ink-500);
}
.seo-text-block h2 { font-size: 1.32rem; margin-bottom: 14px; color: var(--ink); }
.seo-text-block h3 { font-size: 1.05rem; margin: 24px 0 10px; color: var(--ink); }
.seo-text-block p { margin-bottom: 13px; }
.seo-features { display: grid; grid-template-columns: repeat(auto-fit, minmax(206px, 1fr)); gap: 10px; margin: 18px 0; }
.seo-features li { display: flex; align-items: center; gap: 9px; font-size: .86rem; font-weight: 600; color: var(--text); background: var(--surface-2); border: 1px solid var(--line-soft); padding: 10px 14px; border-radius: var(--r-sm); }
.seo-faq details { background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-sm); margin-bottom: 8px; overflow: hidden; }
.seo-faq summary { padding: 13px 16px; cursor: pointer; font-weight: 600; font-size: .89rem; color: var(--ink); list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.seo-faq summary::-webkit-details-marker { display: none; }
.seo-faq summary::after { content: "\f067"; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: .68rem; color: var(--ink-300); flex-shrink: 0; }
.seo-faq details[open] summary::after { content: "\f068"; color: var(--sea); }
.seo-faq details[open] summary { border-bottom: 1px solid var(--line); }
.seo-faq p { padding: 13px 16px; margin: 0; font-size: .87rem; }
.seo-neighborhoods { margin-top: 24px; }
.seo-n-links { display: flex; flex-wrap: wrap; gap: 7px; }
.seo-n-links span, .seo-n-links a {
  font-size: .78rem; color: var(--ink-500); background: var(--surface-2);
  border: 1px solid var(--line-soft); padding: 5px 11px; border-radius: var(--r-full);
}
.seo-n-links a:hover { background: var(--sea-50); border-color: var(--sea-100); color: var(--sea); }

/* ==========================================================================
   23. ФУТЪР
   ========================================================================== */
.site-footer { background: var(--ink); color: #B9D6E2; margin-top: 60px; }
.footer-main { padding: 48px 0 36px; }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.15fr; gap: 40px; }
@media (max-width: 1080px) { .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; } }
@media (max-width: 620px) { .footer-grid { grid-template-columns: 1fr; } }

.footer-logo { margin-bottom: 14px; }
.footer-logo img { height: 52px; width: auto; object-fit: contain; filter: brightness(0) invert(1); }
.footer-stars { display: flex; align-items: center; gap: 4px; color: var(--gold); font-size: .78rem; margin-bottom: 13px; }
.footer-stars span { color: #8FB6C8; margin-left: 6px; font-weight: 600; }
.footer-tagline { font-size: .87rem; line-height: 1.72; color: #9BBFCF; margin-bottom: 20px; }
.footer-contact-block { display: flex; flex-direction: column; gap: 9px; margin-bottom: 20px; }
.fci-item { display: flex; align-items: center; gap: 10px; font-size: .85rem; }
.fci-item i { color: var(--sea-400); width: 16px; text-align: center; }
.fci-item a { color: #B9D6E2; }
.fci-item a:hover { color: #fff; }
.footer-workhours { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); border-radius: var(--r); padding: 15px; margin-bottom: 20px; }
.fwh-title { font-size: .66rem; font-weight: 800; letter-spacing: .1em; color: #7FA9BD; margin-bottom: 10px; }
.fwh-row { display: flex; justify-content: space-between; gap: 12px; font-size: .8rem; padding: 4px 0; color: #A9CBDA; }
.footer-social { display: flex; gap: 9px; }
.social-btn { width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,.08); color: #B9D6E2; display: grid; place-items: center; transition: all var(--t-fast); }
.social-btn:hover { background: var(--sea); color: #fff; transform: translateY(-2px); }

.footer-heading { font-family: var(--font-display); font-size: .72rem; font-weight: 800; letter-spacing: .11em; color: #fff; margin-bottom: 15px; text-transform: uppercase; }
.footer-links { display: flex; flex-direction: column; gap: 1px; }
.footer-links a { display: flex; align-items: center; gap: 8px; font-size: .85rem; color: #9BBFCF; padding: 5px 0; transition: color var(--t-fast), transform var(--t-fast); }
.footer-links a:hover { color: #fff; transform: translateX(3px); }
.footer-links a i { font-size: .55rem; color: var(--sea-400); }

.footer-cta-btn {
  display: flex; align-items: center; justify-content: center; gap: 9px;
  width: 100%; padding: 12px 18px; border-radius: var(--r-sm);
  background: var(--signal); color: #fff;
  font-family: var(--font-display); font-weight: 700; font-size: .87rem;
  margin-bottom: 9px; transition: all var(--t-fast);
}
.footer-cta-btn:hover { background: var(--signal-600); color: #fff; transform: translateY(-2px); box-shadow: 0 6px 18px rgba(255,90,44,.32); }
.footer-cta-btn-outline { background: transparent; border: 1.5px solid rgba(255,255,255,.24); color: #B9D6E2; }
.footer-cta-btn-outline:hover { background: rgba(255,255,255,.08); border-color: #fff; color: #fff; box-shadow: none; }

.footer-badges { display: flex; flex-direction: column; gap: 8px; margin-top: 20px; }
.fbadge { display: flex; align-items: center; gap: 9px; font-size: .8rem; color: #9BBFCF; }
.fbadge i { color: var(--kelp); }
.footer-stats { display: flex; gap: 18px; margin-top: 22px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.09); }
.fstat-num { font-family: var(--font-display); font-size: 1.32rem; font-weight: 800; color: #fff; font-variant-numeric: tabular-nums; }
.fstat-label { font-size: .68rem; color: #7FA9BD; text-transform: uppercase; letter-spacing: .07em; }

.footer-bottom { border-top: 1px solid rgba(255,255,255,.09); padding: 18px 0; }
.footer-bottom-inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: .8rem; color: #7FA9BD; }
.footer-bottom a { color: #9BBFCF; }
.footer-bottom a:hover { color: #fff; }
.footer-bottom-right { display: flex; gap: 18px; flex-wrap: wrap; }
.footer-sep { color: rgba(255,255,255,.2); margin: 0 6px; }

/* ==========================================================================
   24. ЛЕНТА ЗА СРАВНЕНИЕ / ТОСТ
   ========================================================================== */
.compare-bar {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 320;
  background: var(--ink); color: #fff;
  padding: 12px 20px;
  display: none; align-items: center; gap: 16px;
  box-shadow: 0 -6px 24px rgba(7,42,63,.3);
  transform: translateY(100%); transition: transform var(--t);
}
.compare-bar.show { display: flex; transform: none; }
.compare-items { display: flex; gap: 9px; flex: 1; overflow-x: auto; }
.compare-thumb { position: relative; width: 54px; height: 40px; border-radius: var(--r-xs); overflow: hidden; flex-shrink: 0; }
.compare-thumb img { width: 100%; height: 100%; object-fit: cover; }
.compare-thumb button { position: absolute; top: 1px; right: 1px; width: 15px; height: 15px; border-radius: 50%; background: rgba(7,42,63,.85); color: #fff; font-size: .55rem; display: grid; place-items: center; }

.toast-wrap { position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%); z-index: 800; display: flex; flex-direction: column; gap: 8px; align-items: center; pointer-events: none; }
.toast {
  background: var(--ink); color: #fff;
  padding: 12px 20px; border-radius: var(--r-full);
  font-size: .87rem; font-weight: 600;
  box-shadow: var(--shadow-lg);
  display: flex; align-items: center; gap: 9px;
  animation: toastIn .3s cubic-bezier(.16,1,.3,1);
}
@keyframes toastIn { from { opacity: 0; transform: translateY(14px) scale(.94); } to { opacity: 1; transform: none; } }
.toast.out { animation: toastOut .3s forwards; }
@keyframes toastOut { to { opacity: 0; transform: translateY(10px) scale(.96); } }
.toast i { color: var(--kelp); }
.toast.err i { color: var(--signal); }

/* Бутон „нагоре" */
.to-top {
  position: fixed; bottom: 20px; left: 20px; z-index: 250;
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--surface); border: 1px solid var(--line);
  color: var(--ink-500); box-shadow: var(--shadow-md);
  display: grid; place-items: center;
  opacity: 0; pointer-events: none;
  transition: opacity var(--t), transform var(--t), color var(--t-fast);
}
.to-top.show { opacity: 1; pointer-events: auto; }
.to-top:hover { color: var(--sea); transform: translateY(-3px); }
@media (max-width: 1024px) { .to-top { bottom: 84px; left: 16px; } }

/* Бисквитки */
.cookie-bar {
  position: fixed; bottom: 16px; left: 16px; right: 16px; z-index: 700;
  max-width: 660px; margin: 0 auto;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: var(--shadow-xl);
  padding: 18px 20px;
  display: none; align-items: center; gap: 16px; flex-wrap: wrap;
  animation: dropIn .3s ease;
}
.cookie-bar.show { display: flex; }
.cookie-bar p { flex: 1; min-width: 220px; font-size: .85rem; color: var(--ink-500); line-height: 1.6; }
.cookie-bar a { font-weight: 600; }

/* ==========================================================================
   25. ПОМОЩНИ КЛАСОВЕ
   ========================================================================== */
.text-center { text-align: center; }
.text-right { text-align: right; }
.text-muted { color: var(--ink-500); }
.text-sm { font-size: .85rem; }
.text-xs { font-size: .76rem; }
.fw-700 { font-weight: 700; }
.mt-1 { margin-top: 6px; } .mt-2 { margin-top: 12px; } .mt-3 { margin-top: 18px; }
.mt-4 { margin-top: 24px; } .mt-5 { margin-top: 32px; }
.mb-1 { margin-bottom: 6px; } .mb-2 { margin-bottom: 12px; } .mb-3 { margin-bottom: 18px; }
.mb-4 { margin-bottom: 24px; } .mb-5 { margin-bottom: 32px; }
.ml-2 { margin-left: 12px; } .my-3 { margin: 18px 0; }
.gap-1 { gap: 6px; } .gap-2 { gap: 12px; } .gap-3 { gap: 18px; }
.flex { display: flex; } .flex-col { flex-direction: column; }
.items-center { align-items: center; } .justify-between { justify-content: space-between; }
.flex-wrap { flex-wrap: wrap; } .flex-1 { flex: 1; }
.hidden { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.divider { height: 1px; background: var(--line-soft); margin: 20px 0; }
.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 20px; }
.chip { display: inline-flex; align-items: center; gap: 6px; background: var(--surface-2); border: 1px solid var(--line); padding: 4px 11px; border-radius: var(--r-full); font-size: .78rem; font-weight: 600; color: var(--ink-500); }

/* Анимация при поява при скрол */
.reveal { opacity: 0; transform: translateY(16px); transition: opacity .5s ease, transform .5s cubic-bezier(.16,1,.3,1); }
.reveal.in { opacity: 1; transform: none; }

/* ==========================================================================
   26. АДАПТИВНОСТ
   ========================================================================== */
@media (max-width: 1180px) {
  .header-search { max-width: 340px; }
}
@media (max-width: 980px) {
  :root { --header-h: 62px; }
  .header-search { display: none; }
  .main-nav { display: none; }
  .mobile-menu-btn { display: grid; place-items: center; }
  .mobile-menu { display: block; }
  .credits-badge span { display: none; }
  .credits-badge { padding: 8px 11px; }
  .user-menu-btn span { display: none; }
  .header-actions .btn { padding: 9px 13px; }
  .listings-grid { grid-template-columns: repeat(auto-fill, minmax(224px, 1fr)); gap: 15px; }
}
@media (max-width: 760px) {
  body { font-size: 14.5px; }
  .container, .page-wrapper { padding-left: 14px; padding-right: 14px; }
  .hero-section { border-radius: var(--r-lg); }
  .section { margin-bottom: 34px; }
  .form-section { padding: 18px; border-radius: var(--r); }
  .listings-grid { grid-template-columns: repeat(auto-fill, minmax(158px, 1fr)); gap: 12px; }
  .lc-body { padding: 20px 12px 11px; }
  .lc-title { font-size: .92rem; }
  .lc-desc { display: none; }
  .lc-quick { opacity: 1 !important; transform: none !important; }
  .lc-tools { opacity: 1; transform: none; }
  .lc-tag { font-size: .84rem; padding: 5px 10px; right: 8px; }
  .detail-description, .reviews-section, .card { padding: 17px; }
  .footer-main { padding: 34px 0 26px; }
  .pd-hero { padding: 20px; }
  .mobile-only-publish { display: inline-flex; }
  .header-actions .btn-primary:not(.mobile-only-publish) { display: none; }
}
@media (max-width: 420px) {
  .listings-grid { grid-template-columns: 1fr 1fr; }
  .categories-grid { grid-template-columns: 1fr 1fr; }
  .btn-lg { padding: 13px 22px; font-size: .92rem; }
}

/* ==========================================================================
   27. ПЕЧАТ
   ========================================================================== */
@media print {
  .site-header, .site-footer, .sidebar, .lc-tools, .sticky-call-btn, .to-top,
  .compare-bar, .cookie-bar, .filter-bar, .btn { display: none !important; }
  body { background: #fff; font-size: 12pt; }
  .page-wrapper { grid-template-columns: 1fr; padding: 0; }
  .detail-grid { grid-template-columns: 1fr; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 9pt; color: #666; }
}