/*
 * baGPT — Landing Page Styles (/start/)
 * --------------------------------------
 * Self-contained, no Tailwind dependency. Namespace: .bagpt-l-*
 * تمام استایل‌ها داخل bagpt-landing-body / .bagpt-l-root scope هستند تا با چت اصلی تداخل نکنند.
 */

/* ---------- 1) Reset سبک، فقط روی این صفحه ---------- */
.bagpt-landing-body { margin: 0; padding: 0; }
.bagpt-landing-body * { box-sizing: border-box; }
.bagpt-landing-body img,
.bagpt-landing-body video { max-width: 100%; height: auto; display: block; }
.bagpt-landing-body button { font: inherit; cursor: pointer; }

/* ---------- 2) Design tokens ---------- */
.bagpt-l-root {
	--bg-deep: #050608;
	--bg-soft: #0a0d12;
	--bg-card: rgba(255, 255, 255, 0.04);
	--bg-card-strong: rgba(255, 255, 255, 0.06);
	--border-soft: rgba(255, 255, 255, 0.08);
	--border-mid: rgba(255, 255, 255, 0.14);
	--border-strong: rgba(255, 255, 255, 0.22);
	--text-primary: #f5f7fa;
	--text-soft: rgba(255, 255, 255, 0.78);
	--text-muted: rgba(255, 255, 255, 0.5);
	--text-faint: rgba(255, 255, 255, 0.32);
	--accent-cyan: #22d3ee;
	--accent-violet: #a78bfa;
	--accent-pink: #ec4899;
	--accent-emerald: #10b981;
	--gradient-galaxy: linear-gradient(135deg, #22d3ee 0%, #a78bfa 50%, #ec4899 100%);
	--gradient-soft: linear-gradient(135deg, rgba(34,211,238,0.18) 0%, rgba(167,139,250,0.18) 50%, rgba(236,72,153,0.18) 100%);
	--shadow-card: 0 18px 60px -20px rgba(34, 211, 238, 0.18), 0 8px 28px -12px rgba(167, 139, 250, 0.16);
	--shadow-strong: 0 30px 90px -28px rgba(34, 211, 238, 0.34), 0 16px 50px -20px rgba(167, 139, 250, 0.32);
	--ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
	--maxw: 1200px;
	--maxw-narrow: 880px;

	position: relative;
	min-height: 100vh;
	background: radial-gradient(ellipse at top, #0e1018 0%, var(--bg-deep) 50%, #020303 100%);
	color: var(--text-primary);
	font-family: 'Vazirmatn', system-ui, -apple-system, 'Segoe UI', sans-serif;
	font-size: 16px;
	line-height: 1.7;
	overflow-x: clip;
	direction: rtl;
}

/* ---------- 3) Background galaxy effects ---------- */
.bagpt-l-stars {
	position: fixed;
	inset: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
	pointer-events: none;
	opacity: 0.7;
}
.bagpt-l-glow-a,
.bagpt-l-glow-b {
	position: fixed;
	border-radius: 50%;
	filter: blur(120px);
	pointer-events: none;
	z-index: 0;
	opacity: 0.55;
	transition: transform 0.6s var(--ease);
}
.bagpt-l-glow-a {
	width: 720px; height: 720px;
	top: -200px; right: -180px;
	background: radial-gradient(circle, rgba(34,211,238,0.55), transparent 70%);
}
.bagpt-l-glow-b {
	width: 800px; height: 800px;
	bottom: -300px; left: -200px;
	background: radial-gradient(circle, rgba(167,139,250,0.55), transparent 70%);
}
.bagpt-l-grid {
	position: fixed;
	inset: 0;
	background-image:
		linear-gradient(to right, rgba(255,255,255,0.025) 1px, transparent 1px),
		linear-gradient(to bottom, rgba(255,255,255,0.025) 1px, transparent 1px);
	background-size: 56px 56px;
	mask-image: radial-gradient(ellipse at center, black 30%, transparent 75%);
	pointer-events: none;
	z-index: 0;
}

/* ---------- 4) Layout containers ---------- */
.bagpt-l-main { position: relative; z-index: 1; }
.bagpt-l-section {
	position: relative;
	z-index: 1;
	max-width: var(--maxw);
	margin: 0 auto;
	padding: 72px 24px;
}
@media (max-width: 720px) {
	.bagpt-l-section { padding: 80px 18px; }
}

/* ---------- 5) Top nav ---------- */
.bagpt-l-nav {
	position: sticky; top: 0; z-index: 50;
	padding: 14px 24px;
	backdrop-filter: blur(18px);
	-webkit-backdrop-filter: blur(18px);
	background: rgba(5, 6, 8, 0.55);
	border-bottom: 1px solid transparent;
	transition: border-color 0.3s var(--ease), background 0.3s var(--ease);
}
.bagpt-l-nav.is-scrolled {
	background: rgba(5, 6, 8, 0.82);
	border-bottom-color: var(--border-soft);
}
.bagpt-l-nav-inner {
	max-width: var(--maxw);
	margin: 0 auto;
	display: flex;
	align-items: center;
	gap: 24px;
}
.bagpt-l-brand {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	color: var(--text-primary);
	text-decoration: none;
	font-weight: 700;
	font-size: 18px;
	letter-spacing: 0.01em;
}
.bagpt-l-brand-mark {
	width: 28px; height: 28px;
	border-radius: 8px;
	background: var(--gradient-galaxy);
	box-shadow: 0 0 28px rgba(34, 211, 238, 0.5);
	position: relative;
}
.bagpt-l-brand-img {
	width: 32px;
	height: 32px;
	border-radius: 8px;
	object-fit: contain;
	background: transparent;
	flex-shrink: 0;
	display: block;
	/* glow ظریف هم‌خوان با تم کهکشانی */
	filter: drop-shadow(0 0 14px rgba(34, 211, 238, 0.35));
}
.bagpt-l-brand-mark::after {
	content: '';
	position: absolute; inset: 5px;
	border-radius: 4px;
	background: var(--bg-deep);
}
.bagpt-l-nav-links {
	display: flex; gap: 22px;
	margin: 0 auto;
}
.bagpt-l-nav-links a {
	color: var(--text-soft);
	text-decoration: none;
	font-size: 14px;
	transition: color 0.2s var(--ease);
	position: relative;
}
.bagpt-l-nav-links a:hover { color: var(--text-primary); }
.bagpt-l-nav-links a::after {
	content: '';
	position: absolute;
	bottom: -6px; right: 50%;
	transform: translateX(50%);
	width: 0; height: 2px;
	background: var(--gradient-galaxy);
	transition: width 0.25s var(--ease);
}
.bagpt-l-nav-links a:hover::after { width: 100%; }
.bagpt-l-nav-cta { display: flex; gap: 10px; }
@media (max-width: 860px) {
	.bagpt-l-nav-links { display: none; }
}

/* ---------- 6) Buttons ---------- */
.bagpt-l-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	border-radius: 12px;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	border: 1px solid transparent;
	transition: transform 0.2s var(--ease), box-shadow 0.2s var(--ease), background 0.2s var(--ease), border-color 0.2s var(--ease);
	white-space: nowrap;
}
.bagpt-l-btn:hover { transform: translateY(-1px); }
.bagpt-l-btn:active { transform: translateY(0); }
.bagpt-l-btn-lg { padding: 14px 24px; font-size: 15px; border-radius: 14px; }
.bagpt-l-btn-primary {
	background: var(--gradient-galaxy);
	color: #fff;
	/* لبهٔ ۱px transparent از `.bagpt-l-btn` نباید gradient را بکشد؛
	   با clip به padding-box همان gradient فقط داخل دکمه می‌ماند و
	   حاشیهٔ آبی مزاحم روی لبه‌ها نشت نمی‌کند. */
	border-color: transparent;
	background-clip: padding-box;
	-webkit-background-clip: padding-box;
	box-shadow: 0 10px 28px -10px rgba(34, 211, 238, 0.55), 0 6px 20px -8px rgba(167, 139, 250, 0.45);
}
.bagpt-l-btn-primary:hover {
	box-shadow: 0 16px 40px -10px rgba(34, 211, 238, 0.7), 0 10px 28px -8px rgba(236, 72, 153, 0.55);
}
.bagpt-l-btn-glass {
	background: rgba(255, 255, 255, 0.05);
	color: var(--text-primary);
	border-color: var(--border-mid);
	backdrop-filter: blur(8px);
}
.bagpt-l-btn-glass:hover {
	background: rgba(255, 255, 255, 0.09);
	border-color: var(--border-strong);
}
.bagpt-l-btn-ghost {
	background: transparent;
	color: var(--text-soft);
}
.bagpt-l-btn-ghost:hover { color: var(--text-primary); }

/* ---------- 7) Typography ---------- */
.bagpt-l-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: var(--text-soft);
	font-weight: 500;
	padding: 6px 14px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid var(--border-soft);
	margin-bottom: 18px;
}
.bagpt-l-eyebrow-dot {
	width: 7px; height: 7px;
	border-radius: 50%;
	background: var(--accent-emerald);
	box-shadow: 0 0 10px rgba(16, 185, 129, 0.7);
	animation: bagpt-l-pulse 2s var(--ease) infinite;
}
@keyframes bagpt-l-pulse {
	0%, 100% { opacity: 1; transform: scale(1); }
	50% { opacity: 0.5; transform: scale(1.3); }
}
.bagpt-l-h2 {
	font-size: clamp(28px, 4.4vw, 52px);
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.01em;
	margin: 0 0 16px;
}
.bagpt-l-h3 {
	font-size: clamp(22px, 2.6vw, 32px);
	font-weight: 700;
	line-height: 1.3;
	margin: 12px 0;
}
.bagpt-l-lead {
	font-size: clamp(15px, 1.6vw, 18px);
	color: var(--text-soft);
	max-width: 680px;
	margin: 0;
	line-height: 1.8;
}
.bagpt-l-p {
	color: var(--text-soft);
	font-size: 16px;
	line-height: 1.85;
	margin: 0 0 18px;
}
.bagpt-l-section-head {
	max-width: var(--maxw-narrow);
	margin: 0 auto 40px;
	text-align: center;
}
.bagpt-l-section-head .bagpt-l-lead {
	margin-left: auto;
	margin-right: auto;
}
.bagpt-l-grad-text {
	background: var(--gradient-galaxy);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
	background-size: 200% auto;
	animation: bagpt-l-grad-shift 6s linear infinite;
}
@keyframes bagpt-l-grad-shift {
	0% { background-position: 0% 50%; }
	50% { background-position: 100% 50%; }
	100% { background-position: 0% 50%; }
}

/* ---------- 8) Reveal-on-scroll ---------- */
[data-l-reveal] {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 0.9s var(--ease), transform 0.9s var(--ease);
}
[data-l-reveal].is-revealed {
	opacity: 1;
	transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
	[data-l-reveal] { opacity: 1; transform: none; transition: none; }
}
/* No-JS fallback: کلاس `.bagpt-l-no-js` ابتدا روی <html> در page-shell ست می‌شود
   و تنها در صورت اجرا شدن JS، توسط یک inline script کوچک حذف می‌شود.
   تا قبل از اجرای JS (یا اگر JS کلاً غیرفعال باشد)، تمام reveal block‌ها قابل
   مشاهده بمانند تا محتوای صفحه ناپدید نشود (مهم برای SEO، crawlers و کاربران
   بدون JS). همچنین برای جلوگیری از flash of hidden content روی first paint. */
.bagpt-l-no-js [data-l-reveal] { opacity: 1; transform: none; transition: none; }

/* عناصر داخل <noscript> فقط وقتی JS غیرفعال است وارد DOM می‌شوند؛
   پس نیازی به display:none پیش‌فرض نیست. این کلاس صرفاً برای خوانایی است. */

/* ---------- 9) HERO ---------- */
.bagpt-l-hero {
	position: relative;
	min-height: auto;
	display: flex;
	align-items: center;
	padding: 56px 24px 64px;
	max-width: var(--maxw);
	margin: 0 auto;
}
.bagpt-l-hero-inner {
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: 64px;
	align-items: center;
	width: 100%;
}
@media (max-width: 960px) {
	.bagpt-l-hero { padding: 50px 18px 40px; min-height: auto; }
	.bagpt-l-hero-inner { grid-template-columns: 1fr; gap: 40px; }
}
.bagpt-l-hero-title {
	font-size: clamp(34px, 5.8vw, 68px);
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -0.02em;
	margin: 0 0 22px;
}
.bagpt-l-hero-title-line { display: block; }
.bagpt-l-hero-desc {
	font-size: clamp(16px, 1.7vw, 19px);
	color: var(--text-soft);
	max-width: 560px;
	margin: 0 0 32px;
	line-height: 1.85;
}
.bagpt-l-hero-cta {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	margin-bottom: 28px;
}
.bagpt-l-hero-badges {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	list-style: none;
	padding: 0;
	margin: 0 0 36px;
}
.bagpt-l-hero-badges li {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid var(--border-soft);
	font-size: 13px;
	color: var(--text-soft);
}
.bagpt-l-hero-badges svg { color: var(--accent-cyan); }
.bagpt-l-hero-stats {
	display: flex;
	gap: 36px;
	margin: 0;
	padding-top: 24px;
	border-top: 1px solid var(--border-soft);
}
.bagpt-l-hero-stats div { display: flex; flex-direction: column; }
.bagpt-l-hero-stats dt {
	font-size: 12px;
	color: var(--text-muted);
	margin: 0 0 4px;
}
.bagpt-l-hero-stats dd {
	font-size: 22px;
	font-weight: 700;
	margin: 0;
	background: var(--gradient-galaxy);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}

