/**
 * فوتر سایت، مستقل از دیزاین‌سیستم fund.
 *
 * فوتر حالا روی کل سایت رندر می‌شود، ولی قواعدش در main.css زندگی می‌کند
 * که یک دیزاین‌سیستم کامل ۱۷۴ کیلوبایتی است و روی صفحات قدیمیِ Tailwind‌محور
 * (۴۰۴، /video/، آرشیو وبینار) تداخل می‌سازد — مثلا `.container` هر دو
 * تعریف متفاوتی دارند.
 *
 * پس همان قواعد فوتر اینجا مستقل استخراج شده‌اند و فقط روی صفحاتی لود
 * می‌شوند که main.css ندارند (inc/fund-assets.php). صفحات fund این فایل را
 * نمی‌گیرند تا CSS تکراری نشود.
 *
 * اگر استایل فوتر را در main.css عوض کردی، اینجا را هم هماهنگ کن.
 */

/* متغیرهای رنگی‌ای که قواعد زیر به آن‌ها تکیه دارند */
:root {
	--primary: #f7a01d;
	--dark-2:  #1e2125;
}

/* .container در صفحات قدیمی مال Tailwind است؛ داخل فوتر رفتار fund را می‌خواهیم */
.site-footer .container {
	width: 100%; max-width: 1200px; margin-inline: auto; padding-inline: 20px;
}

/* دکمه‌ی خبرنامه — تنها .btn ای که داخل فوتر رندر می‌شود */
.site-footer .btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	border-radius: 999px; font-weight: 700; text-decoration: none; cursor: pointer;
	border: 1px solid transparent; transition: filter .2s, transform .2s;
}
.site-footer .btn--primary { background: var(--primary); color: #fff; }
.site-footer .btn--primary:hover { filter: brightness(1.06); }
.site-footer .btn--sm { padding: 8px 16px; font-size: 14px; }

/* نمادهای اعتماد */
.footer-badges { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: center; padding: 20px 0 4px; }
.footer-badges__item { display: inline-flex; align-items: center; }
.footer-badges__item img { max-height: 90px; width: auto; height: auto; }

/* ---------- Footer (charcoal — bitfa.io style) ---------- */
.site-footer { background: var(--dark-2); color: #fff; padding: 56px 0 24px; margin-top: 0; }
.site-footer__grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.2fr; gap: 30px; }
.site-footer .site-logo-text { color: #fff; }
.footer-logo-img { height: 36px; width: auto; }
.footer-about { color: #9a9da1; font-size: 14px; margin-top: 12px; }
.footer-widget__title, .footer-col h4 { font-size: 16px; margin-bottom: 14px; color: #fff; }
.footer-links li { margin-bottom: 8px; }
.footer-links a { color: #9a9da1; transition: .2s; }
.footer-links a:hover { color: var(--primary); }
.footer-social { display: flex; gap: 10px; margin-top: 16px; }
.footer-social a { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 8px; background: #2c2f34; color: #c9cbce; transition: .2s; }
.footer-social a:hover { color: #fff; background: var(--primary); }
.site-footer__bottom { margin-top: 36px; padding-top: 20px; border-top: 1px solid #33363b; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; color: #8a8d92; font-size: 13px; }
.footer-disclaimer { color: #6f7378; }
.landing-page .site-footer { display: none; }
@media (max-width: 980px) {
	.site-footer__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
	.site-footer__grid { grid-template-columns: 1fr; }
}
/* ── Footer socials ── */

.footer-social {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 16px;
}
.footer-social__link {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border-radius: 10px;
	background: rgba(255, 255, 255, .06);
	color: rgba(255, 255, 255, .72);
	transition: background .18s, color .18s, transform .18s;
}
.footer-social__link:hover {
	background: var(--primary, #f7a01d);
	color: #fff;
	transform: translateY(-2px);
}
/* ─────────────────────────────────────────────────────────────────────────
   فوتر io: دو ستون بیشتر از فوتر fund دارد («آموزش» و «بیتفا»)، پس شبکه‌ی
   چهارستونی main.css اینجا بازنویسی می‌شود. main.css دست‌نخورده می‌ماند تا
   کپی همگام با bitfa.fund باقی بماند.
   ───────────────────────────────────────────────────────────────────────── */
.site-footer__grid {
	grid-template-columns: 1.5fr repeat(4, 1fr) 1.1fr;
	gap: 24px;
}
/* پیوندهای حقوقی در نوار پایینی */
.footer-legal {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 18px;
	order: 2;
}
.footer-legal a {
	color: #a9acb1;
	transition: color .15s;
}
.footer-legal a:hover {
	color: var(--primary, #f7a01d);
}
@media (max-width: 1100px) {
	.site-footer__grid {
		grid-template-columns: repeat(3, 1fr);
	}
}
@media (max-width: 760px) {
	.site-footer__grid {
		grid-template-columns: 1fr 1fr;
	}
}
@media (max-width: 460px) {
	.site-footer__grid {
		grid-template-columns: 1fr;
	}
}