/* ═══════════════════════════════════════════
   فرشواره — home.css  نسخه ۹
   hero: کنسول تب‌دار (ماشینی/سجاده‌ای) + فیلتر سریع
═══════════════════════════════════════════ */

/* ══ هیرو — پایه ══ */
.fvh {
  position: relative;
  overflow: visible;
  padding: 56px 0 60px;
  background: var(--cream, #fbf6ec);
}
.fvh::before {
  content: '';
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 80% 55% at 50% 30%, rgba(201,162,39,.08) 0, transparent 65%),
    radial-gradient(circle at 85% 15%, rgba(19,122,136,.07) 0, transparent 40%),
    radial-gradient(circle at 10% 80%, rgba(87,35,98,.05) 0, transparent 35%);
}
.fvh__medallion {
  position: absolute; left: 50%; top: 34%;
  transform: translate(-50%, -50%);
  width: min(700px, 85vw); height: min(700px, 85vw);
  pointer-events: none; opacity: .05;
  color: var(--plum-700, #572362);
}

/* ── متن ── */
.fvh__text {
  position: relative; z-index: 2;
  text-align: center;
  padding-bottom: 32px;
}
.fvh__eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(19,122,136,.1); border: 1px solid rgba(19,122,136,.25);
  color: var(--teal, #137a88); font-size: 12.5px; font-weight: 700;
  padding: 6px 16px; border-radius: 100px; margin-bottom: 20px;
}
.fvh__dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--teal, #137a88);
  box-shadow: 0 0 0 3px rgba(19,122,136,.2);
  animation: fvhPulse 2s infinite;
  flex-shrink: 0;
}
@keyframes fvhPulse {
  0%,100% { box-shadow: 0 0 0 3px rgba(19,122,136,.2); }
  50%      { box-shadow: 0 0 0 6px rgba(19,122,136,.05); }
}
.fvh__title {
  font-size: clamp(28px, 4.6vw, 52px); font-weight: 800; line-height: 1.24;
  letter-spacing: -1.2px; color: var(--ink, #231430);
  max-width: 820px; margin-inline: auto;
}
.fvh__accent {
  background: linear-gradient(120deg, #8B6A10, #C9A84C 50%, #8B1A2C);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.fvh__lead {
  font-size: clamp(14px, 1.7vw, 16.5px); color: var(--ink-mid, #5a4260);
  max-width: 520px; margin: 14px auto 0; line-height: 1.85; font-weight: 500;
}

/* ══════════════════════════════════════════
   کنسول تب‌دار
══════════════════════════════════════════ */
.fvh__console {
  position: relative; z-index: 10;
  max-width: 760px;
  margin-inline: auto;
  background: #fff;
  border-radius: 22px;
  border: 1px solid var(--line, #e5d9c6);
  box-shadow: 0 0 0 1px rgba(201,162,39,.12), 0 4px 6px rgba(46,18,56,.04), 0 22px 50px rgba(46,18,56,.12);
  overflow: hidden;
}

/* ── تب‌ها ── */
.fvh__tabs {
  display: flex;
  background: var(--champagne, #f3e9d5);
  padding: 6px;
  gap: 6px;
}
.fvh__tab {
  flex: 1;
  display: flex; align-items: center; justify-content: center; gap: 8px;
  border: none; background: transparent;
  padding: 13px 12px;
  border-radius: 15px;
  font-family: inherit; font-size: 14.5px; font-weight: 700;
  color: var(--ink-mid, #5a4260);
  transition: background .2s, color .2s, box-shadow .2s;
}
.fvh__tab svg { flex-shrink: 0; opacity: .7; }
.fvh__tab--active {
  background: #fff; color: var(--plum-700, #572362);
  box-shadow: 0 2px 8px rgba(46,18,56,.1);
}
.fvh__tab--active svg { opacity: 1; color: var(--gold-deep, #9e7c10); }
.fvh__tab-count {
  font-size: 11px; font-weight: 800;
  background: rgba(87,35,98,.08); color: var(--plum-700, #572362);
  padding: 2px 8px; border-radius: 100px;
}
.fvh__tab--active .fvh__tab-count { background: var(--gold, #c9a227); color: #2a1800; }

/* ── پنل ── */
.fvh__panel { padding: 22px 24px 20px; }

.fvh__srow {
  display: flex; align-items: stretch; gap: 10px;
  margin-bottom: 16px;
}
.fvh__sfield {
  flex: 1; min-width: 0;
  display: flex; align-items: center; gap: 10px;
  background: var(--cream, #fbf6ec);
  border: 1px solid var(--line, #e5d9c6);
  border-radius: 13px;
  padding: 0 14px;
}
.fvh__sfield:focus-within { border-color: var(--plum-700, #572362); background: #fff; }
.fvh__sico { color: var(--ink-soft, #8a7090); flex-shrink: 0; }
.fvh__sinput {
  flex: 1; min-width: 0; border: none; outline: none; background: transparent;
  font-family: inherit; font-size: 14.5px; color: var(--ink, #231430);
  height: 48px;
}
.fvh__sinput::placeholder { color: #b8aac2; font-size: 13.5px; }
.fvh__sbtn {
  flex-shrink: 0;
  background: var(--plum-700, #572362); color: #fff;
  border: none; border-radius: 13px;
  padding: 0 26px; font-family: inherit; font-size: 14px; font-weight: 700;
  transition: opacity .15s, transform .12s;
}
.fvh__sbtn:hover { opacity: .9; }
.fvh__sbtn:active { transform: scale(.97); }

/* ── فیلترهای سریع ── */
.fvh__frow {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px;
}
.fvh__fcell { display: flex; flex-direction: column; gap: 5px; }
.fvh__flabel { font-size: 11.5px; font-weight: 700; color: var(--ink-soft, #8a7090); padding-inline: 2px; }
.fvh__fsel {
  height: 42px; padding: 0 12px;
  border: 1px solid var(--line, #e5d9c6); border-radius: 10px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%238a7090' stroke-width='2.5'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat left 10px center;
  font-family: inherit; font-size: 13px; color: var(--ink, #231430);
  appearance: none; -webkit-appearance: none;
  cursor: pointer;
}
.fvh__fsel:focus { outline: none; border-color: var(--plum-700, #572362); }

/* ── به‌زودی ── */
.fvh__soon {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 14px 24px 18px;
  border-top: 1px dashed var(--line, #e5d9c6);
}
.fvh__soon-label { font-size: 11.5px; font-weight: 700; color: var(--ink-soft, #8a7090); }
.fvh__soon-chip {
  font-size: 11.5px; font-weight: 600; color: var(--ink-soft, #8a7090);
  background: var(--cream, #fbf6ec);
  border: 1px dashed var(--line, #e5d9c6);
  padding: 4px 12px; border-radius: 100px;
  opacity: .8;
}

/* ══════════════════════════════════════════
   ریسپانسیو — موبایل اولویت
══════════════════════════════════════════ */
@media (max-width: 640px) {
  .fvh { padding: 36px 0 40px; }
  .fvh__text { padding-bottom: 24px; }
  .fvh__console { border-radius: 18px; margin-inline: 4px; }
  .fvh__tabs { padding: 5px; gap: 5px; }
  .fvh__tab { font-size: 13px; padding: 12px 8px; gap: 6px; border-radius: 12px; }
  .fvh__tab svg { width: 16px; height: 16px; }
  .fvh__tab-count { font-size: 10px; padding: 2px 6px; }
  .fvh__panel { padding: 18px 16px 16px; }
  .fvh__srow { flex-direction: column; gap: 8px; margin-bottom: 14px; }
  .fvh__sfield { border-radius: 12px; }
  .fvh__sinput { height: 46px; }
  .fvh__sbtn { height: 46px; border-radius: 12px; }
  .fvh__frow { grid-template-columns: 1fr; gap: 8px; }
  .fvh__fsel { height: 44px; }
  .fvh__soon { padding: 12px 16px 16px; }
}
@media (min-width: 641px) and (max-width: 860px) {
  .fvh__frow { grid-template-columns: repeat(2, 1fr); }
  .fvh__frow .fvh__fcell:last-child { grid-column: 1 / -1; }
}

.fv-trust { background: var(--champagne, #f3e9d5); border-top: 1px solid var(--line, #e5d9c6); border-bottom: 1px solid var(--line, #e5d9c6); }
.fv-trust__inner { display: flex; flex-wrap: wrap; justify-content: space-around; align-items: center; gap: 20px; padding: 28px 24px; }
.fv-stat { text-align: center; min-width: 130px; }
.fv-stat__num { display: block; font-size: clamp(26px,4vw,36px); font-weight: 800; color: var(--plum-800, #3f1a4e); letter-spacing: -1px; line-height: 1; }
.fv-stat__num em { font-style: normal; color: var(--gold-deep, #9e7c10); }
.fv-stat__label { font-size: 13px; color: var(--ink-soft, #8a7090); font-weight: 600; margin-top: 5px; display: block; }

.fv-carpets { padding: 68px 0; }
.fv-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 22px; }
/* استایل کارت (.fv-card و فرزندانش) در archive.css تعریف شده —
   چون fv_card() در همه‌جای سایت (آرشیو، AJAX، صفحه اصلی) یکسان است */

.fv-budget { background: var(--plum-950, #1e0d24); padding: 68px 0; }
.fv-tiers { display: grid; grid-template-columns: repeat(5,1fr); gap: 16px; }
.fv-tier { border: 1px solid rgba(201,162,39,.18); border-radius: var(--r-md, 16px); padding: 26px 20px; background: linear-gradient(180deg,rgba(255,255,255,.04),transparent); transition: border-color .2s, transform .2s; display: block; color: #fff; }
.fv-tier:hover { border-color: var(--gold, #c9a227); transform: translateY(-5px); }
.fv-tier__icon { width: 46px; height: 46px; border-radius: 8px; background: rgba(201,162,39,.14); color: #e9c766; display: grid; place-items: center; margin-bottom: 16px; font-size: 20px; font-weight: 800; }
.fv-tier__name { font-size: 18px; font-weight: 800; }
.fv-tier__range { color: var(--teal-lite, #2ab3c4); font-size: 13px; font-weight: 700; margin-top: 5px; display: block; }
.fv-tier__desc { color: #c5b2cc; font-size: 12.5px; line-height: 1.8; margin-top: 10px; }

.fv-sellers { padding: 68px 0; }
.fv-sellers-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; }
.fv-scard { background: var(--paper, #fffdf8); border: 1px solid var(--line, #e5d9c6); border-radius: var(--r-lg, 22px); padding: 26px; text-align: center; box-shadow: var(--sh-sm); transition: transform .2s, box-shadow .2s; display: block; color: var(--ink, #231430); }
.fv-scard:hover { transform: translateY(-5px); box-shadow: var(--sh-md); }
.fv-scard__logo { width: 66px; height: 66px; border-radius: 18px; margin: 0 auto 16px; background: conic-gradient(from 45deg, #572362, #137a88, #c9a227, #572362); overflow: hidden; display: grid; place-items: center; }
.fv-scard__logo img { width: 100%; height: 100%; object-fit: cover; }
.fv-scard__name { font-size: 15.5px; font-weight: 800; }
.fv-scard__meta { color: var(--ink-soft, #8a7090); font-size: 12.5px; font-weight: 600; margin-top: 5px; }
.fv-scard__verify { margin-top: 12px; display: inline-flex; align-items: center; gap: 5px; color: var(--teal, #137a88); font-size: 11.5px; font-weight: 700; background: rgba(19,122,136,.1); border: 1px solid rgba(19,122,136,.2); padding: 5px 12px; border-radius: 100px; }

.fv-seller-cta { padding: 68px 0; }
.fv-cta-box { background: linear-gradient(125deg, var(--plum-900, #2e1238), var(--plum-700, #572362)); border-radius: 28px; padding: 58px 52px; color: #fff; position: relative; overflow: hidden; box-shadow: var(--sh-lg); display: grid; grid-template-columns: 1fr auto; gap: 40px; align-items: center; }
.fv-cta-box::before { content: ''; position: absolute; left: -80px; top: -80px; width: 320px; height: 320px; border-radius: 50%; pointer-events: none; background: radial-gradient(circle, rgba(201,162,39,.28), transparent 65%); }
.fv-cta-box__content { position: relative; z-index: 2; }
.fv-cta-box__title { font-size: clamp(22px,3.2vw,34px); font-weight: 800; letter-spacing: -.6px; line-height: 1.35; }
.fv-cta-box__desc { color: #dcc8e4; font-size: 16px; margin-top: 14px; line-height: 1.85; max-width: 560px; }
.fv-cta-box__acts { display: flex; gap: 14px; margin-top: 26px; flex-wrap: wrap; }
.fv-cta-box__visual { position: relative; z-index: 2; width: 190px; height: 190px; border-radius: 24px; border: 1px solid rgba(233,199,102,.3); background: rgba(255,255,255,.06); display: grid; place-items: center; font-size: 78px; flex: 0 0 auto; }

@media (max-width: 1100px) { .fv-grid { grid-template-columns: repeat(3,1fr); } .fv-tiers { grid-template-columns: repeat(3,1fr); } }
@media (max-width: 900px) { .fv-sellers-grid { grid-template-columns: repeat(2,1fr); } .fv-cta-box { grid-template-columns: 1fr; } .fv-cta-box__visual { display: none; } }
@media (max-width: 768px) { .fv-grid { grid-template-columns: repeat(2,1fr); gap: 14px; } .fv-tiers { grid-template-columns: repeat(2,1fr); } .fv-cta-box { padding: 36px 28px; } }
@media (max-width: 480px) { .fv-grid, .fv-tiers, .fv-sellers-grid { grid-template-columns: 1fr; } }