/* Hero mock chat */
.bagpt-l-hero-mock {
	position: relative;
	border-radius: 22px;
	background: linear-gradient(180deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.02) 100%);
	border: 1px solid var(--border-mid);
	box-shadow: var(--shadow-strong);
	overflow: hidden;
	backdrop-filter: blur(14px);
	transform: perspective(1400px) rotateY(-4deg) rotateX(2deg);
	transition: transform 0.6s var(--ease);
}
.bagpt-l-hero-mock:hover {
	transform: perspective(1400px) rotateY(-2deg) rotateX(1deg);
}
@media (max-width: 960px) {
	.bagpt-l-hero-mock { transform: none; }
}
.bagpt-l-hero-mock::before {
	content: '';
	position: absolute;
	inset: -1px;
	border-radius: 22px;
	padding: 1px;
	background: linear-gradient(135deg, rgba(34,211,238,0.6), transparent 30%, transparent 70%, rgba(167,139,250,0.6));
	-webkit-mask: linear-gradient(#000, #000) content-box, linear-gradient(#000, #000);
	mask: linear-gradient(#000, #000) content-box, linear-gradient(#000, #000);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
	pointer-events: none;
}

/* Mock chrome (window header) */
.bagpt-l-mock-chrome {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 12px 16px;
	border-bottom: 1px solid var(--border-soft);
	background: rgba(0, 0, 0, 0.25);
}
.bagpt-l-mock-dot {
	width: 12px; height: 12px;
	border-radius: 50%;
	display: inline-block;
}
.bagpt-l-mock-dot--r { background: #ff5f57; }
.bagpt-l-mock-dot--y { background: #febc2e; }
.bagpt-l-mock-dot--g { background: #28c840; }
.bagpt-l-mock-title {
	margin: 0 12px;
	font-size: 13px;
	color: var(--text-muted);
}
.bagpt-l-mock-pulse {
	width: 8px; height: 8px;
	border-radius: 50%;
	background: var(--accent-emerald);
	margin-right: auto;
	box-shadow: 0 0 12px rgba(16, 185, 129, 0.7);
	animation: bagpt-l-pulse 1.6s ease-in-out infinite;
}
.bagpt-l-mock-replay {
	margin-right: auto;
	background: transparent;
	border: 1px solid var(--border-soft);
	color: var(--text-soft);
	padding: 6px 8px;
	border-radius: 8px;
	transition: background 0.2s var(--ease), color 0.2s var(--ease);
}
.bagpt-l-mock-replay:hover { background: rgba(255,255,255,0.06); color: var(--text-primary); }

.bagpt-l-mock-body {
	padding: 22px 18px;
	min-height: 280px;
	max-height: 380px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.bagpt-l-mock-body--lg { min-height: 380px; max-height: 480px; }

.bagpt-l-msg {
	display: flex;
	max-width: 85%;
	animation: bagpt-l-fade-in 0.4s var(--ease) both;
}
.bagpt-l-msg--user {
	align-self: flex-end;
	flex-direction: row-reverse;
}
.bagpt-l-msg-bubble {
	padding: 10px 14px;
	border-radius: 14px;
	font-size: 14.5px;
	line-height: 1.7;
	white-space: pre-wrap;
	word-break: break-word;
}
.bagpt-l-msg--user .bagpt-l-msg-bubble {
	background: var(--gradient-galaxy);
	color: #fff;
	border-radius: 14px 14px 4px 14px;
	box-shadow: 0 6px 20px -6px rgba(34, 211, 238, 0.4);
}
.bagpt-l-msg--ai .bagpt-l-msg-bubble {
	background: rgba(255, 255, 255, 0.06);
	color: var(--text-primary);
	border: 1px solid var(--border-soft);
	border-radius: 14px 14px 14px 4px;
}
.bagpt-l-msg--ai.is-thinking .bagpt-l-msg-bubble {
	color: var(--text-soft);
	font-style: italic;
}
.bagpt-l-typing-dot {
	display: inline-block;
	width: 6px; height: 6px;
	margin: 0 2px;
	border-radius: 50%;
	background: var(--accent-cyan);
	opacity: 0.5;
	animation: bagpt-l-typing 1.2s ease-in-out infinite;
}
.bagpt-l-typing-dot:nth-child(2) { animation-delay: 0.15s; }
.bagpt-l-typing-dot:nth-child(3) { animation-delay: 0.3s; }
@keyframes bagpt-l-typing {
	0%, 60%, 100% { opacity: 0.3; transform: translateY(0); }
	30% { opacity: 1; transform: translateY(-3px); }
}
@keyframes bagpt-l-fade-in {
	from { opacity: 0; transform: translateY(8px); }
	to { opacity: 1; transform: translateY(0); }
}

/* Mock input */
.bagpt-l-mock-input {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 12px 16px;
	border-top: 1px solid var(--border-soft);
	background: rgba(0, 0, 0, 0.2);
}
.bagpt-l-mock-input-text {
	color: var(--text-soft);
	font-size: 14px;
	flex: 1;
	min-height: 22px;
}
.bagpt-l-mock-caret {
	display: inline-block;
	width: 1.5px; height: 16px;
	background: var(--accent-cyan);
	animation: bagpt-l-blink 1s step-end infinite;
}
@keyframes bagpt-l-blink {
	50% { opacity: 0; }
}
.bagpt-l-mock-send {
	background: var(--gradient-galaxy);
	border: none;
	color: #fff;
	width: 32px; height: 32px;
	border-radius: 8px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* Hero scroll hint */
.bagpt-l-hero-scroll-hint {
	position: absolute;
	bottom: 18px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	color: var(--text-muted);
	font-size: 12px;
	animation: bagpt-l-bounce 2.4s ease-in-out infinite;
	pointer-events: none;
}
@keyframes bagpt-l-bounce {
	0%, 100% { transform: translate(-50%, 0); opacity: 0.7; }
	50% { transform: translate(-50%, 6px); opacity: 1; }
}

/* ---------- 10) Trust strip ---------- */
.bagpt-l-trust { padding: 28px 24px; }
.bagpt-l-trust-inner {
	max-width: var(--maxw);
	margin: 0 auto;
	text-align: center;
}
.bagpt-l-trust-label {
	font-size: 13px;
	color: var(--text-muted);
	margin: 0 0 18px;
}
.bagpt-l-trust-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	justify-content: center;
}
.bagpt-l-logo-pill {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 22px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid var(--border-soft);
	color: var(--text-soft);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.02em;
	transition: all 0.25s var(--ease);
}
.bagpt-l-logo-pill:hover {
	background: var(--gradient-soft);
	border-color: var(--border-mid);
	color: var(--text-primary);
	transform: translateY(-2px);
}
.bagpt-l-logo-dot {
	display: inline-block;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: linear-gradient(135deg, #22d3ee, #8b5cf6);
	box-shadow: 0 0 0 3px rgba(34, 211, 238, .12);
	flex: 0 0 auto;
}

/* ---------- 11) Chat showcase ---------- */
.bagpt-l-chat-tabs {
	max-width: 1100px;
	margin: 0 auto;
}
.bagpt-l-chat-tablist {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 10px;
	margin-bottom: 28px;
}
@media (max-width: 720px) {
	.bagpt-l-chat-tablist { grid-template-columns: repeat(2, 1fr); }
}
.bagpt-l-chat-tab {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 16px;
	background: var(--bg-card);
	border: 1px solid var(--border-soft);
	border-radius: 14px;
	color: var(--text-soft);
	text-align: right;
	transition: all 0.25s var(--ease);
}
.bagpt-l-chat-tab:hover {
	background: var(--bg-card-strong);
	border-color: var(--border-mid);
	color: var(--text-primary);
}
.bagpt-l-chat-tab.is-active {
	background: var(--gradient-soft);
	border-color: var(--accent-cyan);
	color: var(--text-primary);
	box-shadow: 0 8px 26px -10px rgba(34, 211, 238, 0.4);
}
.bagpt-l-chat-tab-icon {
	font-size: 22px;
	line-height: 1;
}
.bagpt-l-chat-tab-text { display: flex; flex-direction: column; gap: 2px; }
.bagpt-l-chat-tab-text strong { font-size: 14px; font-weight: 700; }
.bagpt-l-chat-tab-text small { font-size: 11.5px; color: var(--text-muted); }
.bagpt-l-chat-tab.is-active .bagpt-l-chat-tab-text small { color: var(--text-soft); }

.bagpt-l-chat-stage {
	border-radius: 22px;
	background: linear-gradient(180deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.015) 100%);
	border: 1px solid var(--border-mid);
	overflow: hidden;
	box-shadow: var(--shadow-strong);
	backdrop-filter: blur(14px);
}
.bagpt-l-chat-window { display: block; }

/* Web search source row */
.bagpt-l-msg-sources {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 8px;
}
.bagpt-l-msg-source {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 4px 9px;
	font-size: 11.5px;
	border-radius: 999px;
	background: rgba(34, 211, 238, 0.1);
	border: 1px solid rgba(34, 211, 238, 0.3);
	color: var(--accent-cyan);
}
.bagpt-l-deep-step {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 6px 10px;
	font-size: 12.5px;
	color: var(--text-soft);
	border-right: 2px solid var(--accent-violet);
	margin-bottom: 4px;
}
.bagpt-l-deep-check { color: var(--accent-emerald); }

/* ---------- 12) Studio rows ---------- */
.bagpt-l-section--studio .bagpt-l-section-head { margin-bottom: 72px; }
.bagpt-l-studio-row {
	display: grid;
	grid-template-columns: 1fr 1.15fr;
	gap: 60px;
	align-items: center;
	margin-bottom: 120px;
}
.bagpt-l-studio-row:last-of-type { margin-bottom: 0; }
.bagpt-l-studio-row--reverse { direction: ltr; }
.bagpt-l-studio-row--reverse > * { direction: rtl; }
@media (max-width: 880px) {
	.bagpt-l-section--studio .bagpt-l-section-head { margin-bottom: 40px; }
	.bagpt-l-studio-row { grid-template-columns: 1fr; gap: 28px; margin-bottom: 72px; }
	.bagpt-l-studio-row--reverse { direction: rtl; }
}

.bagpt-l-chip {
	display: inline-block;
	padding: 5px 12px;
	font-size: 12px;
	font-weight: 600;
	border-radius: 999px;
	background: rgba(167, 139, 250, 0.12);
	color: var(--accent-violet);
	border: 1px solid rgba(167, 139, 250, 0.3);
	margin-bottom: 12px;
	letter-spacing: 0.02em;
}
.bagpt-l-chip--ghost { background: rgba(255,255,255,0.05); color: var(--text-soft); border-color: var(--border-soft); }
.bagpt-l-chip--solid {
	background: var(--gradient-galaxy);
	color: #fff;
	border-color: transparent;
}
.bagpt-l-pill-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.bagpt-l-pill {
	padding: 6px 12px;
	font-size: 12.5px;
	border-radius: 8px;
	background: rgba(255,255,255,0.04);
	border: 1px solid var(--border-soft);
	color: var(--text-soft);
	font-weight: 600;
}

.bagpt-l-bullets {
	list-style: none;
	padding: 0;
	margin: 14px 0 0;
}
.bagpt-l-bullets li {
	position: relative;
	padding-right: 20px;
	color: var(--text-soft);
	margin-bottom: 8px;
	font-size: 15px;
}
.bagpt-l-bullets li::before {
	content: '';
	position: absolute;
	right: 0; top: 12px;
	width: 8px; height: 8px;
	border-radius: 50%;
	background: var(--gradient-galaxy);
}

/* Before/After slider */
.bagpt-l-ba {
	position: relative;
	aspect-ratio: 4 / 5;
	border-radius: 22px;
	overflow: hidden;
	border: 1px solid var(--border-mid);
	box-shadow: var(--shadow-strong);
	user-select: none;
	/* pan-y: کاربر می‌تواند صفحه را عمودی اسکرول کند ولی حرکت افقی
	   به دست JS می‌رسد (برای drag روی slider). این روی موبایل مهم است
	   تا scroll مزاحم نباشد. */
	touch-action: pan-y;
}
.bagpt-l-ba-before,
.bagpt-l-ba-after { will-change: clip-path; }
.bagpt-l-ba-handle { will-change: right; }
.bagpt-l-ba-after,
.bagpt-l-ba-before {
	position: absolute;
	inset: 0;
}
.bagpt-l-ba-before {
	clip-path: inset(0 0 0 var(--ba-pos, 50%));
	background: linear-gradient(180deg, #0e1018 0%, #050608 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 32px;
}
.bagpt-l-ba-prompt { text-align: center; max-width: 420px; }
.bagpt-l-ba-prompt p {
	color: var(--text-soft);
	font-size: 17px;
	line-height: 1.9;
	margin: 14px 0 0;
	font-style: italic;
}
.bagpt-l-ba-image {
	position: absolute;
	inset: 0;
}
.bagpt-l-ba-image--gen {
	background:
		radial-gradient(ellipse at 20% 100%, rgba(236,72,153,0.55), transparent 50%),
		radial-gradient(ellipse at 80% 0%, rgba(34,211,238,0.55), transparent 50%),
		linear-gradient(160deg, #1a0d24 0%, #0d1f2e 100%);
}
.bagpt-l-ba-image--gen::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image:
		radial-gradient(circle at 30% 65%, rgba(255,255,255,0.7) 1px, transparent 2px),
		radial-gradient(circle at 70% 30%, rgba(255,255,255,0.5) 1px, transparent 2px),
		radial-gradient(circle at 50% 50%, rgba(255,255,255,0.3) 1px, transparent 2px);
	background-size: 80px 80px, 120px 120px, 60px 60px;
	opacity: 0.6;
}
.bagpt-l-ba-image--gen::after {
	content: '';
	position: absolute;
	inset: 30% 25% 0 25%;
	background: radial-gradient(ellipse at top, rgba(255, 220, 180, 0.5), transparent 60%);
	filter: blur(20px);
}
.bagpt-l-ba-overlay {
	position: absolute;
	top: 16px; right: 16px;
}
.bagpt-l-ba-handle {
	position: absolute;
	top: 0; bottom: 0;
	right: var(--ba-pos, 50%);
	width: 2px;
	background: var(--gradient-galaxy);
	box-shadow: 0 0 20px rgba(34, 211, 238, 0.7);
	pointer-events: none;
}
.bagpt-l-ba-handle-grip {
	position: absolute;
	top: 50%;
	right: 50%;
	transform: translate(50%, -50%);
	width: 44px; height: 44px;
	border-radius: 50%;
	background: rgba(255,255,255,0.95);
	border: 2px solid var(--accent-cyan);
	box-shadow: 0 0 30px rgba(34, 211, 238, 0.6);
	display: flex;
	align-items: center;
	justify-content: center;
}
.bagpt-l-ba-handle-grip::before,
.bagpt-l-ba-handle-grip::after {
	content: '';
	position: absolute;
	width: 0; height: 0;
	border: 6px solid transparent;
}
.bagpt-l-ba-handle-grip::before {
	border-right-color: #050608;
	right: 60%;
}
.bagpt-l-ba-handle-grip::after {
	border-left-color: #050608;
	left: 60%;
}
.bagpt-l-ba-range {
	position: absolute;
	inset: 0;
	width: 100%; height: 100%;
	opacity: 0;
	cursor: ew-resize;
	margin: 0;
}

/* I2I */
.bagpt-l-i2i {
	display: flex;
	align-items: center;
	gap: 18px;
}
.bagpt-l-i2i-card {
	flex: 1;
	margin: 0;
	border-radius: 18px;
	border: 1px solid var(--border-mid);
	overflow: hidden;
	background: var(--bg-card);
	box-shadow: var(--shadow-card);
}
.bagpt-l-i2i-img {
	aspect-ratio: 1 / 1.1;
	background: #1a1a2e;
	position: relative;
}
.bagpt-l-i2i-img--ref {
	background:
		radial-gradient(ellipse at 50% 30%, rgba(255, 200, 150, 0.4), transparent 60%),
		linear-gradient(180deg, #2a2a3a 0%, #15151f 100%);
}
.bagpt-l-i2i-img--ref::after {
	content: '';
	position: absolute;
	inset: 25% 30% 15% 30%;
	background: radial-gradient(ellipse at 50% 30%, #c89e8a 0%, #6b4838 60%, transparent 100%);
	border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
	opacity: 0.7;
}
.bagpt-l-i2i-img--out {
	background:
		radial-gradient(ellipse at 50% 30%, rgba(255, 200, 150, 0.6), transparent 60%),
		radial-gradient(circle at 80% 100%, rgba(167, 139, 250, 0.5), transparent 50%),
		linear-gradient(180deg, #1a2540 0%, #0a0f1c 100%);
}
.bagpt-l-i2i-img--out::after {
	content: '';
	position: absolute;
	inset: 22% 28% 12% 28%;
	background: radial-gradient(ellipse at 50% 30%, #ffd4a8 0%, #a06850 60%, transparent 100%);
	border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
	box-shadow: 0 0 40px rgba(255, 180, 130, 0.5);
}
.bagpt-l-i2i-card figcaption {
	padding: 10px 14px;
	font-size: 13px;
	color: var(--text-muted);
	text-align: center;
	border-top: 1px solid var(--border-soft);
}
.bagpt-l-i2i-arrow {
	color: var(--accent-cyan);
	flex-shrink: 0;
	animation: bagpt-l-arrow-pulse 2s ease-in-out infinite;
}
@keyframes bagpt-l-arrow-pulse {
	0%, 100% { transform: translateX(0); opacity: 0.7; }
	50% { transform: translateX(-6px); opacity: 1; }
}

/* Video mock */
.bagpt-l-video-mock {
	position: relative;
	aspect-ratio: 16 / 9;
	border-radius: 22px;
	overflow: hidden;
	border: 1px solid var(--border-mid);
	box-shadow: var(--shadow-strong);
}
.bagpt-l-video-frame {
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse at 30% 30%, rgba(34,211,238,0.3), transparent 60%),
		radial-gradient(ellipse at 70% 80%, rgba(236,72,153,0.3), transparent 60%),
		linear-gradient(180deg, #0a1428 0%, #050608 100%);
	display: flex;
	align-items: center;
	justify-content: center;
}
.bagpt-l-video-shimmer {
	position: absolute;
	inset: 0;
	direction: ltr; /* جلوگیری از معکوس‌شدن جهت توسط RTL والد */
	background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,0.06) 50%, transparent 70%);
	animation: bagpt-l-shimmer 3s linear infinite;
	will-change: transform;
}
@keyframes bagpt-l-shimmer {
	0%   { transform: translateX(-100%); }
	100% { transform: translateX(100%); }
}
.bagpt-l-video-real {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	background: #050608;
}
.bagpt-l-video-play {
	color: rgba(255,255,255,0.9);
	background: rgba(0,0,0,0.4);
	border-radius: 50%;
	padding: 14px;
	width: 72px; height: 72px;
	border: 2px solid rgba(255,255,255,0.4);
	backdrop-filter: blur(8px);
	z-index: 2;
}
.bagpt-l-video-time {
	position: absolute;
	bottom: 16px; right: 16px;
	padding: 4px 10px;
	font-size: 12px;
	background: rgba(0,0,0,0.6);
	color: #fff;
	border-radius: 6px;
	z-index: 2;
}
.bagpt-l-video-progress {
	position: absolute;
	left: 16px; right: 16px; bottom: 50px;
	height: 3px;
	background: rgba(255,255,255,0.2);
	border-radius: 99px;
	overflow: hidden;
}
.bagpt-l-video-progress i {
	display: block;
	height: 100%;
	width: 35%;
	background: var(--gradient-galaxy);
	border-radius: 99px;
	animation: bagpt-l-progress 4s ease-in-out infinite;
}
@keyframes bagpt-l-progress {
	0% { width: 0%; }
	100% { width: 100%; }
}

/* SFX */
.bagpt-l-sfx {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.bagpt-l-sfx li {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px 16px;
	background: var(--bg-card);
	border: 1px solid var(--border-soft);
	border-radius: 14px;
}
.bagpt-l-sfx-icon { font-size: 22px; }
.bagpt-l-sfx-name { font-size: 14.5px; flex: 1; color: var(--text-soft); }
.bagpt-l-sfx-wave {
	display: inline-flex;
	align-items: center;
	gap: 2px;
	height: 24px;
}
.bagpt-l-sfx-wave i {
	display: inline-block;
	width: 3px;
	background: var(--gradient-galaxy);
	border-radius: 2px;
	animation: bagpt-l-wave 1.4s ease-in-out infinite;
}
.bagpt-l-sfx-wave i:nth-child(1)  { height: 30%; animation-delay: 0.0s; }
.bagpt-l-sfx-wave i:nth-child(2)  { height: 60%; animation-delay: 0.1s; }
.bagpt-l-sfx-wave i:nth-child(3)  { height: 80%; animation-delay: 0.2s; }
.bagpt-l-sfx-wave i:nth-child(4)  { height: 50%; animation-delay: 0.3s; }
.bagpt-l-sfx-wave i:nth-child(5)  { height: 90%; animation-delay: 0.4s; }
.bagpt-l-sfx-wave i:nth-child(6)  { height: 40%; animation-delay: 0.5s; }
.bagpt-l-sfx-wave i:nth-child(7)  { height: 70%; animation-delay: 0.6s; }
.bagpt-l-sfx-wave i:nth-child(8)  { height: 55%; animation-delay: 0.7s; }
.bagpt-l-sfx-wave i:nth-child(9)  { height: 85%; animation-delay: 0.8s; }
.bagpt-l-sfx-wave i:nth-child(10) { height: 45%; animation-delay: 0.9s; }
.bagpt-l-sfx-wave i:nth-child(11) { height: 65%; animation-delay: 1.0s; }
.bagpt-l-sfx-wave i:nth-child(12) { height: 35%; animation-delay: 1.1s; }
@keyframes bagpt-l-wave {
	0%, 100% { transform: scaleY(0.4); }
	50% { transform: scaleY(1); }
}

/* ---------- 13) Memory ---------- */
.bagpt-l-memory-stage {
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: 60px;
	align-items: center;
	max-width: 1100px;
	margin: 0 auto;
}
@media (max-width: 880px) {
	.bagpt-l-memory-stage { grid-template-columns: 1fr; gap: 30px; }
}
.bagpt-l-memory-graph {
	aspect-ratio: 6 / 4.2;
	border-radius: 22px;
	background:
		radial-gradient(ellipse at center, rgba(34,211,238,0.08), transparent 70%),
		linear-gradient(180deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.01) 100%);
	border: 1px solid var(--border-mid);
	box-shadow: var(--shadow-strong);
	position: relative;
	overflow: hidden;
}
.bagpt-l-memory-svg {
	width: 100%;
	height: 100%;
	display: block;
}
.bagpt-l-mem-node {
	transform-origin: center;
	transform-box: fill-box;
	transition: r 0.3s var(--ease), filter 0.3s var(--ease);
}
.bagpt-l-mem-node-glow { opacity: 0.55; }
.bagpt-l-mem-node-core { fill: var(--accent-cyan); }
.bagpt-l-mem-node-ring {
	fill: none;
	stroke: rgba(255,255,255,0.18);
	stroke-width: 1;
}
.bagpt-l-mem-node--violet .bagpt-l-mem-node-core { fill: var(--accent-violet); }
.bagpt-l-mem-node--pink   .bagpt-l-mem-node-core { fill: var(--accent-pink); }
.bagpt-l-mem-node--center .bagpt-l-mem-node-core { fill: #fff; }

.bagpt-l-mem-line-path {
	stroke: url(#bagpt-l-mem-line);
	stroke-width: 1.4;
	fill: none;
	opacity: 0;
	stroke-dasharray: 320;
	stroke-dashoffset: 320;
	transition: opacity 0.8s var(--ease), stroke-dashoffset 1.6s var(--ease);
}
.bagpt-l-memory-graph.is-revealed .bagpt-l-mem-line-path {
	opacity: 0.55;
	stroke-dashoffset: 0;
}
.bagpt-l-mem-label {
	fill: rgba(255,255,255,0.78);
	font-family: 'Vazirmatn', sans-serif;
	font-size: 11px;
	font-weight: 600;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.7s var(--ease) 0.6s;
	text-anchor: middle;
}
.bagpt-l-mem-label--center {
	font-size: 13px;
	fill: #fff;
}
.bagpt-l-memory-graph.is-revealed .bagpt-l-mem-label { opacity: 1; }

.bagpt-l-memory-facets {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 10px;
}
.bagpt-l-memory-facets li {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 14px;
	background: var(--bg-card);
	border: 1px solid var(--border-soft);
	border-radius: 12px;
	font-size: 14.5px;
	color: var(--text-soft);
	transition: all 0.3s var(--ease);
}
.bagpt-l-memory-facets li:hover {
	background: var(--gradient-soft);
	color: var(--text-primary);
	border-color: var(--border-mid);
	transform: translateX(-4px);
}
.bagpt-l-memory-facets li span {
	display: inline-flex;
	width: 26px; height: 26px;
	border-radius: 8px;
	align-items: center;
	justify-content: center;
	background: rgba(34, 211, 238, 0.15);
	color: var(--accent-cyan);
	font-size: 12px;
	font-weight: 700;
}

/* ---------- 14) Pricing ---------- */
.bagpt-l-billing-toggle {
	display: inline-flex;
	margin-top: 24px;
	background: var(--bg-card);
	border: 1px solid var(--border-soft);
	border-radius: 999px;
	padding: 4px;
	gap: 4px;
}
.bagpt-l-billing-btn {
	padding: 8px 18px;
	border: none;
	background: transparent;
	color: var(--text-soft);
	font-size: 13.5px;
	font-weight: 600;
	border-radius: 999px;
	transition: all 0.25s var(--ease);
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.bagpt-l-billing-btn.is-active {
	background: var(--gradient-galaxy);
	color: #fff;
	box-shadow: 0 4px 14px -4px rgba(34, 211, 238, 0.45);
}
.bagpt-l-save {
	font-size: 11px;
	font-weight: 700;
	padding: 2px 7px;
	background: rgba(16, 185, 129, 0.2);
	color: var(--accent-emerald);
	border-radius: 999px;
}
.bagpt-l-billing-btn.is-active .bagpt-l-save {
	background: rgba(255,255,255,0.2);
	color: #fff;
}

.bagpt-l-pricing-grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 16px;
	max-width: var(--maxw);
	margin: 0 auto;
}
@media (max-width: 1100px) {
	.bagpt-l-pricing-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 720px) {
	.bagpt-l-pricing-grid {
		grid-template-columns: 1fr;
		gap: 14px;
	}
}
.bagpt-l-plan {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 28px 22px;
	background: var(--bg-card);
	border: 1px solid var(--border-soft);
	border-radius: 18px;
	transition: all 0.3s var(--ease);
}
.bagpt-l-plan:hover {
	background: var(--bg-card-strong);
	border-color: var(--border-mid);
	transform: translateY(-4px);
	box-shadow: var(--shadow-card);
}
.bagpt-l-plan.is-featured {
	background: linear-gradient(180deg, rgba(34,211,238,0.06), rgba(167,139,250,0.06));
	border-color: var(--accent-cyan);
	box-shadow: var(--shadow-strong);
	transform: translateY(-8px);
}
@media (max-width: 1100px) {
	.bagpt-l-plan.is-featured { transform: none; }
}
.bagpt-l-plan-badge {
	position: absolute;
	top: -12px; right: 50%;
	transform: translateX(50%);
	padding: 4px 14px;
	font-size: 11.5px;
	font-weight: 700;
	background: var(--gradient-galaxy);
	color: #fff;
	border-radius: 999px;
	box-shadow: 0 4px 14px -4px rgba(34, 211, 238, 0.55);
}
.bagpt-l-plan-head { margin-bottom: 18px; }
.bagpt-l-plan-name {
	margin: 0 0 4px;
	font-size: 18px;
	font-weight: 700;
}
.bagpt-l-plan-tagline {
	margin: 0;
	font-size: 12.5px;
	color: var(--text-muted);
}
.bagpt-l-plan-price {
	margin: 8px 0 18px;
	display: flex;
	align-items: baseline;
	gap: 6px;
	flex-wrap: wrap;
}
.bagpt-l-plan-amount {
	font-size: 26px;
	font-weight: 800;
	background: var(--gradient-galaxy);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.bagpt-l-plan-unit {
	font-size: 12.5px;
	color: var(--text-muted);
}
.bagpt-l-plan-free {
	font-size: 22px;
	font-weight: 700;
	color: var(--accent-emerald);
}
.bagpt-l-plan-features {
	list-style: none;
	padding: 0;
	margin: 0 0 22px;
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.bagpt-l-plan-features li {
	display: flex;
	gap: 8px;
	align-items: flex-start;
	font-size: 13.5px;
	color: var(--text-soft);
	line-height: 1.6;
}
.bagpt-l-plan-features svg {
	flex-shrink: 0;
	color: var(--accent-emerald);
	margin-top: 4px;
}
.bagpt-l-plan-cta { width: 100%; justify-content: center; }
.bagpt-l-pricing-foot {
	text-align: center;
	margin-top: 36px;
	font-size: 14.5px;
	color: var(--text-soft);
	padding: 16px 24px;
	background: rgba(16, 185, 129, 0.06);
	border: 1px solid rgba(16, 185, 129, 0.2);
	border-radius: 14px;
	max-width: 520px;
	margin-left: auto;
	margin-right: auto;
}

/* ---------- 15) Why ---------- */
.bagpt-l-why-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 18px;
	max-width: var(--maxw);
	margin: 0 auto;
}
@media (max-width: 980px) {
	.bagpt-l-why-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 540px) {
	.bagpt-l-why-grid { grid-template-columns: 1fr; }
}
.bagpt-l-why-card {
	padding: 28px 22px;
	background: var(--bg-card);
	border: 1px solid var(--border-soft);
	border-radius: 18px;
	transition: all 0.3s var(--ease);
}
.bagpt-l-why-card:hover {
	transform: translateY(-4px);
	background: var(--bg-card-strong);
	border-color: var(--border-mid);
	box-shadow: var(--shadow-card);
}
.bagpt-l-why-icon {
	width: 52px; height: 52px;
	border-radius: 14px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--gradient-soft);
	color: var(--accent-cyan);
	margin-bottom: 18px;
	border: 1px solid var(--border-soft);
}
.bagpt-l-why-title {
	margin: 0 0 8px;
	font-size: 18px;
	font-weight: 700;
}
.bagpt-l-why-desc {
	margin: 0;
	font-size: 14px;
	color: var(--text-soft);
	line-height: 1.75;
}

/* ---------- 16) FAQ ---------- */
.bagpt-l-faq-list {
	max-width: 820px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.bagpt-l-faq-item {
	background: var(--bg-card);
	border: 1px solid var(--border-soft);
	border-radius: 14px;
	overflow: hidden;
	transition: border-color 0.25s var(--ease);
}
.bagpt-l-faq-item[open] {
	border-color: var(--border-mid);
	background: var(--bg-card-strong);
}
.bagpt-l-faq-item summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 22px;
	cursor: pointer;
	list-style: none;
	font-size: 15.5px;
	font-weight: 600;
}
.bagpt-l-faq-item summary::-webkit-details-marker { display: none; }
.bagpt-l-faq-q { flex: 1; }
.bagpt-l-faq-icon {
	display: inline-flex;
	color: var(--text-muted);
	transition: transform 0.3s var(--ease);
	flex-shrink: 0;
}
.bagpt-l-faq-item[open] .bagpt-l-faq-icon {
	transform: rotate(180deg);
	color: var(--accent-cyan);
}
.bagpt-l-faq-a {
	padding: 0 22px 22px;
	color: var(--text-soft);
	font-size: 14.5px;
	line-height: 1.85;
}

/* ---------- 17) Final CTA ---------- */
.bagpt-l-section--cta { padding-top: 48px; padding-bottom: 48px; }
.bagpt-l-cta-card {
	position: relative;
	max-width: 840px;
	margin: 0 auto;
	padding: 48px 36px;
	border-radius: 28px;
	background: linear-gradient(135deg, rgba(34,211,238,0.08), rgba(167,139,250,0.08), rgba(236,72,153,0.08));
	border: 1px solid var(--border-mid);
	text-align: center;
	overflow: hidden;
	box-shadow: var(--shadow-strong);
}
.bagpt-l-cta-glow {
	position: absolute;
	inset: -50%;
	background: conic-gradient(from 0deg, rgba(34,211,238,0.4), rgba(167,139,250,0.4), rgba(236,72,153,0.4), rgba(34,211,238,0.4));
	filter: blur(80px);
	opacity: 0.3;
	animation: bagpt-l-spin 14s linear infinite;
	z-index: 0;
}
@keyframes bagpt-l-spin {
	to { transform: rotate(360deg); }
}
.bagpt-l-cta-title {
	position: relative;
	z-index: 1;
	font-size: clamp(28px, 4vw, 44px);
	font-weight: 800;
	margin: 0 0 14px;
	background: var(--gradient-galaxy);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.bagpt-l-cta-desc {
	position: relative;
	z-index: 1;
	font-size: 16.5px;
	color: var(--text-soft);
	margin: 0 0 28px;
}
.bagpt-l-cta-actions {
	position: relative;
	z-index: 1;
	display: flex;
	gap: 12px;
	justify-content: center;
	flex-wrap: wrap;
}

/* ---------- 18) Footer ---------- */
.bagpt-l-footer {
	position: relative;
	z-index: 1;
	margin-top: 32px;
	border-top: 1px solid var(--border-soft);
	background: rgba(0, 0, 0, 0.3);
	backdrop-filter: blur(10px);
}
.bagpt-l-footer-inner {
	max-width: var(--maxw);
	margin: 0 auto;
	padding: 56px 24px 28px;
	display: grid;
	grid-template-columns: 1.3fr 2fr;
	gap: 48px;
}
@media (max-width: 760px) {
	.bagpt-l-footer-inner { grid-template-columns: 1fr; gap: 32px; }
}
.bagpt-l-footer-tagline {
	margin: 14px 0 0;
	color: var(--text-muted);
	font-size: 14px;
	max-width: 320px;
	line-height: 1.7;
}
.bagpt-l-footer-cols {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
}
@media (max-width: 540px) {
	.bagpt-l-footer-cols { grid-template-columns: 1fr 1fr; gap: 22px; }
}
.bagpt-l-footer-cols h4 {
	margin: 0 0 14px;
	font-size: 13px;
	color: var(--text-primary);
	letter-spacing: 0.04em;
}
.bagpt-l-footer-cols ul {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.bagpt-l-footer-cols a {
	color: var(--text-muted);
	text-decoration: none;
	font-size: 13.5px;
	transition: color 0.2s var(--ease);
}
.bagpt-l-footer-cols a:hover { color: var(--text-primary); }
.bagpt-l-footer-bar {
	max-width: var(--maxw);
	margin: 0 auto;
	padding: 18px 24px;
	border-top: 1px solid var(--border-soft);
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 14px;
	font-size: 12.5px;
	color: var(--text-muted);
	flex-wrap: wrap;
}

/* ---------- 19) Selection style ---------- */
.bagpt-landing-body ::selection {
	background: rgba(34, 211, 238, 0.4);
	color: #fff;
}

/* ---------- 20) Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
	.bagpt-l-stars,
	.bagpt-l-eyebrow-dot,
	.bagpt-l-cta-glow,
	.bagpt-l-mock-pulse,
	.bagpt-l-video-shimmer,
	.bagpt-l-video-progress i,
	.bagpt-l-mock-caret,
	.bagpt-l-sfx-wave i,
	.bagpt-l-i2i-arrow,
	.bagpt-l-hero-scroll-hint {
		animation: none !important;
	}
}

/* =============================================================
   21) MOBILE OVERHAUL — تجربهٔ موبایل حرفه‌ای
   این بلوک عمداً در انتهای فایل است تا روی هر چیزی که قبل‌تر تعریف
   شده override بزند و ایمن بماند. شامل:
   - منوی همبرگری drawer (بدون JS، با checkbox hack)
   - clamp()های تایپوگرافی برای مقیاس روان
   - layout های stack و کارت‌های یک‌ستونه
   - safe-area iOS و touch-target ≥ 44px
   ============================================================= */

.bagpt-l-nav-toggle {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	border: 0;
	opacity: 0;
	pointer-events: none;
}
.bagpt-l-nav-overlay { display: none; }
.bagpt-l-burger { display: none; }
.bagpt-l-nav-cta-mobile { display: none; }

/* ---- Tablet & Mobile: زیر 880px ---- */
@media (max-width: 880px) {
	/* Burger button */
	.bagpt-l-burger {
		display: inline-flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		gap: 5px;
		width: 44px;
		height: 44px;
		border-radius: 12px;
		background: rgba(255, 255, 255, 0.05);
		border: 1px solid rgba(255, 255, 255, 0.08);
		cursor: pointer;
		flex-shrink: 0;
		transition: background 0.2s var(--ease), border-color 0.2s var(--ease);
		-webkit-tap-highlight-color: transparent;
	}
	.bagpt-l-burger:hover { background: rgba(255, 255, 255, 0.08); }
	.bagpt-l-burger-bar {
		display: block;
		width: 22px;
		height: 2px;
		background: #ffffff;
		border-radius: 2px;
		transition: transform 0.28s var(--ease), opacity 0.2s var(--ease);
		transform-origin: center;
		box-shadow: 0 0 0 0.5px rgba(0, 0, 0, 0.2);
	}

	.bagpt-l-nav-toggle:checked ~ .bagpt-l-nav .bagpt-l-burger .bagpt-l-burger-bar:nth-child(1) {
		transform: translateY(7px) rotate(45deg);
	}
	.bagpt-l-nav-toggle:checked ~ .bagpt-l-nav .bagpt-l-burger .bagpt-l-burger-bar:nth-child(2) {
		opacity: 0;
	}
	.bagpt-l-nav-toggle:checked ~ .bagpt-l-nav .bagpt-l-burger .bagpt-l-burger-bar:nth-child(3) {
		transform: translateY(-7px) rotate(-45deg);
	}

	/* Nav structural */
	.bagpt-l-nav { padding: 12px 0; position: sticky; top: 0; z-index: 70; backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); background: rgba(5, 6, 8, 0.82); border-bottom: 1px solid rgba(255, 255, 255, 0.06); }
	.bagpt-l-nav-inner {
		padding: 0 16px;
		gap: 10px;
		justify-content: space-between;
	}
	.bagpt-l-brand-text { font-size: 17px; }
	.bagpt-l-nav-cta { display: none; }
	/* در موبایل brand اول (راست در RTL) و burger آخر (چپ در RTL) */
	.bagpt-l-brand { order: 1; margin-inline-end: auto; }
	.bagpt-l-burger { order: 3; margin-inline-start: auto; }
	.bagpt-l-nav-links { order: 2; }

	/* Drawer */
	.bagpt-l-nav-links {
		position: fixed;
		top: 0;
		right: 0;
		width: min(82vw, 340px);
		height: 100vh;
		height: 100dvh;
		background: linear-gradient(180deg, rgba(11, 13, 18, 0.98) 0%, rgba(5, 6, 8, 0.98) 100%);
		border-inline-start: 1px solid rgba(255, 255, 255, 0.08);
		box-shadow: -20px 0 60px rgba(0, 0, 0, 0.45);
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 4px;
		padding: 92px 22px 32px;
		transform: translateX(100%);
		transition: transform 0.32s var(--ease);
		z-index: 80;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}
	.bagpt-l-nav-links a {
		display: flex;
		align-items: center;
		min-height: 48px;
		padding: 12px 14px;
		border-radius: 12px;
		font-size: 16px;
		font-weight: 600;
		color: var(--text-primary);
		transition: background 0.18s var(--ease);
	}
	.bagpt-l-nav-links a:hover,
	.bagpt-l-nav-links a:active { background: rgba(255, 255, 255, 0.06); }
	.bagpt-l-nav-cta-mobile {
		display: flex;
		flex-direction: column;
		gap: 10px;
		margin-top: 18px;
		padding-top: 18px;
		border-top: 1px solid rgba(255, 255, 255, 0.08);
	}
	.bagpt-l-nav-cta-mobile .bagpt-l-btn { width: 100%; justify-content: center; min-height: 48px; }

	.bagpt-l-nav-toggle:checked ~ .bagpt-l-nav .bagpt-l-nav-links { transform: translateX(0); }
	/* وقتی drawer باز است، نوار ناوبری باید بالاتر از overlay قرار گیرد تا
	   سایدبار (که فرزند nav است) از زیر blur اوورلی بیرون بیاد و واضح دیده شود. */
	.bagpt-l-nav-toggle:checked ~ .bagpt-l-nav { z-index: 90; }

	.bagpt-l-nav-overlay {
		display: block;
		position: fixed;
		inset: 0;
		background: rgba(0, 0, 0, 0.62);
		-webkit-backdrop-filter: blur(2px);
		backdrop-filter: blur(2px);
		opacity: 0;
		visibility: hidden;
		transition: opacity 0.25s var(--ease), visibility 0.25s var(--ease);
		z-index: 75;
		cursor: pointer;
	}
	.bagpt-l-nav-toggle:checked ~ .bagpt-l-nav-overlay {
		opacity: 1;
		visibility: visible;
	}

	/* قفل اسکرول وقتی drawer باز است */
	.bagpt-l-nav-toggle:checked ~ .bagpt-l-root { overflow: hidden; }
}

/* ---- I2I arrow direction (RTL): فلش باید رو به چپ (مرجع → خروجی) باشد ---- */
.bagpt-l-i2i-arrow svg { transform: scaleX(-1); }

/* =============================================================
   I2I Pro Showcase — دیزاین حرفه‌ای با prompt و دکمهٔ امتحان
   ============================================================= */
.bagpt-l-i2i--pro {
	display: flex;
	flex-direction: column;
	gap: 18px;
	width: 100%;
}
.bagpt-l-i2i-stage {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: stretch;
	gap: 14px;
}
.bagpt-l-i2i--pro .bagpt-l-i2i-card {
	position: relative;
	flex: initial;
	margin: 0;
	border-radius: 20px;
	overflow: hidden;
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, rgba(0, 0, 0, 0.2) 100%),
		var(--bg-card);
	border: 1px solid var(--border-mid);
	box-shadow:
		0 24px 60px -28px rgba(0, 0, 0, 0.7),
		inset 0 0 0 1px rgba(255, 255, 255, 0.04);
	transition: transform 0.4s var(--ease), box-shadow 0.4s var(--ease), border-color 0.4s var(--ease);
}
.bagpt-l-i2i--pro .bagpt-l-i2i-card:hover {
	transform: translateY(-4px);
	border-color: rgba(34, 211, 238, 0.35);
	box-shadow:
		0 30px 70px -28px rgba(0, 0, 0, 0.8),
		0 0 0 1px rgba(34, 211, 238, 0.18),
		0 0 40px rgba(167, 139, 250, 0.15);
}
.bagpt-l-i2i--pro .bagpt-l-i2i-card--out {
	border-color: rgba(167, 139, 250, 0.35);
	box-shadow:
		0 24px 60px -24px rgba(167, 139, 250, 0.35),
		0 0 0 1px rgba(167, 139, 250, 0.22),
		inset 0 0 0 1px rgba(255, 255, 255, 0.05);
}
.bagpt-l-i2i--pro .bagpt-l-i2i-img {
	aspect-ratio: 1 / 1.05;
	background-color: #0e1018;
}
/* وقتی تصویر واقعی به‌صورت <img> در figure ست شده */
.bagpt-l-i2i--pro img.bagpt-l-i2i-img,
.bagpt-l-i2i--pro .bagpt-l-i2i-img--photo {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 200px;
	aspect-ratio: 1 / 1.05;
	object-fit: cover;
	object-position: center;
	background: #0e1018;
	border-radius: inherit;
}

/* Badge بالای هر کارت */
.bagpt-l-i2i-badge {
	position: absolute;
	top: 12px;
	inset-inline-start: 12px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 10px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.02em;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	background: rgba(11, 13, 18, 0.72);
	border: 1px solid rgba(255, 255, 255, 0.08);
	color: var(--text-soft);
}
.bagpt-l-i2i-badge--in {
	color: #cbd5e1;
}
.bagpt-l-i2i-badge--out {
	color: #f5d4ff;
	background: linear-gradient(135deg, rgba(167, 139, 250, 0.22), rgba(236, 72, 153, 0.18));
	border-color: rgba(167, 139, 250, 0.4);
	box-shadow: 0 0 18px rgba(167, 139, 250, 0.3);
}
.bagpt-l-i2i-badge svg { stroke: currentColor; }

/* Scan line روی کارت مرجع (تأکید بر "تحلیل می‌شود") */
.bagpt-l-i2i-card--ref .bagpt-l-i2i-scan {
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: linear-gradient(180deg, transparent 0%, rgba(34, 211, 238, 0.18) 50%, transparent 100%);
	height: 28%;
	top: -28%;
	animation: bagpt-l-scan-y 3.6s ease-in-out infinite;
	mix-blend-mode: screen;
}
@keyframes bagpt-l-scan-y {
	0%, 100% { top: -28%; opacity: 0; }
	20% { opacity: 1; }
	80% { opacity: 1; }
	100% { top: 100%; opacity: 0; }
}

/* Shine روی کارت خروجی */
.bagpt-l-i2i-card--out .bagpt-l-i2i-shine {
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: linear-gradient(115deg, transparent 30%, rgba(255, 255, 255, 0.12) 50%, transparent 70%);
	transform: translateX(-100%);
	animation: bagpt-l-shine-x 4.2s ease-in-out infinite;
}
@keyframes bagpt-l-shine-x {
	0%, 100% { transform: translateX(-100%); }
	50%, 70% { transform: translateX(100%); }
}

/* Arrow — قوی‌تر و glow دار */
.bagpt-l-i2i--pro .bagpt-l-i2i-arrow {
	align-self: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, rgba(34, 211, 238, 0.18), rgba(167, 139, 250, 0.18));
	border: 1px solid rgba(34, 211, 238, 0.35);
	color: #e0f7ff;
	box-shadow: 0 0 30px rgba(34, 211, 238, 0.35);
	animation: bagpt-l-arrow-pulse 2.2s ease-in-out infinite;
}
.bagpt-l-i2i--pro .bagpt-l-i2i-arrow svg {
	width: 26px;
	height: 26px;
	transform: scaleX(-1);
}

/* Prompt card */
.bagpt-l-i2i-prompt {
	position: relative;
	padding: 18px 20px 16px;
	border-radius: 18px;
	background:
		radial-gradient(120% 100% at 0% 0%, rgba(34, 211, 238, 0.10), transparent 50%),
		radial-gradient(120% 100% at 100% 100%, rgba(167, 139, 250, 0.10), transparent 50%),
		linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(0, 0, 0, 0.25));
	border: 1px solid rgba(255, 255, 255, 0.08);
	box-shadow:
		0 12px 30px -20px rgba(0, 0, 0, 0.7),
		inset 0 0 0 1px rgba(255, 255, 255, 0.03);
	overflow: hidden;
}
.bagpt-l-i2i-prompt::before {
	content: '';
	position: absolute;
	inset-inline-start: 0;
	top: 14%;
	bottom: 14%;
	width: 3px;
	border-radius: 3px;
	background: var(--gradient-galaxy);
	box-shadow: 0 0 18px rgba(34, 211, 238, 0.6);
}
.bagpt-l-i2i-prompt-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 8px;
}
.bagpt-l-i2i-prompt-label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--accent-cyan);
}
.bagpt-l-i2i-copy {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 10px;
	font-size: 12px;
	color: var(--text-muted);
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 8px;
	cursor: pointer;
	transition: all 0.2s var(--ease);
	font-family: inherit;
}
.bagpt-l-i2i-copy:hover {
	color: var(--text-primary);
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.16);
}
.bagpt-l-i2i-copy.is-copied {
	color: #4ade80;
	border-color: rgba(74, 222, 128, 0.4);
	background: rgba(74, 222, 128, 0.1);
}
.bagpt-l-i2i-prompt-text {
	margin: 0 0 14px;
	font-size: 14.5px;
	line-height: 1.85;
	color: var(--text-soft);
	font-style: italic;
}
.bagpt-l-i2i-try {
	display: inline-flex !important;
	align-items: center;
	gap: 8px;
}
.bagpt-l-i2i-try svg { transform: scaleX(-1); }

/* =============================================================
   I2I Gallery — چند کارت Image-to-Image در گرید واکنش‌گرا
   ============================================================= */
.bagpt-l-studio-row--i2i {
	display: flex;
	flex-direction: column;
	gap: 32px;
	grid-template-columns: none !important;
}
.bagpt-l-i2i-intro {
	max-width: 760px;
	margin-inline: auto;
	text-align: center;
	padding: 0 12px;
}
.bagpt-l-i2i-intro .bagpt-l-chip {
	display: inline-flex;
	margin-bottom: 12px;
}
.bagpt-l-i2i-intro h3 {
	margin: 0 0 10px;
}
.bagpt-l-i2i-intro .bagpt-l-p {
	margin: 0 auto 16px;
	max-width: 620px;
}
.bagpt-l-bullets--inline {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px 6px;
	padding: 0;
	margin: 0;
	list-style: none;
}
.bagpt-l-bullets--inline > li {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	font-size: 12.5px;
	color: var(--text-soft);
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 999px;
}
.bagpt-l-bullets--inline > li::before {
	content: '';
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--gradient-galaxy);
	box-shadow: 0 0 10px rgba(34, 211, 238, 0.7);
}

.bagpt-l-i2i-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
	gap: 22px;
	width: 100%;
	align-items: stretch;
}
.bagpt-l-i2i-grid[data-count="1"] {
	grid-template-columns: minmax(0, 720px);
	justify-content: center;
}
.bagpt-l-i2i-grid[data-count="2"] {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.bagpt-l-i2i--card {
	margin: 0;
	padding: 18px;
	border-radius: 22px;
	background:
		radial-gradient(120% 80% at 10% 0%, rgba(34, 211, 238, 0.10), transparent 55%),
		radial-gradient(120% 80% at 100% 100%, rgba(167, 139, 250, 0.10), transparent 55%),
		linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, rgba(0, 0, 0, 0.18) 100%);
	border: 1px solid rgba(255, 255, 255, 0.08);
	box-shadow:
		0 30px 70px -32px rgba(0, 0, 0, 0.75),
		inset 0 0 0 1px rgba(255, 255, 255, 0.03);
	transition: transform 0.4s var(--ease), border-color 0.4s var(--ease), box-shadow 0.4s var(--ease);
}
.bagpt-l-i2i--card:hover {
	transform: translateY(-4px);
	border-color: rgba(34, 211, 238, 0.28);
	box-shadow:
		0 36px 80px -32px rgba(0, 0, 0, 0.85),
		0 0 0 1px rgba(34, 211, 238, 0.16),
		0 0 50px rgba(167, 139, 250, 0.12);
}
.bagpt-l-i2i--card .bagpt-l-i2i-stage {
	margin-bottom: 16px;
}
.bagpt-l-i2i-title {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 12px;
	padding: 5px 12px;
	font-size: 12.5px;
	font-weight: 700;
	color: var(--text-primary);
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 999px;
}
.bagpt-l-i2i-title::before {
	content: '#';
	color: var(--accent-cyan);
	font-weight: 800;
}

/* ---- Mobile small: زیر 720px ---- */
@media (max-width: 720px) {
	/* Section spacing — فشرده‌سازی فاصله بین بخش‌ها روی موبایل */
	.bagpt-l-main > section { padding: 40px 0; margin: 0; }
	.bagpt-l-section { padding: 40px 0; margin: 0; }
	.bagpt-l-section-head { padding: 0 18px; margin-bottom: 22px; }
	.bagpt-l-section-head h2 { font-size: clamp(24px, 6.4vw, 30px); line-height: 1.25; }
	.bagpt-l-section-head .bagpt-l-lead { font-size: 14.5px; line-height: 1.7; }
	.bagpt-l-eyebrow { font-size: 11px; letter-spacing: 0.5px; }

	/* Hero */
	.bagpt-l-hero { padding: 28px 0 64px; min-height: auto; }
	.bagpt-l-hero-inner {
		grid-template-columns: 1fr !important;
		gap: 36px;
		padding: 0 18px;
	}
	.bagpt-l-hero-copy { text-align: right; }
	.bagpt-l-hero-title { font-size: clamp(30px, 8.2vw, 44px); line-height: 1.18; letter-spacing: -0.02em; }
	.bagpt-l-hero-title-line { display: block; }
	.bagpt-l-hero-desc { font-size: 15px; line-height: 1.85; max-width: none; }
	.bagpt-l-hero-cta {
		flex-direction: column;
		align-items: stretch;
		gap: 10px;
		width: 100%;
	}
	.bagpt-l-hero-cta .bagpt-l-btn { width: 100%; justify-content: center; min-height: 52px; font-size: 16px; }
	.bagpt-l-hero-badges {
		flex-wrap: wrap;
		gap: 8px;
		justify-content: flex-start;
	}
	.bagpt-l-hero-badges li { font-size: 12.5px; padding: 7px 11px; }
	.bagpt-l-hero-stats {
		grid-template-columns: repeat(3, 1fr);
		gap: 8px;
		margin-top: 24px;
	}
	.bagpt-l-hero-stats > div { padding: 12px 8px; }
	.bagpt-l-hero-stats dt { font-size: 11px; }
	.bagpt-l-hero-stats dd { font-size: 18px; }

	/* Hero mock chat — ارتفاع کاملاً ثابت تا با محتوا کش نیاید */
	.bagpt-l-hero-mock {
		max-width: 100%;
		margin: 0 auto;
		transform: none !important;
		height: 380px;
		display: flex;
		flex-direction: column;
	}
	.bagpt-l-mock-chrome { flex: 0 0 auto; padding: 10px 12px; }
	.bagpt-l-mock-title { font-size: 12px; }
	.bagpt-l-mock-body {
		flex: 1 1 auto;
		min-height: 0;
		height: auto;
		max-height: none;
		padding: 14px;
		overflow: hidden;
	}
	.bagpt-l-mock-body .bagpt-l-mock-bubble { font-size: 13.5px; max-width: 88%; }
	.bagpt-l-mock-input { flex: 0 0 auto; padding: 10px 12px; }
	.bagpt-l-mock-input-text { font-size: 13px; }

	.bagpt-l-hero-scroll-hint { display: none; }

	/* Trust — کاهش padding و چینش گریدی تمیز روی موبایل */
	.bagpt-l-trust { padding: 26px 0 !important; margin: 0 !important; }
	.bagpt-l-trust-inner { padding: 0 18px; }
	.bagpt-l-trust-label { font-size: 12.5px; margin-bottom: 14px; }
	.bagpt-l-trust-list {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
		justify-content: stretch;
	}
	.bagpt-l-trust-list li { width: 100%; }
	.bagpt-l-trust-list .bagpt-l-logo-pill {
		width: 100%;
		justify-content: center;
		padding: 11px 12px;
		font-size: 13px;
		letter-spacing: 0;
		box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
	}
	.bagpt-l-trust-list .bagpt-l-logo-pill:hover {
		transform: none;
	}
	.bagpt-l-logo-dot { width: 6px; height: 6px; }

	/* Chat showcase — کلاس واقعی wrapper در markup: .bagpt-l-chat-tabs */
	.bagpt-l-chat-tabs {
		padding-inline: 18px;
	}
	.bagpt-l-chat-tablist {
		overflow-x: auto;
		flex-wrap: nowrap;
		justify-content: flex-start;
		padding-bottom: 6px;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}
	.bagpt-l-chat-tablist::-webkit-scrollbar { display: none; }
	.bagpt-l-chat-tablist button,
	.bagpt-l-chat-tab { flex-shrink: 0; scroll-snap-align: start; padding: 9px 14px; font-size: 13px; }
	.bagpt-l-chat-stage { padding: 14px; min-height: 360px; }
	.bagpt-l-chat-stage .bagpt-l-mock-bubble { font-size: 13.5px; max-width: 88%; }

	/* Studio */
	.bagpt-l-studio-row,
	.bagpt-l-studio-row--reverse,
	.bagpt-l-studio-row--ba,
	.bagpt-l-studio-row--i2i {
		grid-template-columns: 1fr !important;
		gap: 24px !important;
		padding: 0 18px;
	}
	.bagpt-l-i2i-grid,
	.bagpt-l-i2i-grid[data-count="1"],
	.bagpt-l-i2i-grid[data-count="2"] {
		grid-template-columns: 1fr;
		gap: 16px;
	}
	.bagpt-l-i2i--card { padding: 14px; border-radius: 18px; }
	.bagpt-l-i2i-intro { padding: 0; text-align: right; }
	.bagpt-l-i2i-intro .bagpt-l-p { text-align: right; }
	.bagpt-l-bullets--inline { justify-content: flex-start; }
	.bagpt-l-studio-copy { order: 1; text-align: right; }
	.bagpt-l-studio-visual { order: 2; }
	.bagpt-l-studio-copy h3 { font-size: clamp(20px, 5.6vw, 26px); line-height: 1.3; }
	.bagpt-l-studio-copy p { font-size: 14.5px; line-height: 1.8; }
	.bagpt-l-pill-row { flex-wrap: wrap; gap: 6px; }
	.bagpt-l-pill-row > * { font-size: 12px; padding: 6px 10px; }

	.bagpt-l-i2i { gap: 10px; }
	.bagpt-l-i2i-card { min-height: 180px; }
	.bagpt-l-i2i-arrow { width: 32px; height: 32px; }
	.bagpt-l-i2i-arrow svg { width: 24px; height: 24px; }
	/* I2I Pro: روی موبایل arrow وسط افقی نمی‌شود؛ دو کارت پشت سر هم */
	.bagpt-l-i2i--pro .bagpt-l-i2i-stage {
		grid-template-columns: 1fr 1fr;
		gap: 10px;
	}
	.bagpt-l-i2i--pro .bagpt-l-i2i-arrow {
		display: none;
	}
	.bagpt-l-i2i-badge { font-size: 10.5px; padding: 5px 8px; top: 8px; }
	.bagpt-l-i2i-prompt { padding: 14px 16px 14px 18px; }
	.bagpt-l-i2i-prompt-text { font-size: 13.5px; line-height: 1.8; }
	.bagpt-l-i2i-try { width: 100%; justify-content: center; min-height: 44px; }
	.bagpt-l-video-frame { aspect-ratio: 16 / 10; }
	.bagpt-l-video-real { aspect-ratio: 16 / 10; width: 100%; height: auto; object-fit: cover; }

	/* Before/After روی موبایل: ارتفاع جمع‌وجورتر */
	.bagpt-l-ba { aspect-ratio: 1 / 1; max-height: 480px; }
	.bagpt-l-ba-prompt p { font-size: 14px; line-height: 1.8; }
	.bagpt-l-ba-handle-grip { width: 38px; height: 38px; }

	/* Memory — کلاس واقعی wrapper در markup: .bagpt-l-memory-stage */
	.bagpt-l-memory-stage {
		grid-template-columns: 1fr !important;
		padding-inline: 18px;
		gap: 24px;
	}
	#bagpt-l-memory-graph { aspect-ratio: 1 / 1; max-width: 100%; min-height: 280px; }
	#bagpt-l-memory-graph svg { width: 100%; height: 100%; }
	.bagpt-l-mem-label { font-size: 11px; }

	/* Pricing — کلاس واقعی wrapper در markup: .bagpt-pricing (padding در landing-pricing.css)
	   گرید کارت‌ها (.bagpt-pricing__grid) با minmax(min(260px,100%),1fr) خودش روی موبایل
	   تک‌ستونه می‌شود. */

	/* Why */
	.bagpt-l-why-grid {
		grid-template-columns: 1fr !important;
		gap: 12px;
		padding: 0 18px;
	}
	.bagpt-l-why-card { padding: 20px; }
	.bagpt-l-why-card h3 { font-size: 17px; }
	.bagpt-l-why-card p { font-size: 14px; line-height: 1.75; }

	/* FAQ */
	.bagpt-l-faq-list { padding: 0 18px; }
	.bagpt-l-faq-item summary { padding: 16px; font-size: 14.5px; min-height: 56px; }
	.bagpt-l-faq-item .bagpt-l-faq-body { padding: 0 16px 18px; font-size: 14px; line-height: 1.85; }

	/* CTA */
	.bagpt-l-cta-card {
		padding: 32px 22px;
		margin: 0 16px;
		border-radius: 22px;
	}
	.bagpt-l-cta-card h2 { font-size: clamp(22px, 6.4vw, 28px); line-height: 1.3; }
	.bagpt-l-cta-card p { font-size: 14.5px; line-height: 1.8; }
	.bagpt-l-cta-card .bagpt-l-hero-cta { flex-direction: column; gap: 10px; }
	.bagpt-l-cta-card .bagpt-l-btn { width: 100%; justify-content: center; min-height: 52px; }

	/* Footer */
	.bagpt-l-footer { padding: 36px 0 24px; }
	.bagpt-l-footer-inner { padding: 0 18px; }
	.bagpt-l-footer-cols {
		grid-template-columns: 1fr 1fr !important;
		gap: 22px 18px;
	}
	.bagpt-l-footer-cols > div h4 { font-size: 13px; }
	.bagpt-l-footer-cols a { font-size: 13px; }
	.bagpt-l-footer-bottom {
		flex-direction: column;
		gap: 10px;
		text-align: center;
		font-size: 12px;
	}

	/* Glow ها در موبایل کوچک‌تر */
	.bagpt-l-glow-a, .bagpt-l-glow-b { filter: blur(80px); opacity: 0.5; }

	/* Touch target حداقل 44px */
	.bagpt-l-btn { min-height: 44px; }
	.bagpt-l-btn-lg { min-height: 52px; padding: 12px 22px; }
}

/* ---- Mobile xs: زیر 420px ---- */
@media (max-width: 420px) {
	.bagpt-l-hero-stats { grid-template-columns: 1fr 1fr 1fr; gap: 6px; }
	.bagpt-l-hero-stats > div { padding: 10px 6px; }
	.bagpt-l-hero-stats dd { font-size: 16px; }
	.bagpt-l-footer-cols { grid-template-columns: 1fr !important; }
	.bagpt-l-section-head h2 { font-size: clamp(22px, 6.8vw, 28px); }
}

/* ---- Safe area iOS (notch/home indicator) — فقط در موبایل ---- */
@media (max-width: 880px) {
	@supports (padding: max(0px)) {
		.bagpt-l-nav-inner {
			padding-inline-start: max(16px, env(safe-area-inset-right));
			padding-inline-end: max(16px, env(safe-area-inset-left));
		}
		.bagpt-l-footer-inner {
			padding-bottom: max(0px, env(safe-area-inset-bottom));
		}
		.bagpt-l-nav-links {
			padding-bottom: max(32px, env(safe-area-inset-bottom));
		}
	}
}

/* ---- Landscape phones: ارتفاع کم ---- */
@media (max-width: 880px) and (orientation: landscape) and (max-height: 520px) {
	.bagpt-l-hero { padding: 20px 0 36px; }
	.bagpt-l-hero-inner { grid-template-columns: 1.1fr 1fr !important; gap: 20px; }
	.bagpt-l-hero-title { font-size: clamp(22px, 4.8vw, 32px); }
	.bagpt-l-hero-mock { max-width: 100%; }
	.bagpt-l-mock-body { min-height: 160px; max-height: 220px; }
}

/* ============================================================
   About page — استایل اختصاصی صفحهٔ «دربارهٔ ما»
   تمام کلاس‌ها با prefix `bagpt-a-*` تا با ویترین برخورد نکنند.
   ============================================================ */

/* Hero: مرکزی، تک‌ستونه — copy در میانه. */
.bagpt-a-hero .bagpt-a-hero-inner {
	grid-template-columns: 1fr !important;
	justify-items: center;
	text-align: center;
}
.bagpt-a-hero .bagpt-a-hero-copy {
	max-width: 820px;
	text-align: center;
}
.bagpt-a-hero .bagpt-l-hero-title { text-align: center; }
.bagpt-a-hero .bagpt-l-hero-desc { margin-inline: auto; }
.bagpt-a-hero .bagpt-l-hero-cta { justify-content: center; }

/* Intro: orb گرافیکی در ستون بصری. */
.bagpt-a-intro-visual {
	position: relative;
	display: grid;
	place-items: center;
	min-height: 360px;
}
.bagpt-a-orb {
	position: relative;
	width: min(360px, 80%);
	aspect-ratio: 1 / 1;
}
.bagpt-a-orb-core {
	position: absolute;
	inset: 32%;
	border-radius: 999px;
	background: radial-gradient(closest-side, rgba(167, 139, 250, .9), rgba(124, 58, 237, .4) 60%, transparent 80%);
	filter: blur(2px);
	box-shadow: 0 0 80px rgba(167, 139, 250, .55), inset 0 0 40px rgba(255, 255, 255, .25);
	animation: bagpt-a-pulse 4.2s ease-in-out infinite;
}
.bagpt-a-orb-ring {
	position: absolute;
	inset: 0;
	border-radius: 999px;
	border: 1px solid rgba(167, 139, 250, .25);
	box-shadow: 0 0 30px rgba(124, 58, 237, .15) inset;
}
.bagpt-a-orb-ring--1 { inset: 14%; border-color: rgba(167, 139, 250, .35); animation: bagpt-a-spin 18s linear infinite; }
.bagpt-a-orb-ring--2 { inset: 4%;  border-color: rgba(96, 165, 250, .25); animation: bagpt-a-spin 28s linear infinite reverse; }
.bagpt-a-orb-ring--3 { inset: -6%; border-color: rgba(34, 211, 238, .18); animation: bagpt-a-spin 40s linear infinite; }
.bagpt-a-orb-spark {
	position: absolute;
	width: 8px;
	height: 8px;
	border-radius: 999px;
	background: #fff;
	box-shadow: 0 0 16px rgba(167, 139, 250, .9);
}
.bagpt-a-orb-spark--a { top: 8%;  left: 50%; animation: bagpt-a-orbit-a 9s linear infinite; }
.bagpt-a-orb-spark--b { top: 50%; left: 6%;  animation: bagpt-a-orbit-b 12s linear infinite; }
.bagpt-a-orb-spark--c { top: 80%; left: 70%; animation: bagpt-a-orbit-c 16s linear infinite; }

@keyframes bagpt-a-pulse {
	0%, 100% { transform: scale(1);   opacity: .95; }
	50%      { transform: scale(1.07); opacity: 1; }
}
@keyframes bagpt-a-spin {
	from { transform: rotate(0deg); }
	to   { transform: rotate(360deg); }
}
@keyframes bagpt-a-orbit-a {
	0%, 100% { transform: translate(0, 0); }
	50%      { transform: translate(-30px, 40px); }
}
@keyframes bagpt-a-orbit-b {
	0%, 100% { transform: translate(0, 0); }
	50%      { transform: translate(40px, -20px); }
}
@keyframes bagpt-a-orbit-c {
	0%, 100% { transform: translate(0, 0); }
	50%      { transform: translate(-20px, -30px); }
}

@media (prefers-reduced-motion: reduce) {
	.bagpt-a-orb-core,
	.bagpt-a-orb-ring,
	.bagpt-a-orb-spark {
		animation: none !important;
	}
}

/* Mission card — شیشه‌ای، centered. */
.bagpt-a-mission-card {
	position: relative;
	max-width: 880px;
	margin-inline: auto;
	padding: 44px 36px 40px;
	border-radius: 28px;
	border: 1px solid rgba(255, 255, 255, .12);
	background: linear-gradient(180deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .02));
	backdrop-filter: blur(18px);
	-webkit-backdrop-filter: blur(18px);
	box-shadow:
		0 30px 80px -30px rgba(124, 58, 237, .35),
		inset 0 1px 0 rgba(255, 255, 255, .08);
	overflow: hidden;
	text-align: center;
}
.bagpt-a-mission-glow {
	position: absolute;
	inset: -40%;
	background: radial-gradient(closest-side, rgba(167, 139, 250, .28), transparent 70%);
	filter: blur(40px);
	pointer-events: none;
}
.bagpt-a-mission-quote {
	color: rgba(167, 139, 250, .85);
	margin-bottom: 14px;
}
.bagpt-a-mission-text {
	position: relative;
	font-size: clamp(18px, 2.2vw, 24px);
	line-height: 1.85;
	color: var(--text-soft);
	margin: 0 auto 28px;
	max-width: 720px;
}
.bagpt-a-mission-pillars {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 14px;
	list-style: none;
	padding: 0;
	margin: 0;
}
.bagpt-a-mission-pillars li {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 10px 18px;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, .14);
	background: rgba(255, 255, 255, .04);
	color: var(--text-soft);
	font-weight: 600;
	font-size: 14px;
}
.bagpt-a-mission-icon {
	display: inline-flex;
	width: 30px;
	height: 30px;
	align-items: center;
	justify-content: center;
	border-radius: 999px;
	background: linear-gradient(135deg, rgba(167, 139, 250, .25), rgba(96, 165, 250, .25));
	color: #fff;
}

/* Audience grid — pillهای آیکن‌دار. */
.bagpt-a-audience-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 14px;
	max-width: 1080px;
	margin-inline: auto;
}
.bagpt-a-audience-pill {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 16px 18px;
	border-radius: 18px;
	border: 1px solid rgba(255, 255, 255, .1);
	background: linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .015));
	color: var(--text-soft);
	transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.bagpt-a-audience-pill:hover {
	transform: translateY(-2px);
	border-color: rgba(167, 139, 250, .35);
	box-shadow: 0 14px 40px -18px rgba(124, 58, 237, .5);
}
.bagpt-a-audience-icon {
	display: inline-flex;
	width: 40px;
	height: 40px;
	align-items: center;
	justify-content: center;
	border-radius: 12px;
	background: linear-gradient(135deg, rgba(167, 139, 250, .2), rgba(96, 165, 250, .2));
	color: #c4b5fd;
	flex: 0 0 auto;
}
.bagpt-a-audience-label {
	font-weight: 700;
	font-size: 15px;
}

