/* ============================================================================
   الجی اورجینال — استایل مخصوص صفحه اصلی
   فقط در «/» لود می‌شود (کنترلر با pageCss=home می‌فرستد) تا وزن CSS
   بقیه صفحات بی‌دلیل بالا نرود.
   ========================================================================= */

/* ─── اسلایدر ──────────────────────────────────────────────────────────── */
.hero{position:relative;background:var(--ink);overflow:hidden}
.hero__slide{position:relative;display:block}
.hero__slide img{width:100%;height:auto;object-fit:cover}
.hero__cap{position:absolute;inset-inline-end:6%;top:50%;transform:translateY(-50%);
  max-width:min(46%,520px);color:#fff;text-shadow:0 2px 20px rgba(0,0,0,.6)}
.hero__cap h2{font-size:clamp(19px,2.6vw,34px);margin-bottom:10px}
.hero__cap p{font-size:clamp(13px,1.4vw,16px);opacity:.9;margin-bottom:18px}
/* نوار قرمز نازک زیر اسلایدر — امضای بصری برند */
.hero::after{content:'';position:absolute;bottom:0;inset-inline:0;height:4px;
  background:linear-gradient(90deg,var(--gold-dark),var(--gold),var(--gold-dark))}

/* ─── کاشی دسته‌بندی ───────────────────────────────────────────────────
   بنرها خودشان عنوان دسته را روی تصویر دارند، پس زیرشان عنوان تکراری
   چاپ نمی‌شود.

   ⚠ تصویر *کراپ نمی‌شود و تیره هم نمی‌شود*: با object-fit:cover لبه‌های
   بنر بریده می‌شد و عنوانِ روی تصویر ناقص دیده می‌شد، و پردهٔ تیره هم
   رنگ‌های خود بنر را کدر می‌کرد. حالا `contain` است و هیچ لایه‌ای روی
   تصویر نمی‌نشیند. برچسب تعداد بیرون از تصویر، در نوار پایین کاشی است. */
.cat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media(min-width:640px){.cat-grid{grid-template-columns:repeat(3,1fr);gap:16px}}
@media(min-width:1000px){.cat-grid{grid-template-columns:repeat(4,1fr);gap:18px}}

.cat-tile{position:relative;display:flex;flex-direction:column;
  border-radius:var(--r-md);overflow:hidden;background:#fff;
  border:1px solid var(--line);
  transition:transform var(--ease),box-shadow var(--ease),border-color var(--ease)}
.cat-tile:hover{transform:translateY(-4px);box-shadow:var(--sh-3);
  border-color:var(--gold-light)}

.cat-tile img{width:100%;height:auto;display:block;object-fit:contain}

/* حالت جایگزین: اگر بنر اختصاصی آپلود نشده باشد، عنوان زیر تصویر می‌آید —
   چون در آن حالت تصویر، نام دسته را روی خودش ندارد. */
.cat-tile__name{display:block;padding:9px 12px;font-size:13.5px;font-weight:600;
  text-align:center;border-top:1px solid var(--line-2);background:#fff;
  margin-top:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cat-tile--plain img{aspect-ratio:16/10;object-fit:contain;padding:10px}

/* ─── بخش درباره ───────────────────────────────────────────────────────── */
.about-split{display:grid;gap:28px;align-items:center}
@media(min-width:860px){.about-split{grid-template-columns:1fr 1.15fr}}
.about-split__media{position:relative}
.about-split__media img{border-radius:var(--r-lg);width:100%;box-shadow:var(--sh-2)}
.about-split__media::before{content:'';position:absolute;inset-inline-start:-14px;top:-14px;
  width:52%;height:52%;border:3px solid var(--gold);border-radius:var(--r-lg);z-index:-1}

/* ─── مشاوره و استعلام قیمت ────────────────────────────────────────────
   بازطراحی: به‌جای سه کارت هم‌شکل، یک بلوک دوستونه با سلسله‌مراتب روشن —
   تماس مستقیم مهم‌ترین کنش است، واتساپ دوم، بقیه کوچک‌تر. */
.consult{position:relative;display:grid;gap:26px;overflow:hidden;
  background:linear-gradient(135deg,#141414,#242424 55%,#1b1b1b);
  border-radius:var(--r-lg);padding:32px;color:#fff}
@media(min-width:900px){.consult{grid-template-columns:1fr 1fr;gap:40px;padding:40px 44px}}

/* هاله قرمز کم‌رنگ گوشه — عمق می‌دهد بدون شلوغی */
.consult::before{content:'';position:absolute;inset-inline-end:-90px;top:-110px;
  width:320px;height:320px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(var(--gold-rgb),.34),transparent 68%)}
.consult>*{position:relative;z-index:1}

.consult__eyebrow{display:inline-flex;align-items:center;gap:7px;
  background:rgba(var(--gold-rgb),.18);border:1px solid rgba(var(--gold-rgb),.4);
  color:#ffd9e4;font-size:12.5px;font-weight:600;
  padding:5px 13px;border-radius:var(--r-full);margin-bottom:14px}
.consult__intro h2{font-size:clamp(20px,2.4vw,27px);margin-bottom:10px}
.consult__intro p{color:#c4c4c4;font-size:14.5px;margin-bottom:18px}

.consult__points{display:grid;gap:9px;list-style:none}
.consult__points li{display:flex;align-items:flex-start;gap:9px;
  font-size:13.5px;color:#d6d6d6;line-height:1.8}
.consult__points svg{color:var(--gold-light);flex:none;margin-top:5px}

.consult__actions{display:grid;gap:12px;align-content:center}

.consult__card{display:flex;align-items:center;gap:14px;padding:16px 18px;
  border-radius:var(--r-md);border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.055);transition:all var(--ease)}
.consult__card:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.28);
  background:rgba(255,255,255,.1)}
.consult__card--primary{background:var(--gold);border-color:var(--gold)}
.consult__card--primary:hover{background:var(--gold-dark);border-color:var(--gold-dark)}
.consult__card--wa:hover{background:rgba(37,211,102,.16);border-color:var(--wa)}

.consult__ico{width:46px;height:46px;border-radius:50%;flex:none;display:grid;
  place-items:center;background:rgba(255,255,255,.16);color:#fff}
.consult__card--wa .consult__ico{background:var(--wa)}
.consult__body{flex:1;min-width:0;display:grid;gap:2px}
.consult__label{font-size:12.5px;color:rgba(255,255,255,.75)}
.consult__card--primary .consult__label{color:rgba(255,255,255,.85)}
.consult__value{font-size:17px;font-weight:700;letter-spacing:.4px}
.consult__arrow{flex:none;opacity:.6;transition:transform var(--ease)}
.consult__card:hover .consult__arrow{opacity:1;transform:translateX(-4px)}

.consult__row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.consult__mini{display:flex;align-items:center;gap:10px;padding:12px 14px;
  border-radius:var(--r-md);border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.04);transition:all var(--ease)}
.consult__mini:hover{border-color:rgba(var(--gold-rgb),.6);background:rgba(var(--gold-rgb),.12)}
.consult__mini svg{color:var(--gold-light);flex:none}
.consult__mini span{display:grid;min-width:0}
.consult__mini small{font-size:11.5px;color:rgba(255,255,255,.6)}
.consult__mini b{font-size:14px;font-weight:600;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}

@media(max-width:560px){
  .consult{padding:22px 18px}
  .consult__row{grid-template-columns:1fr}
  .consult__value{font-size:15.5px}
  .consult__ico{width:40px;height:40px}
}

@media (prefers-reduced-motion:reduce){
  .cat-tile,.cat-tile img,.consult__card,.consult__mini{transition:none}
}