/* ═══════════════════════════════════════════════════════════════════════════
   SAFARJA — LUXE LAYER
   لایهٔ ظاهری «لوکس» روی طراحی فعلی: سبز جنگلی عمیق + طلایی شامپاینی،
   زمینهٔ عاجی، سایه‌های نرم لایه‌ای و خطوط موییِ طلایی.
   این فایل آخر از همه لود می‌شود و فقط ظاهر را عوض می‌کند؛ با حذف لینکش
   سایت دقیقاً به حالت قبل برمی‌گردد.
   ═══════════════════════════════════════════════════════════════════════════ */

:root {
  --bg:            #f6f2ea;
  --bg-card:       #fffdf9;
  --bg-nav:        rgba(250,247,241,0.86);
  --bg-glass:      rgba(255,253,249,0.72);
  --text:          #1b211d;
  --text-muted:    #6f716a;
  --text-light:    #a19e94;
  --accent:        #1f3d31;
  --accent-light:  #2f5a48;
  --accent-warm:   #b08d57;
  --accent-warm-l: #d6b77f;
  --gold:          #b08d57;
  --gold-soft:     rgba(176,141,87,0.18);
  --gold-line:     rgba(176,141,87,0.38);
  --border:        rgba(60,48,28,0.09);
  --shadow-sm:     0 1px 2px rgba(31,40,32,0.05), 0 2px 8px rgba(31,40,32,0.05);
  --shadow-md:     0 2px 6px rgba(31,40,32,0.06), 0 14px 34px rgba(31,40,32,0.12);
  --shadow-lg:     0 4px 10px rgba(31,40,32,0.06), 0 28px 70px rgba(31,40,32,0.18);
  --shadow-card:   0 1px 2px rgba(31,40,32,0.04), 0 8px 26px rgba(31,40,32,0.07);
  --lux-grad:      linear-gradient(135deg, #1f3d31 0%, #28503f 55%, #1a3329 100%);
  --gold-grad:     linear-gradient(135deg, #c9a66b 0%, #b08d57 50%, #93733f 100%);
}

[data-theme="dark"] {
  --bg:            #0c110f;
  --bg-card:       #141b18;
  --bg-nav:        rgba(14,20,17,0.9);
  --bg-glass:      rgba(20,27,24,0.72);
  --text:          #ece7dc;
  --text-muted:    #9a9d93;
  --text-light:    #6c6f67;
  --accent:        #7fb095;
  --accent-light:  #9cc7ae;
  --accent-warm:   #d4b27a;
  --accent-warm-l: #e6cc9d;
  --gold:          #d4b27a;
  --gold-soft:     rgba(212,178,122,0.14);
  --gold-line:     rgba(212,178,122,0.32);
  --border:        rgba(236,231,220,0.08);
  --shadow-card:   0 1px 2px rgba(0,0,0,0.3), 0 10px 30px rgba(0,0,0,0.35);
  --shadow-md:     0 14px 34px rgba(0,0,0,0.45);
  --lux-grad:      linear-gradient(135deg, #16291f 0%, #1f3d31 60%, #122219 100%);
}

/* ───────── پایه ───────── */
html body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
::selection { background: var(--gold-soft); color: var(--text); }

/* ───────── نوار بالا ───────── */
html .topbar { border-bottom: 1px solid var(--gold-line); }
html .topbar__logo { letter-spacing: 0; }
html .topbar__logo span { color: var(--gold); }
html .icon-btn:hover { background: var(--accent); box-shadow: 0 0 0 1px var(--gold-line); }

/* ───────── عنوان بخش‌ها: خط طلایی کوتاه ───────── */
html .section-title,
html .lp-section-title,
html .related__title {
  position: relative;
  padding-inline-start: 16px;
}
html .section-title::before,
html .lp-section-title::before,
html .related__title::before {
  content: '';
  position: absolute;
  inset-inline-start: 0;
  top: 50%;
  width: 4px;
  height: 1.05em;
  border-radius: 4px;
  background: var(--gold-grad);
  transform: translateY(-50%);
}
html .see-all { color: var(--gold); font-weight: 700; }

/* ───────── جستجو و دکمه‌ها ───────── */
html .search-btn,
html .back-btn {
  background: var(--lux-grad);
  box-shadow: 0 8px 22px rgba(31,61,49,0.28), inset 0 1px 0 rgba(255,255,255,0.12);
  border: 1px solid rgba(214,183,127,0.35);
}
html .search-btn:hover { background: var(--lux-grad); filter: brightness(1.12); }
html .search-card:focus-within { box-shadow: var(--shadow-lg), 0 0 0 3px var(--gold-soft); }

/* ───────── چیپ‌ها ───────── */
html .filter-chip {
  border: 1px solid var(--border);
  background: var(--bg-card);
  font-weight: 600;
  box-shadow: var(--shadow-sm);
}
html .filter-chip:hover,
html .filter-chip.active {
  background: var(--lux-grad);
  border-color: var(--gold-line);
  color: #f7f1e4;
  box-shadow: 0 8px 20px rgba(31,61,49,0.25);
}

/* ───────── کارت ویلا ───────── */
html .villa-card {
  border-radius: 22px;
  border: 1px solid var(--border);
  box-shadow: var(--shadow-card);
  transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease, border-color .35s ease;
}
html .villa-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-lg);
  border-color: var(--gold-line);
}
html .villa-img::after {
  content: '';
  position: absolute;
  inset: auto 0 0 0;
  height: 45%;
  background: linear-gradient(180deg, transparent, rgba(10,18,14,0.28));
  pointer-events: none;
  z-index: 2;
}
html .villa-img img, html .villa-carousel-slide img { transition: transform .8s cubic-bezier(.2,.7,.2,1); }
html .villa-badge {
  background: rgba(20,32,26,0.72);
  color: #f3e6c9;
  border: 1px solid rgba(214,183,127,0.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  letter-spacing: 0;
}
html .villa-title { font-weight: 800; }
html .villa-price { color: var(--accent); font-weight: 900; }
html[data-theme="dark"] .villa-price { color: var(--gold); }

/* ───────── مجله در صفحهٔ اصلی ───────── */
html .mag-home-card { border-radius: 20px; border: 1px solid var(--border); box-shadow: var(--shadow-card); }
html .mag-home-cat { color: var(--gold); }

/* ───────── فوتر ───────── */
html .site-footer {
  background: radial-gradient(1200px 400px at 85% -10%, rgba(214,183,127,0.12), transparent 60%), var(--lux-grad) !important;
  border-top: 1px solid var(--gold-line);
}
html .site-footer .footer-col h4 { color: var(--accent-warm-l); letter-spacing: 0; }
html .site-footer .footer-col a:hover { color: #f3e6c9; text-decoration: none; }
html .site-footer .footer-bottom { border-top-color: rgba(214,183,127,0.22); }

/* ═══════════════ صفحه‌های فرود (landing) ═══════════════ */
html .lp-top { padding-top: 18px; }
html .lp-brand { font-size: 1.15rem; }
html .lp-top-link { color: var(--gold); }

html .lp-hero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid var(--gold-line);
  border-radius: 28px;
  padding: 34px 24px 28px;
  color: #f7f1e4;
  background: var(--lux-grad);
  box-shadow: var(--shadow-lg);
}
html .lp-hero.has-cover { background: #16291f; }
html .lp-hero.has-cover::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -2;
  background: var(--hero-img) center / cover no-repeat;
  transform: scale(1.04);
}
html .lp-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(270deg, rgba(12,24,18,0.94) 0%, rgba(12,24,18,0.8) 50%, rgba(12,24,18,0.45) 100%),
    radial-gradient(600px 240px at 90% 0%, rgba(214,183,127,0.22), transparent 70%);
}
html .lp-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  font-size: .75rem;
  font-weight: 800;
  color: var(--accent-warm-l);
}
html .lp-eyebrow::before { content: ''; width: 26px; height: 1px; background: currentColor; }
html .lp-h1 { color: #fffaf0; text-shadow: 0 2px 20px rgba(0,0,0,.25); }
html .lp-intro { color: rgba(247,241,228,0.82); }
html .lp-stat {
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(214,183,127,0.4);
  color: #f7f1e4;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
html .lp-crumbs a:hover { color: var(--gold); }

html .lp-card {
  border-radius: 22px;
  box-shadow: var(--shadow-card);
  transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease, border-color .35s ease;
}
html .lp-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); border-color: var(--gold-line); }
html .lp-card__img { overflow: hidden; }
html .lp-card__img img { transition: transform .8s cubic-bezier(.2,.7,.2,1); }
html .lp-card:hover .lp-card__img img { transform: scale(1.06); }
html .lp-card__body { padding: 14px 16px 16px; }
html .lp-card__meta span { background: var(--gold-soft); color: var(--text); }
html .lp-card__price { padding-top: 10px; border-top: 1px solid var(--border); }