@media (max-width: 880px) {
	.bagpt-a-intro-visual { min-height: 260px; }
	.bagpt-a-orb { width: min(260px, 70%); }
	.bagpt-a-mission-card { padding: 32px 22px 30px; border-radius: 22px; }
	.bagpt-a-mission-text { font-size: clamp(16px, 4.2vw, 19px); line-height: 1.85; }
	.bagpt-a-mission-pillars li { font-size: 13px; padding: 9px 14px; }
	.bagpt-a-audience-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
	.bagpt-a-audience-pill { padding: 12px 14px; border-radius: 14px; }
	.bagpt-a-audience-icon { width: 34px; height: 34px; border-radius: 10px; }
	.bagpt-a-audience-label { font-size: 14px; }
}
@media (max-width: 480px) {
	.bagpt-a-audience-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   Refund page — استایل اختصاصی صفحهٔ «شرایط بازگشت وجه»
   تمام کلاس‌ها با prefix `bagpt-r-*` تا با ویترین/About تداخل نکنند.
   ============================================================ */

/* Hero — centered، شبیه About. */
.bagpt-r-hero .bagpt-r-hero-inner {
	grid-template-columns: 1fr !important;
	justify-items: center;
	text-align: center;
}
.bagpt-r-hero .bagpt-r-hero-copy {
	max-width: 820px;
	text-align: center;
}
.bagpt-r-hero .bagpt-l-hero-title { text-align: center; }
.bagpt-r-hero .bagpt-l-hero-desc { margin-inline: auto; }
.bagpt-r-hero .bagpt-l-hero-cta { justify-content: center; }

/* Methods grid. */
.bagpt-r-method-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	max-width: 1080px;
	margin-inline: auto;
}
.bagpt-r-method-card {
	position: relative;
	padding: 32px 28px 28px;
	border-radius: 24px;
	border: 1px solid rgba(255, 255, 255, .1);
	background: linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .02));
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.bagpt-r-method-card:hover {
	transform: translateY(-3px);
	border-color: rgba(167, 139, 250, .35);
	box-shadow: 0 20px 50px -20px rgba(124, 58, 237, .4);
}
.bagpt-r-method-icon {
	display: inline-flex;
	width: 64px;
	height: 64px;
	align-items: center;
	justify-content: center;
	border-radius: 18px;
	color: #fff;
	margin-bottom: 18px;
}
.bagpt-r-method-icon--success {
	background: linear-gradient(135deg, rgba(52, 211, 153, .35), rgba(16, 185, 129, .35));
	box-shadow: 0 12px 30px -12px rgba(16, 185, 129, .55), inset 0 1px 0 rgba(255, 255, 255, .15);
}
.bagpt-r-method-icon--info {
	background: linear-gradient(135deg, rgba(96, 165, 250, .35), rgba(59, 130, 246, .35));
	box-shadow: 0 12px 30px -12px rgba(59, 130, 246, .55), inset 0 1px 0 rgba(255, 255, 255, .15);
}
.bagpt-r-method-badge {
	position: absolute;
	top: 16px;
	inset-inline-start: 16px;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .01em;
	border: 1px solid transparent;
}
.bagpt-r-method-badge--success {
	color: #34d399;
	background: rgba(52, 211, 153, .12);
	border-color: rgba(52, 211, 153, .35);
}
.bagpt-r-method-badge--info {
	color: #60a5fa;
	background: rgba(96, 165, 250, .12);
	border-color: rgba(96, 165, 250, .35);
}
.bagpt-r-method-badge--warning {
	color: #fbbf24;
	background: rgba(251, 191, 36, .12);
	border-color: rgba(251, 191, 36, .35);
}
.bagpt-r-method-title {
	font-size: clamp(18px, 2vw, 22px);
	font-weight: 800;
	color: #fff;
	margin: 0 0 10px;
	line-height: 1.4;
}
.bagpt-r-method-desc {
	font-size: 14.5px;
	color: var(--text-soft);
	margin: 0;
	line-height: 1.85;
}

