/* ═══════════════════════════════════════════════════════════════════════
   Fastitem 7.2 — صفحهٔ اصلی «Fastitem Home 1a» (Claude Design، ۲۰۲۶-۰۹-۰۵)
   فقط روی صفحهٔ اصلی لود می‌شود (is_home). همهٔ سلکتورها زیر body.home هستند
   تا هدر/فوتر بقیهٔ صفحات دست‌نخورده بماند.
   ═══════════════════════════════════════════════════════════════════════ */

body.home {
  --fh-bg: #0f1116;
  --fh-bg2: #14161c;
  --fh-card: #181a21;
  --fh-card2: #1d2029;
  --fh-line: #262933;
  --fh-line2: #30343f;
  --fh-text: #e8eaf0;
  --fh-muted: #8b90a0;
  --fh-muted2: #5f6470;
  --fh-blue: #3d5afe;
  --fh-blue2: #2f48d6;
  --fh-green: #4ade80;
  --fh-orange: #f59e0b;
  --fh-red: #e0322d;
  --fh-yellow: #f2c230;
  --fh-radius: 14px;
  --fh-gutter: 24px; /* قاعدهٔ فول‌واید: ۲۴ → ۳۲ → ۴۸ با عرض صفحه */
  background: var(--fh-bg) !important;
  background-image: none !important;
  color: var(--fh-text);
}