html .lp-section { border-radius: 24px; }
html .lp-article h2 { position: relative; padding-bottom: 8px; }
html .lp-article h2::after {
  content: '';
  position: absolute;
  bottom: 0;
  inset-inline-start: 0;
  width: 44px;
  height: 2px;
  border-radius: 2px;
  background: var(--gold-grad);
}
html .lp-article a, html .lp-faq a { color: var(--accent); text-decoration-color: var(--gold-line); text-underline-offset: 4px; }
html[data-theme="dark"] .lp-article a { color: var(--gold); }
html .lp-faq summary::marker { color: var(--gold); }
html .lp-chip, html .stay-links a { transition: border-color .2s ease, color .2s ease, background .2s ease; }
html .lp-chip:hover, html .stay-links a:hover { border-color: var(--gold); color: var(--accent); background: var(--gold-soft); }

/* ═══════════════ مقاله ═══════════════ */
html .article-content h2 { border-bottom: 0 !important; position: relative; padding-bottom: 8px; }
html .article-content h2::after {
  content: '';
  position: absolute;
  bottom: 0;
  inset-inline-start: 0;
  width: 48px;
  height: 2px;
  border-radius: 2px;
  background: var(--gold-grad);
}
html .article-content a { text-decoration-color: var(--gold-line); }
html .article-content blockquote { border-inline-start-color: var(--gold); background: var(--gold-soft); }
html .stay-block {
  background: linear-gradient(180deg, var(--gold-soft), transparent 70%), var(--bg-card);
  border-color: var(--gold-line);
}
html .related-card { border-radius: 16px; }
html .related-card:hover { border-color: var(--gold-line); }

@media (min-width: 900px) {
  html .lp-hero { padding: 54px 44px 44px; min-height: 300px; display: flex; flex-direction: column; justify-content: flex-end; }
  html .lp-h1 { font-size: 2.3rem; }
}

@media (prefers-reduced-motion: reduce) {
  html .villa-card, html .lp-card, html .villa-img img, html .lp-card__img img { transition: none !important; }
}

/* لینک‌های داخل متن: کمی روشن‌تر از سبز اصلی تا از متن جدا شوند */
html .article-content a, html .lp-article a, html .lp-faq a { color: var(--accent-light); }
html[data-theme="dark"] .article-content a, html[data-theme="dark"] .lp-article a { color: var(--gold); }

/* ───────── دستیار پرسش‌وپاسخ: هماهنگ با پالت سبز و طلایی ───────── */
html .faq-chat-fab,
html .faq-chat-head,
html .faq-msg.user .bubble,
html .faq-chat-input-row button {
  background: var(--lux-grad);
}
html .faq-chat-fab {
  border: 1px solid rgba(214,183,127,0.55);
  box-shadow: 0 8px 24px rgba(31,61,49,0.35);
}