/* =========================================================
   آرارات — ویجت باکس تصویر خدماتی (Image Service Box)
   فقط چیدمان ساختاری اینجاست؛ رنگ، فاصله و تایپوگرافی به‌صورت
   زنده از پنل استایل المنتور کنترل می‌شوند.
   ========================================================= */

.aisb-wrapper {
	position: relative;
	display: flex;
	direction: ltr; /* چیدمان فیزیکی چپ↔راست دو ستون، مستقل از زبان سایت */
	align-items: stretch;
	width: 100%;
	box-sizing: border-box;
	font-family: 'Vazirmatn', Tahoma, Arial, sans-serif;
}

.aisb-wrapper * {
	box-sizing: border-box;
}

/* ---------- ستون تصویر ---------- */
/* flex-grow:0 و flex-shrink:0 عمداً صفر است تا تصویر همیشه دقیقاً
   همان درصدی را که از کنترل «عرض ستون تصویر» تعیین می‌شود اشغال کند
   و طول عنوان/توضیحات/دکمه‌ها هرگز باعث کوچک‌شدن آن نشود؛ فشردگی لازم
   همیشه روی ستون محتوا (که min-width:0 دارد) اعمال می‌شود. */
.aisb-media {
	position: relative;
	flex: 0 0 50%;
	max-width: 50%;
	min-width: 0;
	order: 1;
	overflow: hidden;
}

.aisb-media img {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 100%;
	object-fit: cover;
}

.aisb-wrapper--image-end .aisb-media {
	order: 2;
}

.aisb-wrapper--image-end .aisb-content {
	order: 1;
}

/* بدون تصویر: محتوا کل عرض را می‌گیرد */
.aisb-wrapper--no-image {
	display: block;
}

.aisb-wrapper--no-image .aisb-content {
	max-width: 100%;
	flex: none;
}

/* ---------- ستون محتوا ---------- */
.aisb-content {
	position: relative;
	flex: 1 1 auto;
	max-width: 100%;
	order: 2;
	direction: rtl;
	text-align: right;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: stretch;
	gap: 18px;
	min-width: 0;
}

.aisb-title {
	display: block;
	width: 100%;
	margin: 0;
	font-size: clamp(20px, 2.4vw, 30px);
	line-height: 1.5;
	font-weight: 800;
	color: #152238;
	white-space: pre-line;
}

.aisb-desc {
	display: block;
	width: 100%;
	margin: 0;
	font-size: clamp(14px, 1.2vw, 16px);
	line-height: 1.9;
	font-weight: 400;
	color: #5a6b85;
	max-width: 100%;
}

/* محتوای ویرایشگر بصری (WYSIWYG) داخل توضیحات */
.aisb-desc p {
	margin: 0 0 12px;
}

.aisb-desc p:last-child {
	margin-bottom: 0;
}

.aisb-desc ul,
.aisb-desc ol {
	margin: 0 0 12px;
	padding-inline-start: 22px;
	padding-inline-end: 0;
}

.aisb-desc ul:last-child,
.aisb-desc ol:last-child {
	margin-bottom: 0;
}

.aisb-desc a {
	color: inherit;
	text-decoration: underline;
}

.aisb-desc strong,
.aisb-desc b {
	font-weight: 700;
	color: inherit;
}

/* ---------- دکمه‌ها ---------- */
.aisb-buttons {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: right;
	gap: 12px;
	width: 100%;
}

.aisb-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	font-size: 14px;
	font-weight: 700;
	padding: 12px 28px;
	border-radius: 10px;
	text-decoration: none;
	cursor: pointer;
	border: 1.5px solid transparent;
	transition: 0.15s ease;
	white-space: nowrap;
}

/* ---------- آیکون دکمه ---------- */
.aisb-btn-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 0;
	font-size: 18px;
	flex-shrink: 0;
}

.aisb-btn-icon i {
	font-size: inherit;
}

.aisb-btn-icon svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
}

.aisb-btn--icon-only {
	padding-left: 16px;
	padding-right: 16px;
}

.aisb-btn--filled {
	background: #2f5cff;
	color: #ffffff;
}

.aisb-btn--filled:hover {
	filter: brightness(1.08);
	color: #ffffff;
}

.aisb-btn--outline {
	background: transparent;
	border-color: #2f5cff;
	color: #2f5cff;
}

.aisb-btn--outline:hover {
	background: rgba(47, 92, 255, 0.08);
}

/* =========================================================
   ریسپانسیو
   ========================================================= */
@media (max-width: 1024px) {
	/* در تبلت، دو ستون به‌جای کنار هم، زیر هم قرار می‌گیرند */
	.aisb-wrapper,
	.aisb-wrapper--image-end {
		flex-direction: column;
	}

	.aisb-media,
	.aisb-content {
		max-width: 100% !important;
		flex-basis: auto !important;
		order: initial !important;
		width: 100%;
	}

	/* پیش‌فرض: تصویر بالا، محتوا پایین */
	.aisb-media {
		order: 1 !important;
	}

	.aisb-content {
		order: 2 !important;
	}

	/* حالت جابه‌جا‌شده: محتوا بالا، تصویر پایین */
	.aisb-wrapper--mobile-content-first .aisb-media {
		order: 2 !important;
	}

	.aisb-wrapper--mobile-content-first .aisb-content {
		order: 1 !important;
	}
}

@media (max-width: 767px) {
	.aisb-title {
		font-size: 20px;
	}

	.aisb-desc {
		font-size: 14px;
	}
}

@media (max-width: 480px) {
	.aisb-buttons {
		flex-direction: column;
		align-items: stretch;
	}

	.aisb-btn {
		width: 100%;
	}
}