:root:has(body.home) { background: #0f1116; }
body.home > br { display: none; }

/* ───────────────────────── بنرها ───────────────────────── */
/* بنرها (قاعدهٔ فول‌واید): نسبت ثابت؛ تا ۱۶۰۰ دو ردیف (۲ بزرگ ۶۲۰/۲۱۰ + ۳ کوچک ۴۱۰/۱۶۰)، از ۱۶۰۰ یک ردیف ۲۳۰px با ستون‌های 1.6fr 1.6fr 1fr 1fr 1fr */
body.home .fh-banners { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin: 20px 0 28px; }
body.home .fh-banner {
  position: relative; display: block; border-radius: var(--fh-radius); overflow: hidden; border: 1px solid var(--fh-line);
  background: var(--fh-card); color: #fff; text-decoration: none; isolation: isolate; transition: transform .25s, border-color .25s;
}
body.home .fh-banner:hover { transform: translateY(-2px); border-color: var(--fh-line2); color: #fff; }
body.home .fh-banner-lg { grid-column: span 3; aspect-ratio: 620 / 210; }
body.home .fh-banner-sm { grid-column: span 2; aspect-ratio: 410 / 160; }
@media (min-width: 1600px) {
  body.home .fh-banners { grid-template-columns: 1.6fr 1.6fr 1fr 1fr 1fr; }
  body.home .fh-banner-lg, body.home .fh-banner-sm { grid-column: auto; aspect-ratio: auto; height: 230px; }
}
body.home .fh-banner .fh-art {
  position: absolute; inset: 0; background-repeat: no-repeat; background-size: cover; background-position: center; z-index: -2;
  transition: transform .5s;
}
body.home .fh-banner:hover .fh-art { transform: scale(1.03); }
body.home .fh-banner .fh-shade { position: absolute; inset: 0; z-index: -1; }
body.home .fh-banner-lg .fh-shade { background: linear-gradient(to left, var(--sh, #14161c) 0%, var(--sh, #14161c) 38%, rgba(20,22,28,.85) 55%, rgba(20,22,28,0) 100%); }
body.home .fh-banner-sm .fh-shade { background: linear-gradient(to top, rgba(15,17,22,.95) 0%, rgba(15,17,22,.55) 45%, rgba(15,17,22,.05) 100%); }
body.home .fh-banner-lg .fh-btxt { position: absolute; right: 24px; top: 22px; max-width: 55%; }
body.home .fh-banner-lg h3 { margin: 0 0 6px; font-size: 22px; font-weight: 800; color: #fff; line-height: 1.4; }
body.home .fh-banner-lg h3 span { font-family: 'Rajdhani', sans-serif; font-size: 24px; letter-spacing: .01em; }
body.home .fh-banner-lg p { margin: 0 0 14px; font-size: 13px; color: #c9cdd8; }
body.home .fh-banner .fh-bbtn {
  display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 14px; border-radius: 9px; font-size: 13px; font-weight: 700;
  color: #fff; background: var(--bb, var(--fh-blue));
}
body.home .fh-banner .fh-bbtn svg { width: 14px; height: 14px; }
body.home .fh-banner-sm h3 { position: absolute; right: 16px; bottom: 12px; margin: 0; font-size: 16px; font-weight: 800; color: #fff; }
body.home .fh-banner-sm h3 span { font-family: 'Rajdhani', sans-serif; font-size: 17px; }

/* ───────────────────────── عنوان بخش ───────────────────────── */
body.home .fh-sec { margin: 0 0 28px; }
body.home .fh-sechead { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
body.home .fh-badge {
  width: 30px; height: 30px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center;
  font-family: 'Rajdhani', sans-serif; font-weight: 700; font-size: 12px; color: #0b0c10; flex: 0 0 auto;
}
body.home .fh-sechead h2 { margin: 0; font-size: 18px; font-weight: 800; color: var(--fh-text); }
body.home .fh-sechead h2 span { font-family: 'Rajdhani', sans-serif; font-size: 19px; }
body.home .fh-sechead small { font-size: 12px; color: var(--fh-muted); margin-right: 2px; }
body.home .fh-all {
  margin-right: auto; display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 12px; border-radius: 9px;
  border: 1px solid var(--fh-line2); color: var(--fh-text); font-size: 13px; font-weight: 700; text-decoration: none; background: transparent; transition: background .2s;
}
body.home .fh-all:hover { background: var(--fh-card); color: #fff; }
body.home .fh-all svg { width: 14px; height: 14px; }

/* ───────────────────────── گرید کارت‌ها ───────────────────────── */
/* تمام‌عرض: هر تعداد کارت که در یک ردیف جا شود؛ ردیف‌های بعدی با grid-auto-rows:0 مخفی می‌شوند */
body.home .fh-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); column-gap: 12px; row-gap: 0;
  grid-template-rows: auto; grid-auto-rows: 0; overflow: hidden;
}
@media (max-width: 600px) {
  body.home .fh-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 10px; }
}

/* ───────────────────────── بلاگ ───────────────────────── */
/* بلاگ: مثل کارت‌ها — کارت ثابت (حداقل ۳۰۰px)، تعداد با عرض بیشتر می‌شود، فقط یک ردیف */
body.home .fh-blog { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); column-gap: 12px; row-gap: 0; grid-template-rows: auto; grid-auto-rows: 0; overflow: hidden; }
@media (max-width: 900px) { body.home .fh-blog { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { body.home .fh-blog { grid-template-columns: 1fr; } }
body.home .fh-post { background: var(--fh-card); border: 1px solid var(--fh-line); border-radius: var(--fh-radius); overflow: hidden; text-decoration: none; display: block; transition: border-color .2s, transform .2s; }
body.home .fh-post:hover { border-color: var(--fh-line2); transform: translateY(-2px); }
body.home .fh-post .fh-pimg { height: 180px; width: 100%; background: var(--fh-card2); overflow: hidden; border-bottom: 1px solid var(--fh-line); }
body.home .fh-post .fh-pimg img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s; }
body.home .fh-post:hover .fh-pimg img { transform: scale(1.04); }
body.home .fh-post .fh-pbody { padding: 12px 14px 14px; }
body.home .fh-post .fh-pcat { font-size: 11px; font-weight: 700; color: var(--fh-orange); }
body.home .fh-post h3 { margin: 6px 0 8px; font-size: 14px; font-weight: 800; color: var(--fh-text); line-height: 1.7; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
body.home .fh-post .fh-pmeta { font-size: 11px; color: var(--fh-muted); }

/* ───────────────────────── ریسپانسیو ───────────────────────── */
@media (max-width: 991px) {
  body.home .fh-banners { grid-template-columns: repeat(2, 1fr); }
  body.home .fh-banner-lg { grid-column: span 2; }
  body.home .fh-banner-sm { grid-column: span 1; }
}
@media (max-width: 600px) {
  body.home .fh-banners { gap: 8px; margin: 14px 0 22px; }
  body.home .fh-banner-lg { aspect-ratio: 620 / 240; }
  body.home .fh-banner-lg .fh-btxt { right: 14px; top: 14px; max-width: 65%; }
  body.home .fh-banner-lg h3 { font-size: 18px; }
  body.home .fh-banner-sm { aspect-ratio: 410 / 170; }
  body.home .fh-banner-sm h3 { font-size: 13px; right: 10px; bottom: 8px; }
  body.home .fh-sechead h2 { font-size: 16px; }
  body.home .fh-price b { font-size: 14px; }
  body.home .fh-buy { font-size: 11px; }
}

/* ───────────────────────── موبایل: لیست بازی‌ها به‌جای بنر (طرح ۲۰۲۶-۰۹-۰۷) ───────────────────────── */
body.home .fh-mgames { display: none; }
@media (max-width: 767px) {
  body.home .fh-banners { display: none !important; }
  body.home .fh-mgames { display: flex; flex-direction: column; margin: 14px 0 22px; background: #14161c; border: 1px solid var(--fh-line); border-radius: 16px; overflow: hidden; }
  body.home .fh-mgame { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-bottom: 1px solid var(--fh-line); text-decoration: none !important; color: var(--fh-text); }
  body.home .fh-mgame:last-child { border-bottom: 0; }
  body.home .fh-mgame:active { background: rgba(255,255,255,.04); }
  body.home .fh-mgame .fh-badge { width: 38px; height: 38px; border-radius: 10px; font-size: 13px; }
  body.home .fh-mgame-t { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
  body.home .fh-mgame-t b { font-size: 15px; font-weight: 800; color: #fff; }
  body.home .fh-mgame-t small { font-size: 11.5px; color: var(--fh-muted); }
  body.home .fh-mgame-c { width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; color: var(--fh-muted); flex: 0 0 auto; }
  body.home .fh-mgame-c svg { width: 16px; height: 16px; }
  /* سربرگ بخش: بج + عنوان + زیرعنوان کوچک، دکمهٔ «همه» فشرده در چپ */
  body.home .fh-sechead { gap: 8px; margin-bottom: 12px; }
  body.home .fh-sechead h2 { font-size: 16px; }
  body.home .fh-sechead small { font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
  body.home .fh-all { height: 32px; padding: 0 10px; font-size: 12.5px; gap: 6px; flex: 0 0 auto; }
  body.home .fh-all .fh-all-l { display: none; }
  body.home .fh-all svg { width: 12px; height: 12px; }
  body.home .fh-sec { margin-bottom: 22px; }
}