/* Fees grid. */
.bagpt-r-fee-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	max-width: 920px;
	margin-inline: auto;
}
.bagpt-r-fee-card {
	position: relative;
	overflow: hidden;
	padding: 36px 28px 30px;
	border-radius: 24px;
	border: 1px solid rgba(255, 255, 255, .1);
	background: linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .015));
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	text-align: center;
	transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.bagpt-r-fee-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 20px 50px -20px rgba(124, 58, 237, .35);
}
.bagpt-r-fee-glow {
	position: absolute;
	inset: -40% -20% auto -20%;
	height: 200%;
	pointer-events: none;
	opacity: .55;
	filter: blur(50px);
}
.bagpt-r-fee-card-title {
	font-size: 15px;
	font-weight: 700;
	color: var(--text-soft);
	margin: 0 0 14px;
	letter-spacing: .01em;
}
.bagpt-r-fee-price {
	position: relative;
	font-size: clamp(32px, 5vw, 56px);
	font-weight: 900;
	line-height: 1.1;
	letter-spacing: -0.01em;
	margin: 0 0 14px;
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
}
.bagpt-r-fee-desc {
	position: relative;
	font-size: 13.5px;
	color: var(--text-soft);
	margin: 0;
	line-height: 1.75;
}
.bagpt-r-fee-tone--success { border-color: rgba(52, 211, 153, .28); }
.bagpt-r-fee-tone--success .bagpt-r-fee-glow { background: radial-gradient(closest-side, rgba(52, 211, 153, .35), transparent 70%); }
.bagpt-r-fee-tone--success .bagpt-r-fee-price { background-image: linear-gradient(135deg, #34d399, #10b981); }

.bagpt-r-fee-tone--warning { border-color: rgba(251, 146, 60, .28); }
.bagpt-r-fee-tone--warning .bagpt-r-fee-glow { background: radial-gradient(closest-side, rgba(251, 146, 60, .35), transparent 70%); }
.bagpt-r-fee-tone--warning .bagpt-r-fee-price { background-image: linear-gradient(135deg, #fb923c, #f97316); }

.bagpt-r-fee-tone--info { border-color: rgba(96, 165, 250, .28); }
.bagpt-r-fee-tone--info .bagpt-r-fee-glow { background: radial-gradient(closest-side, rgba(96, 165, 250, .35), transparent 70%); }
.bagpt-r-fee-tone--info .bagpt-r-fee-price { background-image: linear-gradient(135deg, #60a5fa, #3b82f6); }

/* Conditions grid. */
.bagpt-r-conditions-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 16px;
	max-width: 1080px;
	margin-inline: auto;
}
.bagpt-r-condition-card {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	padding: 22px 22px;
	border-radius: 18px;
	border: 1px solid rgba(255, 255, 255, .1);
	background: linear-gradient(180deg, rgba(255, 255, 255, .04), rgba(255, 255, 255, .015));
	transition: transform .25s ease, border-color .25s ease;
}
.bagpt-r-condition-card:hover {
	border-color: rgba(167, 139, 250, .3);
	transform: translateY(-2px);
}
.bagpt-r-condition-icon {
	display: inline-flex;
	width: 44px;
	height: 44px;
	align-items: center;
	justify-content: center;
	border-radius: 12px;
	background: linear-gradient(135deg, rgba(167, 139, 250, .25), rgba(96, 165, 250, .25));
	color: #c4b5fd;
	flex: 0 0 auto;
}
.bagpt-r-condition-body { flex: 1; min-width: 0; }
.bagpt-r-condition-title {
	font-size: 16px;
	font-weight: 800;
	color: #fff;
	margin: 0 0 6px;
	line-height: 1.4;
}
.bagpt-r-condition-desc {
	font-size: 14px;
	color: var(--text-soft);
	margin: 0;
	line-height: 1.8;
}

/* Process timeline. */
.bagpt-r-process-grid {
	position: relative;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	max-width: 1080px;
	margin-inline: auto;
	padding-top: 12px;
}
.bagpt-r-process-grid.is-3 { grid-template-columns: repeat(3, 1fr); }
.bagpt-r-process-grid.is-5 { grid-template-columns: repeat(5, 1fr); }
.bagpt-r-process-grid.is-6plus { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.bagpt-r-process-track {
	position: absolute;
	top: 34px;
	inset-inline-start: 6%;
	inset-inline-end: 6%;
	height: 2px;
	background: linear-gradient(90deg, rgba(167, 139, 250, .15), rgba(96, 165, 250, .5), rgba(34, 211, 238, .15));
	border-radius: 2px;
	z-index: 0;
}
.bagpt-r-step {
	position: relative;
	z-index: 1;
	text-align: center;
	padding: 0 6px;
}
.bagpt-r-step-num {
	display: inline-flex;
	width: 56px;
	height: 56px;
	align-items: center;
	justify-content: center;
	border-radius: 999px;
	color: #fff;
	font-size: 20px;
	font-weight: 900;
	background: linear-gradient(135deg, #a78bfa, #60a5fa);
	box-shadow: 0 14px 30px -10px rgba(124, 58, 237, .55), inset 0 1px 0 rgba(255, 255, 255, .25);
	margin-bottom: 14px;
	border: 4px solid var(--bg-deep, #050608);
}
.bagpt-r-step-title {
	font-size: 15px;
	font-weight: 700;
	color: #fff;
	line-height: 1.55;
	margin: 0 0 4px;
}
.bagpt-r-step-desc {
	font-size: 13px;
	color: var(--text-soft);
	margin: 0;
	line-height: 1.75;
}

/* Mobile / tablet — timeline عمودی. */
@media (max-width: 880px) {
	.bagpt-r-method-grid { grid-template-columns: 1fr; gap: 16px; }
	.bagpt-r-method-card { padding: 26px 22px 22px; border-radius: 20px; }
	.bagpt-r-method-icon { width: 56px; height: 56px; border-radius: 16px; margin-bottom: 14px; }

	.bagpt-r-fee-grid { grid-template-columns: 1fr; gap: 14px; max-width: 480px; }
	.bagpt-r-fee-card { padding: 28px 22px 24px; border-radius: 20px; }

	.bagpt-r-conditions-grid { grid-template-columns: 1fr; }
	.bagpt-r-condition-card { padding: 18px 18px; border-radius: 16px; }

	.bagpt-r-process-grid,
	.bagpt-r-process-grid.is-3,
	.bagpt-r-process-grid.is-5,
	.bagpt-r-process-grid.is-6plus {
		grid-template-columns: 1fr;
		gap: 18px;
		padding-inline-start: 32px;
		padding-top: 0;
	}
	.bagpt-r-process-track {
		top: 6px;
		bottom: 6px;
		height: auto;
		width: 2px;
		inset-inline-start: 14px;
		inset-inline-end: auto;
		background: linear-gradient(180deg, rgba(167, 139, 250, .15), rgba(96, 165, 250, .5), rgba(34, 211, 238, .15));
	}
	.bagpt-r-step {
		text-align: right;
		display: grid;
		grid-template-columns: 56px 1fr;
		gap: 14px;
		align-items: start;
		padding: 0;
	}
	.bagpt-r-step-num {
		margin: 0;
		margin-inline-start: -34px;
		width: 48px;
		height: 48px;
		font-size: 17px;
		border-width: 3px;
	}
	.bagpt-r-step-title { text-align: right; }
	.bagpt-r-step-desc  { text-align: right; }
}
@media (max-width: 480px) {
	.bagpt-r-method-card { padding: 22px 18px 20px; }
	.bagpt-r-method-title { font-size: 17px; }
	.bagpt-r-fee-card { padding: 24px 18px 22px; }
	.bagpt-r-fee-price { font-size: clamp(28px, 8.5vw, 38px); }
	.bagpt-r-condition-title { font-size: 15px; }
	.bagpt-r-step-num { width: 44px; height: 44px; font-size: 16px; margin-inline-start: -32px; }
}

@media (prefers-reduced-motion: reduce) {
	.bagpt-r-method-card,
	.bagpt-r-fee-card,
	.bagpt-r-condition-card { transition: none !important; }
	.bagpt-r-method-card:hover,
	.bagpt-r-fee-card:hover,
	.bagpt-r-condition-card:hover { transform: none !important; }
}

/* ===================================================================
 * baGPT Contact — صفحهٔ «تماس با ما»
 *   namespace: .bagpt-c-*
 * =================================================================== */

.bagpt-c-hero-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding-block: 12px 4px;
}
.bagpt-c-hero-copy {
	max-width: 720px;
	margin-inline: auto;
}
.bagpt-c-hero-copy .bagpt-l-eyebrow { justify-content: center; }
.bagpt-c-hero-copy .bagpt-l-hero-title { text-align: center; }
.bagpt-c-hero-copy .bagpt-l-hero-desc { text-align: center; margin-inline: auto; }
.bagpt-c-hero-copy .bagpt-l-hero-cta { justify-content: center; }

/* Channels grid. */
.bagpt-c-section--channels { padding-block: 64px 24px; }
.bagpt-c-channels-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
	max-width: 1080px;
	margin-inline: auto;
}
.bagpt-c-channel-card {
	position: relative;
	isolation: isolate;
	padding: 28px 28px 24px;
	border-radius: 22px;
	border: 1px solid rgba(255, 255, 255, .1);
	background: linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .02));
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	overflow: hidden;
	transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
}
.bagpt-c-channel-card:hover {
	transform: translateY(-3px);
	border-color: rgba(96, 165, 250, .35);
	box-shadow: 0 24px 60px -22px rgba(15, 23, 42, .65);
}
.bagpt-c-channel-glow {
	position: absolute;
	inset: -40% -10% auto -10%;
	height: 70%;
	background: radial-gradient(closest-side, rgba(96, 165, 250, .28), transparent 70%);
	z-index: -1;
	pointer-events: none;
	filter: blur(8px);
}
.bagpt-c-channel-glow--clock {
	background: radial-gradient(closest-side, rgba(167, 139, 250, .28), transparent 70%);
}
.bagpt-c-channel-icon {
	display: inline-flex;
	width: 64px;
	height: 64px;
	align-items: center;
	justify-content: center;
	border-radius: 20px;
	margin-bottom: 16px;
	color: #fff;
	box-shadow: 0 18px 40px -14px rgba(15, 23, 42, .65), inset 0 1px 0 rgba(255, 255, 255, .18);
}
.bagpt-c-channel-icon--mail  { background: linear-gradient(135deg, #60a5fa, #3b82f6); }
.bagpt-c-channel-icon--clock { background: linear-gradient(135deg, #a78bfa, #7c3aed); }

.bagpt-c-channel-title {
	font-size: clamp(17px, 2vw, 19px);
	font-weight: 800;
	color: #fff;
	margin: 0 0 10px;
	line-height: 1.5;
}
.bagpt-c-channel-value {
	display: inline-block;
	max-width: 100%;
	font-size: clamp(18px, 2.4vw, 24px);
	font-weight: 800;
	color: #fff;
	background-image: linear-gradient(135deg, #c4b5fd, #93c5fd);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	text-decoration: none;
	letter-spacing: .2px;
	word-break: break-all;
	overflow-wrap: anywhere;
	margin: 4px 0 8px;
	line-height: 1.5;
}
a.bagpt-c-channel-value:hover { filter: brightness(1.15); }
.bagpt-c-channel-value--static {
	background-image: none;
	-webkit-text-fill-color: initial;
	color: #fff;
	font-size: clamp(15px, 2vw, 18px);
	font-weight: 700;
}
.bagpt-c-channel-desc {
	font-size: 14px;
	color: var(--text-soft);
	margin: 0 0 16px;
	line-height: 1.85;
}
.bagpt-c-copy-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, .14);
	background: rgba(255, 255, 255, .04);
	color: #cbd5f5;
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
	font-family: inherit;
	transition: background .2s ease, border-color .2s ease, color .2s ease, transform .15s ease;
}
.bagpt-c-copy-btn:hover { background: rgba(255, 255, 255, .08); border-color: rgba(96, 165, 250, .4); color: #fff; }
.bagpt-c-copy-btn:active { transform: scale(.97); }
.bagpt-c-copy-btn.is-copied {
	background: linear-gradient(135deg, rgba(16, 185, 129, .25), rgba(34, 211, 238, .2));
	border-color: rgba(16, 185, 129, .55);
	color: #d1fae5;
}
.bagpt-c-copy-btn svg { flex: 0 0 auto; }

/* Social grid. */
.bagpt-c-section--social { padding-block: 32px 24px; }
.bagpt-c-social-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 14px;
	max-width: 1080px;
	margin-inline: auto;
}
.bagpt-c-social-card {
	position: relative;
	display: grid;
	grid-template-columns: 48px 1fr 22px;
	align-items: center;
	gap: 14px;
	padding: 18px 18px;
	border-radius: 18px;
	border: 1px solid rgba(255, 255, 255, .1);
	background: linear-gradient(180deg, rgba(255, 255, 255, .04), rgba(255, 255, 255, .015));
	color: inherit;
	text-decoration: none;
	transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease, background .25s ease;
}
.bagpt-c-social-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 18px 40px -18px rgba(15, 23, 42, .65);
}
.bagpt-c-social-icon {
	display: inline-flex;
	width: 48px;
	height: 48px;
	align-items: center;
	justify-content: center;
	border-radius: 14px;
	color: #fff;
	background: linear-gradient(135deg, rgba(167, 139, 250, .35), rgba(96, 165, 250, .35));
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15);
	flex: 0 0 auto;
}
.bagpt-c-social-meta {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}
.bagpt-c-social-name {
	font-size: 15px;
	font-weight: 800;
	color: #fff;
	line-height: 1.4;
}
.bagpt-c-social-desc {
	font-size: 12.5px;
	color: var(--text-soft);
	line-height: 1.6;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}
.bagpt-c-social-arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: rgba(255, 255, 255, .55);
	transition: transform .25s ease, color .25s ease;
}
.bagpt-c-social-card:hover .bagpt-c-social-arrow {
	color: #fff;
	transform: translateX(-3px);
}

/* Brand color tints — تأکید روی border + icon background در hover. */
.bagpt-c-social-brand--rubika    .bagpt-c-social-icon { background: linear-gradient(135deg, #ff5a5a, #c026d3); }
.bagpt-c-social-brand--rubika:hover    { border-color: rgba(192, 38, 211, .55); }
.bagpt-c-social-brand--bale      .bagpt-c-social-icon { background: linear-gradient(135deg, #16a34a, #059669); }
.bagpt-c-social-brand--bale:hover      { border-color: rgba(22, 163, 74, .5); }
.bagpt-c-social-brand--telegram  .bagpt-c-social-icon { background: linear-gradient(135deg, #38bdf8, #0284c7); }
.bagpt-c-social-brand--telegram:hover  { border-color: rgba(56, 189, 248, .5); }
.bagpt-c-social-brand--whatsapp  .bagpt-c-social-icon { background: linear-gradient(135deg, #25d366, #128c7e); }
.bagpt-c-social-brand--whatsapp:hover  { border-color: rgba(37, 211, 102, .5); }
.bagpt-c-social-brand--instagram .bagpt-c-social-icon { background: linear-gradient(135deg, #f59e0b, #ec4899, #8b5cf6); }
.bagpt-c-social-brand--instagram:hover { border-color: rgba(236, 72, 153, .5); }
.bagpt-c-social-brand--twitter   .bagpt-c-social-icon { background: linear-gradient(135deg, #0f172a, #1f2937); }
.bagpt-c-social-brand--twitter:hover   { border-color: rgba(148, 163, 184, .55); }
.bagpt-c-social-brand--youtube   .bagpt-c-social-icon { background: linear-gradient(135deg, #ef4444, #dc2626); }
.bagpt-c-social-brand--youtube:hover   { border-color: rgba(239, 68, 68, .5); }
.bagpt-c-social-brand--aparat    .bagpt-c-social-icon { background: linear-gradient(135deg, #ec4899, #c026d3); }
.bagpt-c-social-brand--aparat:hover    { border-color: rgba(236, 72, 153, .5); }
.bagpt-c-social-brand--linkedin  .bagpt-c-social-icon { background: linear-gradient(135deg, #0ea5e9, #075985); }
.bagpt-c-social-brand--linkedin:hover  { border-color: rgba(14, 165, 233, .5); }
.bagpt-c-social-brand--eitaa     .bagpt-c-social-icon { background: linear-gradient(135deg, #fb923c, #ea580c); }
.bagpt-c-social-brand--eitaa:hover     { border-color: rgba(251, 146, 60, .5); }
.bagpt-c-social-brand--soroush   .bagpt-c-social-icon { background: linear-gradient(135deg, #60a5fa, #2563eb); }
.bagpt-c-social-brand--soroush:hover   { border-color: rgba(96, 165, 250, .55); }

/* CTA — جزئی فقط برای فضای صفحهٔ contact. */
.bagpt-c-cta { margin-top: 20px; }

/* Responsive. */
@media (max-width: 880px) {
	.bagpt-c-section--channels { padding-block: 48px 18px; }
	.bagpt-c-channels-grid { grid-template-columns: 1fr; gap: 14px; }
	.bagpt-c-channel-card { padding: 22px 20px 20px; border-radius: 18px; }
	.bagpt-c-channel-icon { width: 56px; height: 56px; border-radius: 16px; }
	.bagpt-c-social-grid { grid-template-columns: 1fr; }
	.bagpt-c-social-card { padding: 16px 16px; border-radius: 16px; }
}
@media (max-width: 480px) {
	.bagpt-c-channel-value { font-size: clamp(16px, 5.5vw, 21px); }
	.bagpt-c-social-name { font-size: 14.5px; }
	.bagpt-c-social-desc { font-size: 12px; -webkit-line-clamp: 3; }
}

@media (prefers-reduced-motion: reduce) {
	.bagpt-c-channel-card,
	.bagpt-c-social-card,
	.bagpt-c-copy-btn,
	.bagpt-c-social-arrow { transition: none !important; }
	.bagpt-c-channel-card:hover,
	.bagpt-c-social-card:hover { transform: none !important; }
	.bagpt-c-social-card:hover .bagpt-c-social-arrow { transform: none !important; }
}

/* ===================================================================
 * baGPT Terms — صفحهٔ «قوانین استفاده از سرویس»
 *   namespace: .bagpt-t-*
 * =================================================================== */

.bagpt-t-hero-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding-block: 12px 4px;
}
.bagpt-t-hero-copy { max-width: 760px; margin-inline: auto; }
.bagpt-t-hero-copy .bagpt-l-eyebrow { justify-content: center; }
.bagpt-t-hero-copy .bagpt-l-hero-title { text-align: center; }
.bagpt-t-hero-copy .bagpt-l-hero-desc { text-align: center; margin-inline: auto; }
.bagpt-t-hero-copy .bagpt-l-hero-cta { justify-content: center; }

/* Intro section — مقدمه + کالاوت 📌. */
.bagpt-t-section--intro { padding-block: 56px 8px; }
.bagpt-t-intro {
	max-width: 880px;
	margin-inline: auto;
	display: flex;
	flex-direction: column;
	gap: 18px;
}
.bagpt-t-intro-paragraph {
	font-size: clamp(15px, 1.6vw, 17.5px);
	color: var(--text-soft);
	line-height: 2;
	margin: 0;
	text-align: center;
}
.bagpt-t-alert {
	position: relative;
	isolation: isolate;
	display: flex;
	gap: 14px;
	align-items: center;
	padding: 16px 18px;
	border-radius: 18px;
	border: 1px solid rgba(96, 165, 250, .35);
	background:
		linear-gradient(180deg, rgba(96, 165, 250, .14), rgba(96, 165, 250, .06)),
		linear-gradient(180deg, rgba(255, 255, 255, .04), rgba(255, 255, 255, .015));
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}
.bagpt-t-alert::before {
	content: "";
	position: absolute;
	inset-block: 12px;
	inset-inline-end: 0;
	width: 3px;
	border-radius: 999px;
	background: linear-gradient(180deg, #60a5fa, #a78bfa);
}
.bagpt-t-alert-icon {
	display: inline-flex;
	width: 44px;
	height: 44px;
	align-items: center;
	justify-content: center;
	border-radius: 14px;
	color: #fff;
	background: linear-gradient(135deg, #60a5fa, #3b82f6);
	box-shadow: 0 14px 30px -14px rgba(15, 23, 42, .65), inset 0 1px 0 rgba(255, 255, 255, .2);
	flex: 0 0 auto;
}
.bagpt-t-alert-text {
	margin: 0;
	font-size: clamp(14px, 1.45vw, 16px);
	color: #e2e8f0;
	font-weight: 600;
	line-height: 1.85;
}

/* Terms list — کارت‌های شماره‌دار. */
.bagpt-t-section--list { padding-block: 32px 24px; }
.bagpt-t-list {
	display: flex;
	flex-direction: column;
	gap: 20px;
	max-width: 1000px;
	margin-inline: auto;
}
.bagpt-t-card {
	position: relative;
	display: grid;
	grid-template-columns: 92px 1fr;
	gap: 18px;
	padding: 26px 26px 22px;
	border-radius: 22px;
	border: 1px solid rgba(255, 255, 255, .1);
	background: linear-gradient(180deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .015));
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	scroll-margin-top: 96px;
	transition: border-color .3s ease, box-shadow .3s ease, transform .3s ease;
}
.bagpt-t-card:hover {
	border-color: rgba(167, 139, 250, .35);
	box-shadow: 0 24px 60px -24px rgba(15, 23, 42, .6);
}
.bagpt-t-card:target {
	border-color: rgba(96, 165, 250, .55);
	box-shadow: 0 0 0 4px rgba(96, 165, 250, .15), 0 28px 60px -24px rgba(15, 23, 42, .65);
	animation: bagpt-t-target-pulse 1.6s ease-out 0s 1;
}
@keyframes bagpt-t-target-pulse {
	0%   { box-shadow: 0 0 0 0 rgba(96, 165, 250, .35), 0 28px 60px -24px rgba(15, 23, 42, .65); }
	100% { box-shadow: 0 0 0 4px rgba(96, 165, 250, .15), 0 28px 60px -24px rgba(15, 23, 42, .65); }
}
.bagpt-t-num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 80px;
	height: 80px;
	border-radius: 22px;
	font-size: clamp(28px, 4vw, 40px);
	font-weight: 900;
	color: #fff;
	background: linear-gradient(135deg, #a78bfa, #60a5fa);
	box-shadow: 0 18px 40px -16px rgba(124, 58, 237, .55), inset 0 1px 0 rgba(255, 255, 255, .22);
	font-variant-numeric: tabular-nums;
	flex: 0 0 auto;
}
.bagpt-t-card-body { min-width: 0; }
.bagpt-t-card-title {
	display: flex;
	align-items: baseline;
	gap: 10px;
	font-size: clamp(18px, 2.2vw, 22px);
	font-weight: 800;
	color: #fff;
	margin: 0 0 12px;
	line-height: 1.5;
}
.bagpt-t-card-anchor {
	color: rgba(255, 255, 255, .25);
	text-decoration: none;
	font-weight: 700;
	font-size: .8em;
	transition: color .2s ease;
}
.bagpt-t-card:hover .bagpt-t-card-anchor,
.bagpt-t-card-anchor:hover { color: #93c5fd; }
.bagpt-t-card-desc {
	font-size: clamp(14px, 1.45vw, 15.5px);
	color: var(--text-soft);
	line-height: 1.95;
}
.bagpt-t-card-desc p { margin: 0 0 10px; }
.bagpt-t-card-desc p:last-child { margin-bottom: 0; }
.bagpt-t-card-desc ul,
.bagpt-t-card-desc ol {
	margin: 8px 0 0;
	padding-inline-start: 6px;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.bagpt-t-card-desc li {
	position: relative;
	padding-inline-start: 22px;
	color: var(--text-soft);
	line-height: 1.85;
}
.bagpt-t-card-desc li::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	top: .7em;
	width: 10px;
	height: 10px;
	border-radius: 999px;
	background: linear-gradient(135deg, #a78bfa, #60a5fa);
	box-shadow: 0 0 0 3px rgba(167, 139, 250, .14);
}
.bagpt-t-card-desc strong { color: #e2e8f0; font-weight: 800; }
.bagpt-t-card-desc a {
	color: #93c5fd;
	text-decoration: underline;
	text-underline-offset: 3px;
}
.bagpt-t-card-desc a:hover { color: #c4b5fd; }

.bagpt-t-card-note {
	margin-top: 16px;
	display: flex;
	gap: 12px;
	align-items: center;
	padding: 12px 14px;
	border-radius: 14px;
	border: 1px solid rgba(251, 146, 60, .35);
	background: linear-gradient(180deg, rgba(251, 146, 60, .14), rgba(251, 146, 60, .05));
}
.bagpt-t-card-note-icon {
	display: inline-flex;
	width: 34px;
	height: 34px;
	align-items: center;
	justify-content: center;
	border-radius: 10px;
	color: #fff;
	background: linear-gradient(135deg, #fb923c, #ea580c);
	box-shadow: 0 12px 24px -12px rgba(234, 88, 12, .55), inset 0 1px 0 rgba(255, 255, 255, .2);
	flex: 0 0 auto;
}
.bagpt-t-card-note-text {
	margin: 0;
	font-size: 13.5px;
	color: #fed7aa;
	font-weight: 600;
	line-height: 1.8;
}

/* Terms CTA spacing. */
.bagpt-t-cta { margin-top: 16px; }

/* Responsive. */
@media (max-width: 880px) {
	.bagpt-t-section--intro { padding-block: 36px 4px; }
	.bagpt-t-intro-paragraph { text-align: right; line-height: 1.95; }
	.bagpt-t-alert { padding: 14px 14px; border-radius: 16px; }
	.bagpt-t-alert-icon { width: 38px; height: 38px; border-radius: 12px; }

	.bagpt-t-section--list { padding-block: 24px 18px; }
	.bagpt-t-list { gap: 16px; }
	.bagpt-t-card {
		grid-template-columns: 1fr;
		gap: 14px;
		padding: 20px 20px 18px;
		border-radius: 18px;
	}
	.bagpt-t-num {
		width: 56px;
		height: 56px;
		border-radius: 16px;
		font-size: 24px;
	}
	.bagpt-t-card-title { font-size: 17px; }
}
@media (max-width: 480px) {
	.bagpt-t-card { padding: 16px 16px 14px; }
	.bagpt-t-num { width: 48px; height: 48px; font-size: 22px; border-radius: 14px; }
	.bagpt-t-card-title { font-size: 16px; }
	.bagpt-t-card-desc { font-size: 13.5px; line-height: 1.9; }
	.bagpt-t-card-note { padding: 10px 12px; }
	.bagpt-t-card-note-text { font-size: 12.5px; }
}

@media (prefers-reduced-motion: reduce) {
	.bagpt-t-card,
	.bagpt-t-card-anchor { transition: none !important; }
	.bagpt-t-card:hover { transform: none !important; }
	.bagpt-t-card:target { animation: none !important; }
}

/* ==========================================================================
 * Landing Auth Fold (guest first viewport)
 * ========================================================================== */
.bagpt-l-authfold {
	position: relative;
	min-height: 100dvh;
	padding-block: clamp(82px, 10vh, 112px) clamp(18px, 3.8vh, 34px);
}
.bagpt-l-authfold-wrap {
	min-height: calc(100dvh - clamp(104px, 14vh, 148px));
	max-width: 1240px;
	margin-inline: auto;
	padding-inline: clamp(16px, 3vw, 40px);
	display: grid;
	align-items: center;
	gap: clamp(18px, 3vw, 34px);
}
.bagpt-l-authfold-copy {
	display: grid;
	gap: 12px;
	max-width: 760px;
}
.bagpt-l-authfold-kicker {
	margin: 0;
	display: inline-flex;
	width: fit-content;
	padding: 8px 12px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .02em;
	color: #cffafe;
	border: 1px solid rgba(6, 182, 212, .36);
	background: linear-gradient(180deg, rgba(6, 182, 212, .2), rgba(6, 182, 212, .06));
}
.bagpt-l-authfold-title {
	margin: 0;
	font-size: clamp(28px, 5.1vw, 52px);
	line-height: 1.3;
	color: #f8fafc;
}
.bagpt-l-authfold-lead {
	margin: 0;
	max-width: 62ch;
	font-size: clamp(14px, 2.2vw, 18px);
	line-height: 1.95;
	color: rgba(226, 232, 240, .86);
}
.bagpt-l-authfold-points {
	margin: 2px 0 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 8px;
}
.bagpt-l-authfold-points li {
	position: relative;
	padding-inline-start: 22px;
	font-size: 13.5px;
	line-height: 1.9;
	color: rgba(203, 213, 225, .86);
}
.bagpt-l-authfold-points li::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	top: .72em;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: linear-gradient(135deg, #22d3ee, #8b5cf6);
	box-shadow: 0 0 0 3px rgba(34, 211, 238, .12);
}

.bagpt-l-authfold-card-wrap { width: 100%; }
.bagpt-l-authfold-card {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	border-radius: 24px;
	padding: clamp(18px, 3vw, 26px);
	border: 1px solid rgba(148, 163, 184, .26);
	background:
		radial-gradient(130% 90% at 120% -20%, rgba(56, 189, 248, .22), transparent 48%),
		radial-gradient(120% 90% at -10% 120%, rgba(139, 92, 246, .2), transparent 52%),
		linear-gradient(180deg, rgba(15, 23, 42, .88), rgba(2, 6, 23, .84));
	box-shadow: 0 22px 56px -24px rgba(2, 6, 23, .85), inset 0 1px 0 rgba(255, 255, 255, .12);
	backdrop-filter: blur(6px);
}
.bagpt-l-authfold-card-glow {
	position: absolute;
	inset: -40% -20% auto auto;
	width: 70%;
	height: 70%;
	z-index: -1;
	background: radial-gradient(closest-side, rgba(56, 189, 248, .35), transparent 70%);
	filter: blur(30px);
	opacity: .55;
	pointer-events: none;
}
.bagpt-l-authfold-card-head {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 10px;
}
.bagpt-l-authfold-card-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	flex: 0 0 auto;
	border-radius: 14px;
	color: #e0f2fe;
	background: linear-gradient(135deg, rgba(56, 189, 248, .26), rgba(99, 102, 241, .22));
	border: 1px solid rgba(125, 211, 252, .3);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18);
}
.bagpt-l-authfold-card-headtext { min-width: 0; }
.bagpt-l-authfold-card-eyebrow {
	margin: 0;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: rgba(125, 211, 252, .9);
}
.bagpt-l-authfold-card-title {
	margin: 4px 0 0;
	font-size: clamp(18px, 4.5vw, 22px);
	line-height: 1.45;
	color: #fff;
}
.bagpt-l-authfold-card-sub {
	margin: 0 0 14px;
	font-size: 13px;
	line-height: 1.85;
	color: rgba(203, 213, 225, .82);
}
.bagpt-l-authfold-form {
	display: grid;
	gap: 10px;
}
.bagpt-l-authfold-form[hidden] { display: none !important; }
.bagpt-l-authfold-label {
	font-size: 12px;
	font-weight: 600;
	color: rgba(203, 213, 225, .9);
}
.bagpt-l-authfold-input-wrap {
	position: relative;
}
.bagpt-l-authfold-input-icon {
	position: absolute;
	inset-inline-start: 12px;
	top: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	color: rgba(125, 211, 252, .8);
	pointer-events: none;
	transition: color .2s ease;
}
.bagpt-l-authfold-input {
	width: 100%;
	height: 50px;
	border-radius: 14px;
	border: 1px solid rgba(148, 163, 184, .3);
	background: rgba(15, 23, 42, .6);
	padding: 0 16px 0 42px;
	font-size: 15px;
	color: #f8fafc;
	direction: ltr;
	text-align: left;
	outline: none;
	transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.bagpt-l-authfold-input::placeholder { color: rgba(148, 163, 184, .78); }
.bagpt-l-authfold-input:focus {
	border-color: rgba(56, 189, 248, .62);
	box-shadow: 0 0 0 4px rgba(56, 189, 248, .16);
	background: rgba(15, 23, 42, .72);
}
.bagpt-l-authfold-input:focus + .bagpt-l-authfold-input-icon,
.bagpt-l-authfold-input-wrap:focus-within .bagpt-l-authfold-input-icon { color: #7dd3fc; }

.bagpt-l-authfold-hint {
	margin: 6px 2px 2px;
	font-size: 12px;
	line-height: 1.7;
	color: rgba(148, 163, 184, .85);
	transition: color .2s ease;
}
.bagpt-l-authfold-hint.is-error { color: #fca5a5; }
.bagpt-l-authfold-hint.is-ok { color: #6ee7b7; }

/* Alert */
.bagpt-l-authfold-alert {
	margin: 0 0 12px;
	padding: 10px 12px;
	border-radius: 12px;
	font-size: 13px;
	line-height: 1.7;
	border: 1px solid rgba(248, 113, 113, .42);
	background: rgba(239, 68, 68, 0.14);
	color: #fecaca;
}

/* OTP input */
.bagpt-l-authfold-input--otp {
	text-align: center;
	letter-spacing: .42em;
	font-size: 22px;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	padding: 0 12px;
	direction: ltr;
}
.bagpt-l-authfold-input--otp::placeholder {
	letter-spacing: .42em;
	color: rgba(148, 163, 184, .45);
}

/* Phone line above OTP */
.bagpt-l-authfold-phone-line {
	margin: 0 0 8px;
	font-size: 12.5px;
	color: rgba(203, 213, 225, .82);
}
.bagpt-l-authfold-phone-line strong {
	color: #e0f2fe;
	margin: 0 4px;
	font-weight: 700;
}

/* OTP foot links */
.bagpt-l-authfold-otp-foot {
	margin-top: 12px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}
.bagpt-l-authfold-link {
	background: transparent;
	border: 0;
	padding: 6px 4px;
	font: inherit;
	font-size: 12.5px;
	font-weight: 700;
	color: #7dd3fc;
	cursor: pointer;
	transition: color .2s ease, opacity .2s ease;
}
.bagpt-l-authfold-link:hover { color: #bae6fd; }
.bagpt-l-authfold-link:disabled {
	color: rgba(148, 163, 184, .55);
	cursor: not-allowed;
	opacity: .8;
}
.bagpt-l-authfold-link--muted { color: rgba(203, 213, 225, .75); font-weight: 600; }
.bagpt-l-authfold-link--muted:hover { color: #e0f2fe; }

/* Spinner inside submit button */
.bagpt-l-authfold-spinner {
	display: none;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	border: 2px solid rgba(255, 255, 255, .35);
	border-top-color: #fff;
	animation: bagpt-l-authfold-spin .8s linear infinite;
	margin-inline-end: 4px;
}
.bagpt-l-authfold-submit.is-loading .bagpt-l-authfold-spinner { display: inline-block; }
.bagpt-l-authfold-submit.is-loading .bagpt-l-authfold-submit-arrow { display: none; }
.bagpt-l-authfold-submit:disabled {
	cursor: progress;
	opacity: .88;
	filter: saturate(.9);
}
@keyframes bagpt-l-authfold-spin {
	to { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
	.bagpt-l-authfold-spinner { animation-duration: 1.6s; }
}
.bagpt-l-authfold-submit {
	height: 52px;
	border: 0;
	border-radius: 14px;
	font-size: 15.5px;
	font-weight: 800;
	color: #f8fafc;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background: linear-gradient(135deg, #0ea5e9, #6366f1);
	box-shadow: 0 14px 34px -16px rgba(99, 102, 241, .75), inset 0 1px 0 rgba(255, 255, 255, .28);
	transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.bagpt-l-authfold-submit-arrow {
	transition: transform .25s ease;
}
.bagpt-l-authfold-submit:hover {
	transform: translateY(-1px);
	filter: brightness(1.05);
	box-shadow: 0 18px 36px -16px rgba(59, 130, 246, .7), inset 0 1px 0 rgba(255, 255, 255, .3);
}
.bagpt-l-authfold-submit:hover .bagpt-l-authfold-submit-arrow { transform: translateX(-3px); }
.bagpt-l-authfold-submit:active { transform: translateY(0); }
.bagpt-l-authfold-trust {
	margin: 14px 0 0;
	padding: 12px 8px;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 6px 14px;
	justify-content: space-between;
	border-top: 1px dashed rgba(148, 163, 184, .22);
}
.bagpt-l-authfold-trust li {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 11.5px;
	font-weight: 600;
	color: rgba(203, 213, 225, .82);
}
.bagpt-l-authfold-trust svg {
	color: #7dd3fc;
	flex: 0 0 auto;
}

@media (min-width: 980px) {
	.bagpt-l-authfold-wrap {
		grid-template-columns: minmax(0, 1.12fr) minmax(420px, .88fr);
	}
	.bagpt-l-authfold-card-wrap {
		justify-self: end;
		max-width: 520px;
		width: min(100%, 520px);
	}
	.bagpt-l-authfold-card { padding: 26px 24px; }
	.bagpt-l-authfold-input,
	.bagpt-l-authfold-submit { height: 52px; }
}
@media (max-width: 680px) {
	.bagpt-l-authfold {
		padding-block: max(82px, env(safe-area-inset-top)) 24px;
	}
	.bagpt-l-authfold-wrap {
		min-height: calc(100dvh - 108px);
		padding-inline: clamp(14px, 4.5vw, 20px);
		align-content: start;
		gap: 22px;
	}
	/* Mobile-first ordering: card appears above the marketing copy. */
	.bagpt-l-authfold-card-wrap { order: 0; }
	.bagpt-l-authfold-copy { order: 1; gap: 10px; padding-top: 4px; }

	.bagpt-l-authfold-kicker { font-size: 11px; padding: 6px 10px; }
	.bagpt-l-authfold-title { font-size: 22px; line-height: 1.45; }
	.bagpt-l-authfold-lead { font-size: 14px; line-height: 1.85; }
	.bagpt-l-authfold-points { gap: 6px; }
	.bagpt-l-authfold-points li { font-size: 12.5px; line-height: 1.75; padding-inline-start: 18px; }
	.bagpt-l-authfold-points li::before { width: 8px; height: 8px; top: .65em; }

	.bagpt-l-authfold-card {
		border-radius: 24px;
		padding: 26px 20px 22px;
		background:
			radial-gradient(120% 80% at 110% -10%, rgba(56, 189, 248, .28), transparent 55%),
			radial-gradient(120% 80% at -10% 110%, rgba(139, 92, 246, .24), transparent 55%),
			linear-gradient(180deg, rgba(15, 23, 42, .94), rgba(2, 6, 23, .92));
		box-shadow: 0 22px 44px -22px rgba(2, 6, 23, .9), inset 0 1px 0 rgba(255, 255, 255, .12);
	}
	.bagpt-l-authfold-card-head { gap: 12px; margin-bottom: 14px; }
	.bagpt-l-authfold-card-icon { width: 44px; height: 44px; border-radius: 14px; }
	.bagpt-l-authfold-card-icon svg { width: 22px; height: 22px; }
	.bagpt-l-authfold-card-eyebrow { font-size: 11px; }
	.bagpt-l-authfold-card-title { font-size: 18px; margin-top: 4px; line-height: 1.45; }
	.bagpt-l-authfold-card-sub { font-size: 13px; margin-bottom: 18px; line-height: 1.85; }

	.bagpt-l-authfold-form { gap: 10px; }
	.bagpt-l-authfold-label { font-size: 12px; }
	.bagpt-l-authfold-input {
		height: 56px;
		font-size: 16px;
		border-radius: 14px;
		padding: 0 14px 0 42px;
	}
	.bagpt-l-authfold-input-icon { inset-inline-start: 14px; }
	.bagpt-l-authfold-submit {
		height: 58px;
		font-size: 16px;
		border-radius: 14px;
		margin-top: 4px;
	}
	.bagpt-l-authfold-hint { font-size: 12.5px; margin-top: 6px; }
	.bagpt-l-authfold-trust {
		margin-top: 18px;
		padding: 14px 6px 4px;
		gap: 8px 12px;
	}
	.bagpt-l-authfold-trust li { font-size: 11.5px; }
}

@media (prefers-reduced-motion: reduce) {
	.bagpt-l-authfold-input,
	.bagpt-l-authfold-submit { transition: none !important; }
	.bagpt-l-authfold-submit:hover { transform: none !important; }
}

/* ==========================================================================
   Magazine / blog archive (page template page-bagpt-magazine.php)
   ========================================================================== */

.bagpt-m-main {
	padding-bottom: clamp(48px, 8vw, 96px);
}

.bagpt-m-hero {
	padding-top: clamp(24px, 4vw, 40px);
	padding-bottom: clamp(8px, 2vw, 24px);
}

.bagpt-m-hero-inner {
	max-width: 920px;
}

.bagpt-m-archive {
	padding: clamp(12px, 3vw, 32px) clamp(16px, 4vw, 28px) clamp(40px, 6vw, 72px);
}

.bagpt-m-archive-inner {
	max-width: 1180px;
	margin-inline: auto;
}

.bagpt-m-archive-head {
	margin-bottom: clamp(24px, 4vw, 40px);
}

.bagpt-m-archive-title {
	margin: 10px 0 0;
	font-size: clamp(22px, 3.2vw, 30px);
	font-weight: 700;
	line-height: 1.35;
	color: var(--bagpt-l-text, #f4f7ff);
}

.bagpt-m-empty {
	padding: clamp(28px, 5vw, 48px);
	border-radius: 20px;
	border: 1px dashed rgba(148, 163, 184, 0.35);
	background: rgba(15, 23, 42, 0.45);
	text-align: center;
	color: rgba(226, 232, 240, 0.88);
}

.bagpt-m-empty p {
	margin: 0 0 12px;
	line-height: 1.8;
}

.bagpt-m-empty-admin {
	margin-top: 18px !important;
}

.bagpt-m-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: clamp(16px, 2.5vw, 24px);
}

@media (min-width: 640px) {
	.bagpt-m-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.bagpt-m-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.bagpt-m-card {
	margin: 0;
	border-radius: 20px;
	overflow: hidden;
}

.bagpt-m-card-link {
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	color: inherit;
	border-radius: 20px;
	border: 1px solid rgba(148, 163, 184, 0.22);
	background:
		linear-gradient(165deg, rgba(30, 41, 59, 0.72), rgba(2, 6, 23, 0.82));
	box-shadow: 0 18px 40px -24px rgba(2, 6, 23, 0.85);
	transition: border-color 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease;
}

.bagpt-m-card-link:hover {
	border-color: rgba(56, 189, 248, 0.45);
	transform: translateY(-3px);
	box-shadow: 0 22px 48px -20px rgba(14, 165, 233, 0.35);
}

.bagpt-m-card-media {
	position: relative;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: rgba(15, 23, 42, 0.9);
}

.bagpt-m-card-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.bagpt-m-card-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background:
		radial-gradient(120% 100% at 100% 0%, rgba(56, 189, 248, 0.35), transparent 55%),
		radial-gradient(120% 100% at 0% 100%, rgba(139, 92, 246, 0.32), transparent 55%),
		linear-gradient(145deg, rgba(30, 41, 59, 0.95), rgba(2, 6, 23, 0.95));
}

.bagpt-m-card-placeholder span {
	font-size: clamp(42px, 8vw, 56px);
	font-weight: 800;
	line-height: 1;
	color: rgba(248, 250, 252, 0.92);
	text-shadow: 0 8px 24px rgba(2, 6, 23, 0.45);
}

.bagpt-m-card-body {
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 10px;
	padding: 18px 18px 20px;
}

.bagpt-m-card-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.bagpt-m-card-tag {
	display: inline-flex;
	align-items: center;
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: rgba(224, 242, 254, 0.95);
	background: rgba(56, 189, 248, 0.14);
	border: 1px solid rgba(56, 189, 248, 0.28);
}

.bagpt-m-card-title {
	margin: 0;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.45;
	color: var(--bagpt-l-text, #f8fafc);
}

.bagpt-m-card-excerpt {
	margin: 0;
	font-size: 13.5px;
	line-height: 1.75;
	color: rgba(203, 213, 225, 0.88);
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.bagpt-m-card-meta {
	margin-top: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding-top: 8px;
	font-size: 12.5px;
	color: rgba(148, 163, 184, 0.95);
}

.bagpt-m-card-read {
	font-weight: 600;
	color: rgba(125, 211, 252, 0.95);
	white-space: nowrap;
}

.bagpt-m-pagination {
	margin-top: clamp(28px, 4vw, 44px);
	display: flex;
	justify-content: center;
}

.bagpt-m-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	margin: 0 4px;
	border-radius: 12px;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	color: rgba(226, 232, 240, 0.92);
	border: 1px solid rgba(148, 163, 184, 0.28);
	background: rgba(15, 23, 42, 0.55);
	transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.bagpt-m-pagination .page-numbers:hover,
.bagpt-m-pagination .page-numbers.current {
	border-color: rgba(56, 189, 248, 0.5);
	background: rgba(56, 189, 248, 0.16);
	color: #f8fafc;
}

.bagpt-m-pagination ul {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 4px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.bagpt-m-pagination li {
	margin: 0;
}

.bagpt-m-footer {
	margin-top: clamp(24px, 4vw, 48px);
}

@media (prefers-reduced-motion: reduce) {
	.bagpt-m-card-link {
		transition: none;
	}
	.bagpt-m-card-link:hover {
		transform: none;
	}
}

/* ================================================================ *
 * Single Post — هم‌سبک مجله/لندینگ
 * ================================================================ */
.bagpt-single-main {
	max-width: var(--maxw-narrow, 880px);
	margin: 0 auto;
	padding: clamp(16px, 3vw, 36px) clamp(16px, 3vw, 40px) 80px;
	position: relative;
	z-index: 1;
}

/* Breadcrumb */
.bagpt-breadcrumb { margin: 8px 0 22px; font-size: 13px; color: var(--text-muted); }
.bagpt-breadcrumb ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.bagpt-breadcrumb li { display: inline-flex; align-items: center; gap: 8px; }
.bagpt-breadcrumb li + li::before { content: '‹'; color: var(--text-faint); font-size: 14px; }
.bagpt-breadcrumb a { color: var(--text-soft); text-decoration: none; transition: color .15s; }
.bagpt-breadcrumb a:hover { color: var(--accent-cyan); }
.bagpt-breadcrumb [aria-current=page] span { color: var(--text-primary); font-weight: 600; }

/* Cats / Title / Lede */
.bagpt-single-meta { margin-bottom: 22px; }
.bagpt-single-cats { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.bagpt-single-cats a {
	font-size: 12px; padding: 4px 12px; border-radius: 999px;
	background: rgba(34, 211, 238, 0.10);
	border: 1px solid rgba(34, 211, 238, 0.30);
	color: #a5f3fc; text-decoration: none; transition: all .15s;
}
.bagpt-single-cats a:hover { background: rgba(34,211,238,0.20); }
.bagpt-single-title {
	font-size: clamp(28px, 4.4vw, 48px);
	line-height: 1.25;
	margin: 6px 0 14px;
	background: var(--gradient-galaxy);
	-webkit-background-clip: text; background-clip: text;
	color: transparent; font-weight: 800;
}
.bagpt-single-lede { color: var(--text-soft); font-size: clamp(15px, 1.6vw, 18px); line-height: 1.85; margin: 0 0 18px; }

/* Byline */
.bagpt-single-byline {
	display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center;
	color: var(--text-muted); font-size: 14px;
}
.bagpt-byline-author {
	display: inline-flex; align-items: center; gap: 8px;
	color: var(--text-soft); text-decoration: none;
	background: var(--bg-card);
	border: 1px solid var(--border-soft);
	padding: 4px 10px 4px 4px; border-radius: 999px;
	transition: border-color .15s;
}
.bagpt-byline-author:hover { border-color: var(--accent-cyan); color: var(--text-primary); }
.bagpt-byline-avatar { width: 28px; height: 28px; border-radius: 999px; }
.bagpt-byline-sep { color: var(--text-faint); }

/* Cover */
.bagpt-single-cover {
	margin: 24px 0 28px;
	border-radius: 22px;
	overflow: hidden;
	border: 1px solid var(--border-mid);
	box-shadow: var(--shadow-card);
	max-height: 480px;
}
.bagpt-single-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Share */
.bagpt-single-share {
	display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
	padding: 10px 14px;
	background: var(--bg-card);
	border: 1px solid var(--border-soft);
	border-radius: 14px;
	margin: 0 0 24px;
	font-size: 13px;
}
.bagpt-share-label { color: var(--text-muted); }
.bagpt-share-btn {
	display: inline-flex; align-items: center; justify-content: center;
	width: 34px; height: 34px;
	background: rgba(255,255,255,0.04);
	border: 1px solid var(--border-soft);
	border-radius: 999px;
	color: var(--text-primary); text-decoration: none; font-size: 15px;
	cursor: pointer; transition: all .15s;
}
.bagpt-share-btn:hover { border-color: var(--accent-cyan); transform: translateY(-1px); color: var(--accent-cyan); }

.bagpt-single-content { margin-top: 8px; }

/* Author card */
.bagpt-author-card {
	display: flex; gap: 18px; align-items: flex-start;
	margin: 56px 0 24px;
	padding: 24px;
	background: linear-gradient(135deg, rgba(34,211,238,0.06), rgba(167,139,250,0.06));
	border: 1px solid var(--border-mid);
	border-radius: 22px;
	box-shadow: var(--shadow-card);
}
.bagpt-author-avatar {
	width: 80px; height: 80px;
	border-radius: 999px;
	border: 3px solid var(--border-strong);
	flex-shrink: 0;
}
.bagpt-author-body { flex: 1; min-width: 0; }
.bagpt-author-eyebrow { display: block; font-size: 12px; color: var(--text-muted); margin-bottom: 4px; }
.bagpt-author-name { font-size: 22px; margin: 0 0 8px; color: var(--text-primary); font-weight: 700; }
.bagpt-author-name a { color: inherit; text-decoration: none; }
.bagpt-author-name a:hover { color: var(--accent-cyan); }
.bagpt-author-bio { color: var(--text-soft); margin: 0 0 10px; font-size: 14.5px; line-height: 1.85; }
.bagpt-author-meta a { color: var(--accent-cyan); text-decoration: none; font-size: 13px; font-weight: 600; }
.bagpt-author-meta a:hover { text-decoration: underline; }

@media (max-width: 600px) {
	.bagpt-author-card { flex-direction: column; align-items: stretch; padding: 18px; }
	.bagpt-author-avatar { width: 64px; height: 64px; }
}

/* Related */
.bagpt-related { margin: 48px 0 12px; }
.bagpt-related-title {
	font-size: 22px;
	margin: 0 0 18px;
	color: var(--text-primary);
	font-weight: 700;
}
.bagpt-related-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 14px;
}
.bagpt-related-card {
	display: flex; flex-direction: column;
	background: var(--bg-card);
	border: 1px solid var(--border-soft);
	border-radius: 16px;
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	transition: all .2s ease;
}
.bagpt-related-card:hover {
	transform: translateY(-2px);
	border-color: rgba(34,211,238,0.4);
	box-shadow: var(--shadow-card);
}
.bagpt-related-cover {
	display: block;
	aspect-ratio: 16/10;
	background-color: rgba(255,255,255,0.04);
	background-size: cover;
	background-position: center;
}
.bagpt-related-info { padding: 12px 14px; display: flex; flex-direction: column; gap: 4px; }
.bagpt-related-title-t { color: var(--text-primary); font-weight: 600; font-size: 14px; line-height: 1.5; }
.bagpt-related-date { color: var(--text-muted); font-size: 12px; }

.bagpt-single-foot { margin-top: 36px; padding-top: 20px; border-top: 1px solid var(--border-soft); }
.bagpt-single-back a { color: var(--accent-cyan); text-decoration: none; font-weight: 600; }
.bagpt-single-back a:hover { text-decoration: underline; }

/* ============== Category archive (شبیه مجله) ============== */
.bagpt-cat-hero {
	max-width: var(--maxw, 1200px);
	margin: 0 auto;
	padding: clamp(28px, 5vw, 72px) clamp(20px, 4vw, 48px) clamp(20px, 3vw, 36px);
	text-align: center;
	position: relative;
	z-index: 1;
}
.bagpt-cat-eyebrow {
	display: inline-flex; align-items: center; gap: 8px;
	background: rgba(255,255,255,0.06);
	border: 1px solid var(--border-mid);
	color: var(--text-soft);
	padding: 6px 14px;
	border-radius: 999px;
	font-size: 13px;
	margin-bottom: 14px;
}
.bagpt-cat-eyebrow::before { content: ''; width: 7px; height: 7px; border-radius: 999px; background: var(--accent-cyan); box-shadow: 0 0 12px var(--accent-cyan); }
.bagpt-cat-title {
	font-size: clamp(32px, 5vw, 56px);
	line-height: 1.2;
	margin: 4px 0 14px;
	background: var(--gradient-galaxy);
	-webkit-background-clip: text; background-clip: text;
	color: transparent;
	font-weight: 800;
}
.bagpt-cat-desc {
	color: var(--text-soft);
	font-size: clamp(14px, 1.4vw, 17px);
	max-width: 720px;
	margin: 0 auto;
	line-height: 1.85;
}


