/*
  Theme: Final Professional Layout
  Features: Fully Responsive with Adaptive Typography & Forms
  Text Domain: ipapdaco
  Domain Path: /languages

*/
/* جلوگیری از اسکرول افقی در موبایل */
html, body {
    overflow-x: hidden;
    width: 100%;
    position: relative;
    margin: 0;
    padding: 0;
    font-family: 'Vazir-regular','Vazir-Bold','Vazir-Fd-regular', sans-serif;
    line-height: 1.7;
    background-color: var(--light-color);
    color: var(--dark-text-color);
    direction: rtl;
    transition: padding-top 0.4s ease;
}
.farsi-num{
    font-family: 'Vazir-Fd-regular';
}
/* ایمپورت فونت نستعلیق (برای شعر) */
/*@import url('');*/
/* 1. رفع مشکل Overflow در کانتینرهای اصلی */
/* نگران نباشید، این کد اسکرول افقی را خراب نمی‌کند */
body, main, .page-content, .page-main-section, .container-single {
    overflow: visible !important;
}

#projects .section-title {
    color: #333;
    /* Darker title for better contrast on light background */
}

#services .view-all-arrow {
    background-color: var(--dark-text-color);
    color: var(--cta-color);
}

#services .view-all-arrow .tooltip {
    background-color: #000;
    color: var(--light-color);
}

#services .view-all-arrow:hover {
    background-color: #000;
}

.archive-item-card {
    background-color: var(--light-color);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.07);
    transition: all 0.4s ease;
    display: flex;
    flex-direction: column;
}

.archive-item-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
}

.item-category a {
    color: var(--light-color);
    text-decoration: none;
}

.archive-item-card:hover .item-image-link img {
    transform: scale(1.05);
}

.article-body .lead {
    font-size: 1.2rem;
    font-weight: 400;
    color: #333;
    line-height: 1.8;
    margin-bottom: 25px;
}

.article-card {
    background-color: #eef4f8;
    /* Light blue background */
    border: 1px solid #dce4f0;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: flex;
    flex-direction: column;
    height: 100%;
    color: var(--primary-color);
    text-decoration: none;
}

.article-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}

.article-card:hover .article-image {
    transform: scale(1.05);
}

.article-category {
    background-color: var(--cta-color);
    color: var(--dark-text-color);
    padding: 4px 12px;
    border-radius: 15px;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
}

.article-content {
    padding: 25px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.article-excerpt {
    font-size: 0.95rem;
    color: #555;
    line-height: 1.6;
    flex-grow: 1;
    margin-bottom: 20px;
}

.article-header .container {
    position: relative;
    z-index: 2;
}

.article-header h1 {
    font-size: 3.2rem;
    margin-bottom: 20px;
    text-shadow: 0 3px 15px rgba(0, 0, 0, 0.4);
    background: linear-gradient(180deg, rgba(10, 18, 40, 0.65) 0%, rgba(10, 18, 40, 0.45) 35%, rgba(10, 18, 40, 0.25) 70%, rgba(10, 18, 40, 0.10) 100%);
    border-radius: 12px;
}

.article-header-category {
    display: inline-block;
    background-color: rgba(255, 255, 255, 0.9);
    color: var(--dark-text-color);
    padding: 6px 18px;
    border-radius: 20px;
    font-size: 0.9rem;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    text-decoration: none;
    margin-bottom: 20px;
    transition: transform 0.3s, background-color 0.3s;
}

.article-header-category:hover {
    transform: scale(1.05);
    background-color: var(--light-color);
}

.article-header-content {
    max-width: 800px;
    margin: 0 auto;
}

.article-header-meta {
    display: flex;
    justify-content: center;
    gap: 15px;
    font-size: 0.9rem;
    color: #eee;
    background-color: rgba(0, 0, 0, 0.2);
    padding: 8px 15px;
    border-radius: 20px;
}

.article-image img {
    width: 100%;
    height: 100%; /* <-- کلیدی: ارتفاع خودکار بر اساس عرض */
    object-fit: unset; /* <-- حالت برش را غیرفعال می‌کند */
    transition: transform 0.4s ease;
}

.article-image-link {
    display: block;
    overflow: hidden;
    position: relative;
    aspect-ratio: 16 / 10; /* یک نسبت ابعاد استاندارد، دقیقاً مثل صفحه ایندکس */
    background-color: #f5f5f5; /* یک رنگ پس‌زمینه برای تصاویر شفاف */
}

.article-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
    font-size: 0.85rem;
    color: #6c757d;
}

.article-title {
    font-size: 1.3rem;
    margin-bottom: 10px;
}

.article-title a {
    color: var(--dark-text-color);
    text-decoration: none;
    transition: color 0.3s;
}

.article-title a:hover {
    color: var(--primary-color);
}

.asp_w_container_1 {
    max-width: 400px !important;
}

.author-avatar {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    object-fit: cover;
}

.author-info a {
    font-size: 0.9rem;
    color: var(--primary-color);
    text-decoration: none;
    font-weight: 500;
}

.author-info a:hover {
    text-decoration: underline;
}

.author-info h4 {
    font-size: 1.4rem;
    margin-bottom: 10px;
    color: var(--dark-text-color);
}

.author-info p {
    font-size: 0.95rem;
    color: #555;
    margin-bottom: 15px;
}

.btn-course {
    background-color: var(--cta-color);
    color: var(--dark-text-color);
    text-align: center;
    padding: 10px 0;
    border-radius: 5px;
    text-decoration: none;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    transition: background-color 0.3s;
    margin-top: auto;
    /* Push button to the bottom */
}

.btn-course:hover {
    background-color: #ffcd39;
}

.btn-footer-contact {
    display: inline-block;
    background-color: transparent;
    color: var(--light-color);
    padding: 8px 15px;
    border-radius: 5px;
    margin-top: 10px;
    border: 1px solid var(--cta-color);
}

.btn-footer-contact:hover {
    background-color: var(--cta-color);
    color: var(--dark-text-color);
}

.btn-login {
    background-color: var(--primary-color);
    color: var(--light-color);
    padding: 8px 18px;
    border-radius: 5px;
    font-size: 0.9rem;
    text-decoration: none;
    transition: background-color 0.3s;
}

.btn-login:hover {
    background-color: #0056b3;
}

.btn-primary {
    background-color: var(--cta-color);
    border: 2px solid var(--cta-color);
    color: var(--dark-text-color);
}

.btn-primary:hover {
    background-color: #ffcd39;
    border-color: #ffcd39;
    transform: translateY(-2px);
}

.btn-project {
    padding: 10px 25px;
    font-size: 0.9rem;
    border-radius: 8px;
    background-color: transparent;
    border: 1px solid var(--primary-color); /* دکمه توخالی شیک‌تر است */
    color: var(--primary-color);
    font-weight: 500;
    transition: all 0.3s;
}

.btn-project:hover {
    background-color: var(--primary-color);
    color: #fff;
}

.btn-secondary {
    background-color: transparent;
    border: 2px solid var(--light-color);
    color: var(--light-color);
}

.btn-secondary:hover {
    background-color: var(--light-color);
    color: var(--primary-color);
}

.btn-sm {
    padding: 8px 20px;
    font-size: 0.9rem;
    align-self: flex-start;
}

.btn-submit {
    padding: 12px 35px;
    border: none;
    border-radius: 8px;
    font-size: 1.1rem;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    color: var(--light-color);
    background: linear-gradient(90deg, var(--primary-color) 0%, #3a6ea5 100%);
    cursor: pointer;
    transition: transform 0.3s, box-shadow 0.3s;
}

.btn-submit:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(13, 43, 78, 0.25);
}

.card {
    background: var(--light-color);
    border-radius: 12px;
    padding: 40px 30px;
    text-align: center;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    position: relative;
    overflow: hidden;
    border: 1px solid #e9ecef;
    transition: all 0.4s ease;
}

.card-link {
    text-decoration: none;
    color: inherit;
    display: flex;
    width: 100%;
    border-radius: 12px;
    transition: all 0.4s ease;
}

.card-link:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 35px rgba(13, 43, 78, 0.12);
}

.card-link:hover .card-icon {
    background-color: var(--cta-color);
    color: var(--dark-text-color);
    transform: rotate(10deg);
}

.card-link:hover .card::before {
    transform: scaleX(1);
    transform-origin: left;
}

.card-text {
    font-size: 0.95rem;
    line-height: 1.7;
    color: #6c757d;
}

.card-title {
    font-size: 1.4rem;
    margin-bottom: 15px;
    color: var(--dark-text-color);
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
}

.company-intro .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}

.contact-form-body {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.contact-form-footer {
    text-align: left;
    margin-top: 30px;
}

.contact-form-header {
    text-align: right;
    margin-bottom: 30px;
}

.contact-form-header h3 {
    font-size: 2.2rem;
    color: var(--primary-color);
}

.contact-form-revamped {
    max-width: 800px;
    margin: 0 auto;
    background: var(--light-color);
    padding: 40px;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
    text-align: right;
}

.contact-form-revamped input:focus,
.contact-form-revamped textarea:focus {
    outline: none;
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(13, 43, 78, 0.1);
}

.contact-partners-grid {
    display: flex;
    justify-content: center;
    align-items: center;
}
/* تنظیمات کانتینر تصویر */
.single-featured-image.floating-image {
    float: left;          /* تصویر سمت چپ */
    width: 40%;           /* عرض نسبی (کمترش کردیم تا جاگیر نباشد) */
    max-width: 624px;     /* عرض نهایی (برای اینکه در مانیتورهای بزرگ خیلی گنده نشود) */
    margin-right: 30px;   /* فاصله متن از عکس */
    margin-bottom: 20px;  /* فاصله پایین */
    margin-top: 8px;      /* تراز با خط اول متن */

    /* استایل قاب عکس */
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08); /* کمی سایه برای زیبایی */
}

.single-featured-image.floating-image img {
    width: 100%;        /* عکس باید ۱۰۰٪ کادرش را پر کند */
    height: auto;       /* ارتفاع خودکار برای جلوگیری از دفرمه شدن */
    display: block;
    object-fit: cover;  /* اطمینان از پر شدن کادر */
}

.container {
    max-width: 1500px;
    margin: 0 auto;
    padding: 0 20px;
}
/*.containerSlider{*/
/* max-width: 1500px;*/
/* margin: 0 auto;*/
/* padding: 0 20px;*/
/*}*/
.container-single {
    max-width: 1714px;
    margin: 0 auto;
    padding: 0 20px;
}

.container-page{
    max-width: 1600px;
    margin: 0 auto;
    padding: 0 20px;
    margin: 60px auto;
}
.course-card {
    background: var(--light-color);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    height: 100%;
    /* Ensure cards in a row have same height */
}
.course-card img{
    width: 200px;
    height: auto;
}
.course-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
}

.course-content {
    padding: 25px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}


/*
=================================================
===      COMPACT COURSE CARD STYLES           ===
=================================================
*/

/* 1. تنظیم فضای اسلایدر برای دیده شدن دکمه‌ها */
.courses-slider {
    padding: 20px 50px 60px 50px !important; /* چپ و راست فضا میدهیم برای دکمه ها */
}

/* 2. تنظیم خود کارت */
.course-card {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    height: 100%; /* هم‌قد شدن */
    display: flex;
    flex-direction: column;
}
.course-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.08);
}

/* 3. تنظیم عکس (سایز فیکس) */
.course-card img,
.main-thumbnail,
.hover-thumbnail {
    width: 100%;
    height: 180px !important; /* ارتفاع ثابت و کمتر */
    object-fit: cover;
}

/* 4. محتوا (جمع و جور کردن) */
.course-content {
    padding: 15px !important; /* پدینگ کمتر */
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

/* 5. عنوان دوره */
.course-title {
    font-size: 1.1rem !important;
    margin: 10px 0 !important;
    line-height: 1.4;
    height: 45px; /* ارتفاع ثابت برای دو خط متن */
    overflow: hidden;
}

/* 6. محدود کردن توضیحات (مهمترین بخش برای کاهش ارتفاع) */
.course-description {
    font-size: 0.9rem;
    color: #666;
    margin-bottom: 15px;

    /* محدود کردن به 2 خط */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 42px; /* ارتفاع ثابت برای توضیحات */
}
.course-description p {
    margin: 0; /* حذف مارجین‌های اضافه وردپرس */
    padding: 0;
}

/* 7. تگ سطح دوره (بالای عنوان) */
.course-level {
    font-size: 0.75rem;
    background: #f0f2f5;
    color: #555;
    padding: 3px 10px;
    border-radius: 20px;
    align-self: flex-start;
    margin-bottom: 5px;
}

/* 8. دکمه مشاهده */
.btn-course {
    margin-top: auto; /* چسباندن به پایین */
    padding: 8px 0 !important;
    font-size: 0.9rem !important;
    border-radius: 8px;
    background-color: var(--cta-color);
    color: var(--dark-text-color);
    text-align: center;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    width: 100%;
}

/* 9. اصلاح دکمه‌های اسلایدر (که کار نمیکردند) */
.courses-slider .swiper-button-next,
.courses-slider .swiper-button-prev {
    color: var(--primary-color);
    width: 40px;
    height: 40px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    z-index: 10; /* آوردن روی لایه ها */
}
.courses-slider .swiper-button-next::after,
.courses-slider .swiper-button-prev::after {
    font-size: 1.2rem;
    font-weight: bold;
}

/* --- اصلاح موبایل --- */
@media (max-width: 768px) {
    .courses-slider {
        padding: 0 20px 50px 20px !important; /* فضای کمتر در موبایل */
    }
    /* مخفی کردن دکمه‌های ناوبری در موبایل (چون تاچ هست) */
    .courses-slider .swiper-button-next,
    .courses-slider .swiper-button-prev {
        display: none;
    }
}

.course-description {
    font-size: 0.95rem;
    color: #6c757d;
    line-height: 1.6;
    margin-bottom: 20px;
    flex-grow: 1;
    height: 45px !important;
}

.course-image {
    width: 100%;
    height: 200px;
    object-fit: cover;
}

.course-level {
    display: inline-block;
    background-color: var(--primary-color);
    color: var(--light-color);
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    margin-bottom: 15px;
    align-self: flex-start;
}

.course-level.advanced {
    background-color: #c82333;
}

.course-level.new {
    background-color: #28a745;
}

.course-title {
    font-size: 1.4rem;
    color: var(--dark-text-color);
    margin-bottom: 10px;
}

.course-title a {
    text-decoration: none;
}

.courses-slider {
    width: 100%;
    padding: 10px 10px 50px 10px;
}

.filter-group {
    display: flex;
    align-items: center;
    gap: 10px;
}

.filter-group a {
    text-decoration: none;
    padding: 6px 15px;
    border-radius: 20px;
    color: #555;
    background-color: #eee;
    font-size: 0.9rem;
    transition: all 0.3s;
}

.filter-group a.active {
    background-color: var(--cta-color);
    color: var(--dark-text-color);
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
}

.filter-group a:hover {
    background-color: var(--primary-color);
    color: var(--light-color);
}

.filter-group span {
    font-weight: 500;
    color: var(--dark-text-color);
}



.news {
    padding: 80px 0;
    background-color: #f5f7fa;
}

.news-rotator-container {
    position: relative;
    padding: 0 40px;
}

.news-layout-grid-v2 {
    display: grid;
    grid-template-columns: 1fr 1.8fr 1fr;
    gap: 30px;
    align-items: center;
    align-content: stretch;
    justify-content: center;
}

/* --- Columns --- */
.featured-article-column,
.regular-articles-column {
    transition: opacity 0.4s ease-in-out, transform 0.4s ease-in-out;
}

.regular-articles-column {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* --- Card Styles (re-using from before) --- */
.article-card-large {
    background-color: var(--light-color);
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.08);
    overflow: hidden;
}
.article-card-large .article-image-link-large img {
    width: 100%;
    height: auto;
    object-fit: cover;
}
.article-card-large .article-content {
    padding: 25px;
}
/* ... other large card styles ... */

.article-card-small {
    display: flex;
    align-items: center;
    gap: 15px;
    background-color: var(--light-color);
    padding: 15px;
    border-radius: 8px;
    box-shadow: 0 3px 15px rgba(0,0,0,0.05);
}
.article-card-small .article-image-link-small img {
    width: 80px;
    height: 65px;
    object-fit: cover;
    border-radius: 5px;
    flex-shrink: 0;
}
/* ... other small card styles ... */


/* --- Animation Class --- */
.is-fading-out {
    opacity: 0;
    transform: scale(0.98);
}

/* --- Navigation Buttons --- */
.news-rotator-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.9);
    border: 1px solid #e0e0e0;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    color: var(--primary-color);
    cursor: pointer;
    font-size: 1rem;
    z-index: 10;
    transition: all 0.3s;
}
.news-rotator-nav:hover {
    background-color: var(--primary-color);
    color: var(--light-color);
}
.news-rotator-nav.prev { right: 0; }
.news-rotator-nav.next { left: 0; }


/* --- Middle (Featured) Column --- */
.featured-article-column .article-card-large {
    background-color: var(--light-color);
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.08);
    overflow: hidden;
    transition: all 0.3s ease;
}
.featured-article-column .article-card-large:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.1);
}
.featured-article-column .article-image-link-large img {
    width: 100%;
    height: auto;
    object-fit: cover;
}
.featured-article-column .article-content {
    padding: 25px;
}
.featured-article-column .article-title-large a {
    font-size: 1.6rem;
    color: var(--dark-text-color);
    text-decoration: none;
    line-height: 1.4;
}
.featured-article-column .article-excerpt {
    font-size: 0.95rem;
    color: #555;
}
.featured-article-column .btn-read-more {
    color: var(--primary-color);
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    text-decoration: none;
}
.featured-article-column .btn-read-more i {
    transition: margin-right 0.3s;
}
.featured-article-column .btn-read-more:hover i {
    margin-right: 5px;
}

/* --- Left & Right Columns --- */
.regular-articles-column {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.regular-articles-column .article-card-small {
    display: flex;
    align-items: center;
    gap: 15px;
    background-color: var(--light-color);
    padding: 15px;
    border-radius: 8px;
    box-shadow: 0 3px 15px rgba(0,0,0,0.05);
    transition: all 0.3s ease;
}
.regular-articles-column .article-card-small:hover {
    transform: translateX(-5px); /* Moves left on hover */
    box-shadow: 0 8px 20px rgba(0,0,0,0.08);
}
.regular-articles-column .article-image-link-small img {
    width: 120px;
    height: 100px;
    object-fit: cover;
    border-radius: 5px;
    flex-shrink: 0;
}
.regular-articles-column .article-title-small a {
    font-size: 1.25rem;
    font-weight: 500;
    color: var(--dark-text-color);
    text-decoration: none;
    line-height: 1.5;
}
.regular-articles-column .article-title-small a:hover {
    color: var(--primary-color);
}
.regular-articles-column .article-date-small {
    font-size: 0.8rem;
    color: #888;
    margin-top: 5px;
    display: block;
}

/* --- Responsive for News Section --- */
@media (max-width: 992px) {
    .news-layout-grid-v2 {
        grid-template-columns: 1fr; /* Stack all columns */
    }
    .featured-article-column {
        order: -1; /* Make the featured article appear first on mobile */
        margin-bottom: 30px;
    }
}


/* --- Other Styles from your file... --- */
/* (All other styles from your original style.css file would go here) */

/*
=================================================
===      PROMOTIONAL CTA SECTION STYLES       ===
=================================================
*/

/*.promo-cta-section {*/
/* padding: 80px 0;*/
/* background-color: var(--secondary-color); !* Light gray background *!*/
/*}*/

/*.promo-cta-grid {*/
/* display: grid;*/
/* grid-template-columns: repeat(2, 1fr);*/
/* align-items: center;*/
/* gap: 50px;*/
/* background-color: var(--primary-color); !* Navy blue background *!*/
/* border-radius: 15px;*/
/* overflow: hidden;*/
/* box-shadow: 0 15px 40px rgba(13, 43, 78, 0.2);*/
/*!* display: flex*!*/
/*!*;*!*/
/*!* justify-content: center;*!*/
/*!* !* align-items: center; *!*!*/
/*!* background-color: var(--primary-color);*!*/
/*!* border-radius: 15px;*!*/
/*!* gap: 50px;*!*/
/*}*/

/*!* --- Image Column --- *!*/
/*.promo-image-col {*/
/* padding: 0;*/
/* margin: 0;*/
/* line-height: 0; !* Removes any extra space below the image *!*/
/*}*/

/*.promo-image-col img {*/
/* width: 100%;*/
/* height: 100%;*/
/* object-fit: cover;*/
/*}*/

/*!* --- Content Column --- *!*/
/*.promo-content-col {*/
/* padding: 40px;*/
/* color: var(--light-color); !* White text *!*/
/*}*/

/*.promo-eyebrow {*/
/* display: inline-block;*/
/* background-color: rgba(255, 193, 7, 0.1);*/
/* color: var(--cta-color); !* Yellow text *!*/
/* padding: 6px 15px;*/
/* border-radius: 20px;*/
/* font-weight: 700;*/
/* font-size: 0.9rem;*/
/* margin-bottom: 20px;*/
/*}*/

/*.promo-title {*/
/* font-size: 2.2rem;*/
/* font-weight: 700;*/
/* margin-bottom: 15px;*/
/* line-height: 1.4;*/
/*}*/

/*.promo-description {*/
/* font-size: 1.05rem;*/
/* line-height: 1.8;*/
/* opacity: 0.9;*/
/* margin-bottom: 30px;*/
/*}*/

/*.promo-content-col .btn-primary {*/
/* background-color: var(--cta-color);*/
/* color: var(--dark-text-color);*/
/* padding: 12px 30px;*/
/* font-weight: 700;*/
/*}*/

/*!* --- Responsive for CTA Section --- *!*/
/*@media (max-width: 992px) {*/
/* .promo-cta-grid {*/
/* grid-template-columns: 1fr; !* Stack columns on smaller screens *!*/
/* text-align: center;*/
/* }*/

/* .promo-image-col {*/
/* order: -1; !* Make image appear on top on mobile *!*/
/* }*/

/* .promo-content-col {*/
/* padding: 40px 25px;*/
/* }*/
/*}*/

/* ==== تنظیم کلی سکشن ==== */
/*.promo-cta-section {*/
/* display: flex;*/
/* justify-content: center; !* برای وسط‌چین شدن کل اسلایدر *!*/
/* padding-block: 40px;*/
/* background-color: #fff;*/
/*}*/

/*!* ==== تنظیم خود اسلایدر ==== *!*/
/*.promo-slider {*/
/* width: 100%;*/
/* max-width: 1000px; !* محدود به عرض مورد نظر *!*/
/*}*/

/*!* ==== تنظیم هر اسلاید ==== *!*/
/*.promo-slider .swiper-slide {*/
/* width: 1000px !important;*/
/* height: 475.2px !important;*/
/* display: flex;*/
/* align-items: center;*/
/* justify-content: center;*/
/*}*/

/*!* ==== گرید داخل هر کارت ==== *!*/
/*.promo-cta-grid {*/
/* display: grid;*/
/* grid-template-columns: 45% 55%;*/
/* width: 100%;*/
/* height: 100%;*/
/* border-radius: 20px;*/
/* overflow: hidden;*/
/* background: var(--primary-color);*/
/* box-shadow: 0 4px 20px rgba(0,0,0,0.1);*/
/*}*/

/*!* ==== ستون تصویر ==== *!*/
/*.promo-image-col {*/
/* width: 100%;*/
/* height: 100%;*/
/* overflow: hidden;*/
/*}*/
/*.promo-image-col img {*/
/* width: 100%;*/
/* height: 100%;*/
/* object-fit: cover;*/
/* display: block;*/
/*}*/

/*!* ==== ستون محتوا ==== *!*/
/*.promo-content-col {*/
/* padding: 30px 40px;*/
/* display: flex;*/
/* flex-direction: column;*/
/* justify-content: center;*/
/* height: 100%;*/
/*}*/

/*.promo-eyebrow {*/
/* font-size: 0.9rem;*/
/* color: var(--light-color);*/
/* margin-bottom: 6px;*/
/*}*/

/*.promo-title {*/
/* font-size: 1.5rem;*/
/* line-height: 1.4;*/
/* margin-bottom: 12px;*/
/* color: var(--light-color)*/
/*}*/

/*.promo-description {*/
/* font-size: 1rem;*/
/* line-height: 1.8;*/
/* color: var(--light-color);*/
/* margin-bottom: 20px;*/
/*}*/

/*.promo-content-col .btn {*/
/* align-self: start;*/
/* padding: 10px 18px;*/
/* font-size: 0.95rem;*/
/* border-radius: 8px;*/
/*}*/

/*!* ==== کنترل Swiper ==== *!*/
/*.promo-cta-section .swiper-button-next,*/
/*.promo-cta-section .swiper-button-prev {*/
/* color: #222;*/
/*}*/

/*!* ==== واکنش‌گرا (موبایل و تبلت) ==== *!*/
/*@media (max-width: 1024px) {*/
/* .promo-slider .swiper-slide {*/
/* width: 90vw !important;*/
/* height: auto !important;*/
/* }*/

/* .promo-cta-grid {*/
/* grid-template-columns: 1fr;*/
/* height: auto;*/
/* }*/

/* .promo-image-col {*/
/* height: 230px;*/
/* }*/

/* .promo-content-col {*/
/* padding: 20px;*/
/* }*/

/* .promo-title {*/
/* font-size: 1.2rem;*/
/* }*/

/* .promo-description {*/
/* font-size: 0.95rem;*/
/* line-height: 1.6;*/
/* }*/
/*}*/

/*@media (max-width: 600px) {*/
/* .promo-image-col {*/
/* height: 200px;*/
/* }*/

/* .promo-content-col {*/
/* padding: 16px;*/
/* }*/

/* .promo-title {*/
/* font-size: 1rem;*/
/* }*/

/* .promo-description {*/
/* font-size: 0.9rem;*/
/* }*/

/* .promo-content-col .btn {*/
/* font-size: 0.85rem;*/
/* padding: 8px 14px;*/
/* }*/
/*}*/



/*!**/
/*=================================================*/
/*===      3D FLIP PROMO SLIDER STYLES          ===*/
/*=================================================*/
/**!*/

/*.promo-cta-section {*/
/* padding: 80px 0;*/
/* background-color: var(--secondary-color);*/
/*}*/

/*!* --- Swiper Container --- *!*/
/*.promo-slider {*/
/* width: 100%;*/
/* max-width: 1100px; !* Adjust as needed *!*/
/* margin: 0 auto;*/
/* padding: 0 50px; !* Space for navigation buttons *!*/
/* position: relative;*/
/*}*/

/*.promo-slider .swiper-slide {*/
/* background-color: transparent;*/
/* !* Important for flip effect *!*/
/*}*/

/*.promo-cta-grid {*/
/* width: 100%; !* Ensure grid takes full width of the slide *!*/
/*}*/

/*!* --- Navigation & Pagination --- *!*/
/*.promo-slider .swiper-button-next,*/
/*.promo-slider .swiper-button-prev {*/
/* color: var(--primary-color);*/
/* background-color: rgba(255, 255, 255, 0.8);*/
/* width: 44px;*/
/* height: 44px;*/
/* border-radius: 50%;*/
/* box-shadow: 0 2px 10px rgba(0,0,0,0.1);*/
/*}*/
/*.promo-slider .swiper-button-next::after,*/
/*.promo-slider .swiper-button-prev::after {*/
/* font-size: 1rem;*/
/* font-weight: 900;*/
/*}*/

/*.promo-slider .swiper-pagination .swiper-pagination-bullet-active {*/
/* background: var(--primary-color);*/
/*}*/

/* گرید داخل هر اسلاید که دوتا کارت را کنار هم می‌چیند */
.slide-grid-2{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

/* استایل کارت */
.promo-card{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    border-radius: 16px;
    padding: 16px;
    height: 100%;
    background-color: var(--primary-color);
}
.promo-image-col img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
}
.promo-content-col{
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.promo-eyebrow{color: var(--light-color)}
.promo-title{ margin: 0; font-size: 1.05rem; line-height: 1.5; color: var(--light-color)}
.promo-description{color: var(--light-color)}

@media (max-width: 1024px){
    .slide-grid-2{
        grid-template-columns: 1fr; /* روی تبلت/موبایل هر اسلاید به صورت یک ستون: کارت‌ها زیر هم */
    }
}

@media (max-width: 640px){
    .promo-card{
        grid-template-columns: 1fr; /* خود کارت هم ستون واحد شود */
    }
}


.footer-bottom {
    text-align: center;
    padding-top: 20px;
    border-top: 1px solid #444;
    font-size: 0.9rem;
}

.footer-bottom a {
    color: var(--light-color);
    font-weight: 500;
}

.footer-column {
    padding: 0 15px;
}

.footer-column a {
    color: #ccc;
    text-decoration: none;
    transition: color 0.3s;
}

.footer-column a:hover {
    color: var(--light-color);
}

.footer-column p {
    margin-bottom: 15px;
    font-size: 0.95rem;
    line-height: 1.8;
}

.footer-column p i {
    color: var(--cta-color);
    margin-left: 10px;
}

.footer-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    margin-bottom: 20px;
}

.footer-title {
    color: var(--light-color);
    font-size: 1.2rem;
    margin-bottom: 20px;
    position: relative;
    padding-bottom: 10px;
}

.footer-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 40px;
    height: 2px;
    background-color: var(--cta-color);
}

.form-group {
    display: flex;
    align-items: center;
    gap: 20px;
}

.form-group input,
.form-group-full textarea {
    flex-grow: 1;
    padding: 12px 15px;
    font-size: 1rem;
    font-family: 'Vazir-regular', sans-serif;
    border: 1px solid #ddd;
    border-radius: 8px;
    background-color: #f9f9f9;
    transition: all 0.3s;
}

.form-group label {
    flex-basis: 30%;
    font-weight: 500;
    color: var(--dark-text-color);
}

.form-group-full {
    display: flex;
    flex-direction: column;
}

.form-group-full label {
    margin-bottom: 8px;
    font-weight: 500;
}

.form-group-full textarea {
    resize: vertical;
    min-height: 120px;
}

.gform_wrapper .gform-field-label--type-sub {
    display: none !important;
}

.gform_wrapper .gform_button {
    padding: 12px 35px !important;
    border: none !important;
    border-radius: 8px !important;
    font-family: 'Vazir-Bold', sans-serif;
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    color: var(--light-color) !important;
    background: linear-gradient(90deg, var(--primary-color) 0%, #3a6ea5 100%) !important;
    cursor: pointer !important;
    transition: transform 0.3s, box-shadow 0.3s !important;
}

.gform_wrapper .gform_button:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 20px rgba(13, 43, 78, 0.25) !important;
}

.gform_wrapper .gform_description {
    font-size: 1.05rem !important;
    color: #6c757d !important;
    text-align: right !important;
    margin-bottom: 30px !important;
}

.gform_wrapper li.gfield_textarea .gfield_label {
    margin-bottom: 8px !important;
}

.gform_wrapper textarea {
    min-height: 120px !important;
    resize: vertical !important;
}
.gfield_visibility_visible{
    border: none;
}

.hamburger-icon {
    display: none;
}

.header-bottom {
    height: var(--header-bottom-height);
    background-color: var(--light-color);
    width: 100%;
    transition: all 0.4s ease;
}

.header-top {
    height: var(--header-top-height);
    background-color: var(--light-color);
    border-bottom: 1px solid #e9ecef;
    transition: transform 0.4s ease, opacity 0.4s ease;
}

.header-top .container,
.header-bottom .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100%;
}
.header-bottom{
    z-index: 99;
}

.header-top-actions {
    display: flex;
    align-items: center;
    gap: 20px;
}

.hero-title {
    color: var(--light-color);
}

/*
=================================================
===      MODERN CONTACT PAGE STYLES           ===
=================================================
*/

/* زمینه کل صفحه کمی طوسی می‌شود تا باکس سفید دیده شود */
.contact-page-wrapper {
    background-color: #f8f9fa;
    padding-bottom: 0;
}

/* --- 1. هدر صفحه --- */
.contact-hero {
    background-color: #fff;
    padding: 60px 0 40px;
    text-align: center;
    margin-bottom: 40px;
    border-bottom: 1px solid #eee;
}
.contact-hero .page-title {
    font-size: 2.5rem;
    color: var(--primary-color);
    font-weight: 800;
    margin-bottom: 10px;
}
.contact-hero .page-subtitle {
    color: #666;
    font-size: 1.1rem;
}

/* --- 2. گرید اصلی (کارت شناور) --- */
.contact-grid-layout {
    display: grid;
    grid-template-columns: 1fr 1.5fr; /* ستون اطلاعات کوچکتر، فرم بزرگتر */
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0,0,0,0.08); /* سایه نرم */
    margin-bottom: 80px;
}

/* --- 3. کارت اطلاعات (بخش سرمه‌ای) --- */
.contact-info-card {
    background: var(--primary-color); /* رنگ اصلی سایت */
    color: #fff;
    padding: 50px;
    position: relative;
    overflow: hidden;
}

.contact-info-card h3 {
    color: #fff;
    font-size: 1.8rem;
    margin-bottom: 10px;
    padding-bottom: 15px;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

.info-items {
    margin-top: 30px;
}

.info-item {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    margin-bottom: 25px;
}

.info-item .icon-box {
    width: 40px;
    height: 40px;
    background-color: rgba(255, 193, 7, 0.2); /* زمینه شفاف طلایی */
    color: var(--cta-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.info-item .text-box h4 {
    color: #fff; /* عنوان سفید */
    font-size: 1rem;
    margin-bottom: 5px;
    opacity: 0.9;
}
.info-item .text-box p,
.info-item .text-box a {
    color: rgba(255,255,255,0.8); /* متن کمی کمرنگ‌تر */
    font-size: 0.95rem;
    line-height: 1.6;
    text-decoration: none;
    margin: 0;
}
.info-item .text-box a:hover {
    color: var(--cta-color);
}

/* دایره‌های تزئینی */
.circle-decoration {
    position: absolute;
    border-radius: 50%;
    background: rgba(255,255,255,0.05);
    z-index: 0;
    pointer-events: none;
}
.circle-1 { width: 200px; height: 200px; bottom: -50px; right: -50px; }
.circle-2 { width: 100px; height: 100px; top: 50px; left: -20px; }

/* --- 4. کارت فرم (بخش سفید) --- */
.contact-form-card {
    padding: 50px;
    background-color: #fff;
}
.contact-form-card h3 {
    color: var(--primary-color);
    margin-bottom: 10px;
}
.contact-form-card p {
    color: #666;
    margin-bottom: 30px;
}

/* استایل‌دهی فیلدها */
.contact-form-card input,
.contact-form-card textarea {
    background-color: #f9f9f9 !important;
    border: 1px solid #eee !important;
    padding: 12px !important;
    border-radius: 8px !important;
}
.contact-form-card input:focus,
.contact-form-card textarea:focus {
    background-color: #fff !important;
    border-color: var(--cta-color) !important;
    box-shadow: 0 0 0 3px rgba(255, 193, 7, 0.1) !important;
}

/* --- 5. نقشه --- */
.full-width-map {
    filter: grayscale(100%);
    transition: filter 0.3s;
    line-height: 0;
}
.full-width-map:hover {
    filter: grayscale(0%);
}

/* --- ریسپانسیو --- */
@media (max-width: 992px) {
    .contact-grid-layout {
        grid-template-columns: 1fr; /* ستون‌ها زیر هم */
    }
    .contact-info-card,
    .contact-form-card {
        padding: 30px;
    }
}

.hero p {
    font-size: 1.2rem;
    max-width: 600px;
    margin: 0 auto 40px;
    opacity: 0.9;
}
.hero-buttons{
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.hero-buttons .btn {
    margin: 0 10px;
    padding: 12px 30px;
    font-size: 1rem;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    border-width: 2px;
}

.hero-content {
    position: absolute;
    z-index: 2;
    padding: 20px;
    background: linear-gradient(
            180deg,
            rgba(10, 18, 40, 0.65) 0%,
            rgba(10, 18, 40, 0.45) 35%,
            rgba(10, 18, 40, 0.25) 70%,
            rgba(10, 18, 40, 0.10) 100%
    );
    border-radius: 10px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--primary-color);
    opacity: 0.7;
}
/* --- CSS برای هیرو اسلایدر --- */

/* به کل بخش هیرو یک ارتفاع مشخص می‌دهیم (مثلاً به اندازه کل صفحه) */
.hero {
    position: relative; /* برای قرارگیری صحیح محتوای رویی */
    height: 90vh;      /* 100% ارتفاع صفحه نمایش */
    overflow: hidden;   /* جلوگیری از بیرون زدن احتمالی المان‌ها */
}

/* اسلایدر و نگهدارنده آن باید تمام فضای هیرو را پر کنند */
.hero-background-slider,
.hero-background-slider .swiper-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* مهم‌ترین بخش: به هر اسلاید ارتفاع کامل می‌دهیم و عکس را تنظیم می‌کنیم */
.hero-background-slider .swiper-slide {
    width: 100%;
    height: 100%;
    background-size: cover;      /* عکس تمام فضا را بپوشاند */
    background-position: center; /* عکس در مرکز قرار گیرد */
    background-repeat: no-repeat;
}

.adsverv-index {
    padding: 80px 0;
    background-color: #f5f7fa;
}

.container-ads {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Title for each column */
.card-column-title {
    font-size: 1.5rem;
    color: var(--primary-color);
    margin-bottom: 20px;
    text-align: center;
}

/* --- The Card Itself --- */
.card-ads {
    display: flex;
    flex-direction: column;
    height: 100%; /* CRITICAL: This makes the card fill the grid cell height */
    border: 1px solid #eef0f3;
    border-radius: 16px;
    background: var(--light-color);
    box-shadow: 0 6px 18px rgba(10, 22, 70, .06);
    overflow: hidden;
    transition: transform .2s ease, box-shadow .2s ease;
}

.card-ads:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 24px rgba(10, 22, 70, .10);
}

/* --- Card Image Container --- */
.thumb-ads {
    position: relative;
    aspect-ratio: 16 / 9; /* Widescreen aspect ratio */
    overflow: hidden;
    background: #f6f8fb;
}

.thumb-ads img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* This crops the image to fit, preventing distortion */
    display: block;
}

/* --- Card Title --- */
.card-title-ads {
    font-size: 1.2rem;
    line-height: 1.4;
    height: 50px; /* Fixed height for 2 lines of text */
    margin: 14px 16px 0;
    overflow: hidden;
}

.card-title-ads a {
    color: var(--dark-text-color);
    text-decoration: none;
}

/* --- Card Description --- */
.description-ads {
    margin: 8px 16px 0;
    color: #566;
    flex-grow: 1; /* This makes the description take up all available space */
    line-height: 1.6;
    height: 75px; /* Fixed height for about 3 lines of text */
    overflow: hidden;
}

/* --- Card Button --- */
.card-ads .btn.btn-course {
    margin: 16px;
    margin-top: auto; /* This pushes the button to the bottom */
    display: block;
    padding: 10px 16px;
    border-radius: 10px;
    background: var(--cta-color);
    color: var(--dark-text-color);
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    text-align: center;
    text-decoration: none;
}

/* --- Slider container within the grid cell --- */
.card-slider .swiper-slide {
    height: auto; /* Allow swiper slide to adapt to grid cell height */
}

/* --- Responsive adjustments for the grid --- */
@media (max-width: 992px) {
    .container-ads {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .container-ads {
        grid-template-columns: 1fr;
    }
}


/* --- Other Styles from your file... --- */
/* (All other styles from your original style.css file would go here) */


.intro-text {
    flex-basis: 50%;
}

.intro-text h2 {
    font-size: 2rem;
    color: var(--primary-color);
    margin-bottom: 15px;
}

.intro-text p {
    font-size: 1.05rem;
    line-height: 1.8;
    color: #555;
}

.item-category {
    display: inline-block;
    align-self: flex-start;
    background-color: var(--primary-color);
    color: var(--light-color);
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 500;
    margin-bottom: 15px;
}

.item-content {
    padding: 25px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.item-excerpt {
    font-size: 0.95rem;
    line-height: 1.7;
    color: #6c757d;
    flex-grow: 1;
    margin-bottom: 20px;
    max-height: 0px;
}

.item-image-link {
    display: block;
    overflow: hidden;
    background-color: #f5f5f5; /* یک پس‌زمینه تمیز برای فضاهای خالی احتمالی */
}

.item-image-link img {
    width: 100%;
    height: auto; /* ارتفاع ثابت را نگه می‌داریم تا کارت‌ها یکدست بمانند */
    object-fit: contain; /* <-- این دستور کل تصویر را بدون برش نمایش می‌دهد */
    display: block;
    transition: transform 0.4s ease;
}

.item-image-link-project img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}

.item-title {
    font-size: 1.4rem;
    margin-bottom: 10px;
}

.item-title a {
    text-decoration: none;
    color: var(--dark-text-color);
    transition: color 0.3s;
}

.item-title a:hover {
    color: var(--primary-color);
}

.lang-switcher {
    display: flex;
    align-items: center;
    font-weight: 500;
}

.lang-switcher a {
    text-decoration: none;
    color: #888;
    padding: 0 5px;
    transition: color 0.3s;
}

.lang-switcher a.active {
    color: var(--primary-color);
}

.lang-switcher span {
    color: #ccc;
}

.license-logos {
    display: flex;
    gap: 15px;
    align-items: center;
}

.license-logos img {
    height: 80px;
    opacity: 0.8;
    transition: opacity 0.3s;
}

.license-logos img:hover {
    opacity: 1;
}

.license-slider {
    width: 100%;
    padding: 60px 0 70px;
    overflow: visible;
}

.license-slider .swiper-wrapper {
    align-items: center;
}

.license-slider .swiper-button-next,
.license-slider .swiper-button-prev {
    color: var(--primary-color);
}

.license-slider .swiper-slide {
    height: auto !important;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0.55;
    transition: opacity 0.35s ease;
    pointer-events: none;
}

.license-slider .swiper-slide a {
    display: block;
    width: 100%;
    max-width: 280px;
    padding: 16px;
    border-radius: 24px;
    background: linear-gradient(180deg, #ffffff 0%, #f4f7fb 100%);
    border: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.16);
    transform-style: preserve-3d;
    transition: transform 0.45s ease, box-shadow 0.45s ease, opacity 0.45s ease, filter 0.45s ease;
}

.license-slider .swiper-slide img {
    width: 100%;
    height: 300px !important; /* ارتفاع ثابت و مناسب موبایل */
    object-fit: contain !important; /* کل عکس (مجوز) دیده شود و برش نخورد */
    background-color: #fff; /* پس‌زمینه سفید برای کادر */
    border-radius: 14px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08); /* سایه نرم */
    border: 1px solid #eee;
    backface-visibility: hidden;
}

.license-slider .swiper-slide-active,
.license-slider .swiper-slide-duplicate-active {
    opacity: 1;
    pointer-events: auto;
}

.license-slider .swiper-slide-active a,
.license-slider .swiper-slide-duplicate-active a {
    transform: translateZ(36px) scale(1.04);
    box-shadow: 0 28px 60px rgba(15, 23, 42, 0.22);
}

.license-slider .swiper-slide-prev,
.license-slider .swiper-slide-next,
.license-slider .swiper-slide-duplicate-prev,
.license-slider .swiper-slide-duplicate-next {
    opacity: 0.82;
    pointer-events: auto;
}

.license-slider .swiper-slide-prev a,
.license-slider .swiper-slide-duplicate-prev a {
    transform: perspective(1200px) rotateY(18deg) translateX(10px) scale(0.92);
}

.license-slider .swiper-slide-next a,
.license-slider .swiper-slide-duplicate-next a {
    transform: perspective(1200px) rotateY(-18deg) translateX(-10px) scale(0.92);
}

.license-slider .swiper-slide:not(.swiper-slide-active):not(.swiper-slide-prev):not(.swiper-slide-next):not(.swiper-slide-duplicate-active):not(.swiper-slide-duplicate-prev):not(.swiper-slide-duplicate-next) a {
    transform: perspective(1200px) scale(0.84);
    filter: saturate(0.9);
    opacity: 0.72;
}

.logo {
    width: 127px;
    height: 130px;
}

.logo img {
    width: auto;
    height: 96px;
}



.main-nav a {
    color: var(--dark-text-color);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.3s;
    padding: 10px 0;
    position: relative;
}

.main-nav a::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: 0;
    right: 0;
    background-color: var(--primary-color);
    transition: width 0.3s ease;
}

.main-nav a:hover {
    color: var(--primary-color);
}

.main-nav a:hover::after {
    width: 100%;
}

.main-nav ul {
    list-style: none;
    display: flex;
    justify-content: center;
    padding: 0;
    margin: 0;
}

.main-nav ul li {
    margin: 0 20px;
}

.main-nav ul.menu > li.menu-item > a {
    color: var(--dark-text-color);
    text-decoration: none;
    font-weight: 500;
    padding: 20px 10px;
    display: block;
    position: relative;
    transition: color 0.3s;
}

.main-nav ul.menu > li.menu-item > a:hover {
    color: var(--primary-color);
}

.main-nav ul.menu > li.menu-item > a:hover::after,
.main-nav ul.menu > li.current-menu-item > a::after {
    width: 100%;
}
.main-nav li.menu-item-has-children {
    position: relative;
}


/*
=================================================
===      PRECISE SEPARATOR FOR LANGUAGE MENU    ===
=================================================
*/

/* This targets every list item with the class 'lang-item'
   EXCEPT for the very last one in the list. */
#menu-main-menu>li.lang-item:not(:last-child)::after {
    content: '|';
    /* The character to display */
    color: #ccc;
    /* A subtle color for the separator */
    margin: 0 8px;
    /* Spacing around the separator */
    pointer-events: none;
    /* Makes the separator unclickable */
    align-self: center;
    /* Vertically aligns the separator with the text */
}

/* This ensures the language items and the separator are aligned properly */
#menu-main-menu>li.lang-item {
    display: inline-flex;
    align-items: center;
}
.mobile-search-form {
    display: none;
}

.news-slider {
    width: 100%;
    padding: 10px 10px 50px 10px;
}
/* اصلاح بیرون‌زدگی اسلایدر اخبار در موبایل */
@media (max-width: 768px) {
    .news-slider {
        margin: 0 !important;      /* حذف حاشیه منفی */
        padding: 0 10px !important; /* کاهش فاصله داخلی */
        width: 100% !important;
    }

    /* دکمه‌های ناوبری اسلایدر اخبار در موبایل ممکن است مزاحم باشند */
    /* می‌توانیم آن‌ها را کوچک کنیم یا مخفی کنیم */
    .news-slider .swiper-button-next,
    .news-slider .swiper-button-prev {
        width: 30px;
        height: 30px;
        background-size: 15px;
    }
}

.partner-logo {
    flex-basis: 160px;
    /* Base width for each logo container */
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.partner-logo a:hover img {
    filter: grayscale(0%);
    /* Colorize on hover */
    opacity: 1;
    transform: scale(1.1);
    /* Slightly enlarge on hover */
}

.partner-logo img {
    max-width: 150px;
    height: auto;
    filter: grayscale(100%);
    /* Make logo grayscale by default */
    opacity: 0.6;
    transition: all 0.4s ease;
}

.partners-logo-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 40px;
}

.partners-logo-grid-compact {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.partners-logo-grid-compact .partner-logo {
    flex-basis: calc(33.33% - 20px); /* Three logos per row */
    text-align: center;
}

.partner-logo a{
    text-decoration: none;
}

.partners-logo-grid-compact .partner-logo a:hover img {
    filter: grayscale(0%);
    opacity: 1;
    transform: scale(1.1);
}

.partners-logo-grid-compact .partner-logo img {
    max-width: 130px;
    height: auto;
    filter: grayscale(100%);
    opacity: 0.6;
    transition: all 0.4s ease;
}

.partners-section .section-subtitle {
    max-width: 700;
    font-family: 'Vazir-Bold', sans-serif;
    margin: 0 auto 60px auto;
    text-align: center;
    font-size: 1.1rem;
    line-height: 1.8;
    color: #6c757d;
}

.partners-side p {
    font-size: 1.1rem;
    line-height: 1.9;
    color: #555;
    margin-bottom: 40px;
}

.product-cta-box {
    background-color: var(--primary-color);
    padding: 20px;
    border-radius: 8px;
    display: flex;
    gap: 15px;
}

.product-cta-box .btn {
    flex-grow: 1;
    text-align: center;
    padding-top: 12px;
    padding-bottom: 12px;
}

.product-gallery .main-image img {
    width: 100%;
    height: auto;
    display: block;
}

.product-gallery ol{
    display: flex;
    justify-content: center;
    align-items: center;
}
.product-gallery ol li{
    list-style: none;

}

.product-info .product-short-desc {
    font-size: 1.1rem;
    line-height: 1.8;
    color: #555;
    margin-bottom: 25px;
}

.product-info .product-title-inner {
    font-size: 2.2rem;
    color: var(--dark-text-color);
    margin-bottom: 15px;
}

.product-key-features {
    list-style: none;
    padding: 0;
    margin-bottom: 30px;
}

.product-key-features li {
    padding-right: 20px;
    position: relative;
    margin-bottom: 12px;
}

.product-key-features li i {
    color: var(--primary-color);
    position: absolute;
    right: 0;
    top: 5px;
}

.project-category {
    display: inline-block;
    font-size: 0.85rem !important; /* خیلی کوچک‌تر */
    font-weight: 500 !important;   /* ضخامت متوسط (نه بولد) */
    color: var(--primary-color);
    margin-bottom: 10px;
    background-color: rgba(13, 43, 78, 0.05); /* یک پس‌زمینه محو */
    padding: 4px 12px;
    border-radius: 20px;
    letter-spacing: 0; /* حذف فاصله بین حروف */
}

.project-content-col {
    flex: 1;
    padding: 0 20px;
}

.project-content-col h3 {
    font-size: 1.4rem !important; /* سایز معقول‌تر */
    line-height: 1.5;
    margin-bottom: 15px;
    font-weight: 700; /* بولد معمولی */
    font-family: 'Vazir-Bold', sans-serif;

}


.project-content-col h3 a{
    color: var(--dark-text-color);
    text-decoration: none;
    transition: color 0.3s;
}
.project-content-col h3 a:hover {
    color: var(--cta-color);
}

.project-content-col p {
    font-size: 0.95rem !important; /* کمی ریزتر */
    line-height: 1.8;             /* فاصله خطوط مناسب برای خوانایی */
    color: #555;
    margin-bottom: 25px;
    font-weight: 400;             /* کاملاً ساده و نازک */
    text-align: justify;          /* تراز کردن متن */
}

.project-fullwidth-image img {
    width: 100%;
    height: auto;
    border-radius: 8px;
}

.project-image-col {
    flex: 1.2;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
}

.project-image-col img {
    width: 100%;
    display: block;
    border-radius: 12px;
}

.project-intro-content h2 {
    font-size: 2.2rem;
    margin-bottom: 20px;
}

.project-intro-content p {
    font-size: 1.1rem;
    line-height: 1.9;
    color: #555;
    margin-bottom: 30px;
}

.project-intro-image img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
}

.project-meta-inline {
    display: flex;
    gap: 30px;
    padding-top: 20px;
    border-top: 1px solid #eee;
}

.project-meta-inline .meta-item h5 {
    font-size: 1rem;
    color: #888;
    margin-bottom: 8px;
    font-weight: 400;
}

.project-meta-inline .meta-item p {
    font-size: 1.1rem;
    font-weight: 500;
    color: var(--dark-text-color);
    margin: 0;
}

.project-row {
    display: flex;
    align-items: center;
    gap: 40px;
    opacity: 0.5;
    transform: scale(0.95);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.project-row-reverse {
    flex-direction: row-reverse;
}

.project-row.is-in-view {
    opacity: 1;
    transform: scale(1);
}

.project-section {
    margin-bottom: 50px;
}

.project-section h2 {
    font-size: 2rem;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 2px solid var(--cta-color);
    display: inline-block;
}

.project-section p {
    font-size: 1.1rem;
    line-height: 2;
    color: #555;
}

.project-showcase {
    display: flex;
    flex-direction: column;
    gap: 80px;
}

.promagnifier {
    border-radius: 50% !important;
}

.results-list {
    list-style: none;
    padding: 0;
}

.results-list li {
    font-size: 1.1rem;
    line-height: 1.8;
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 10px;
    background-color: #f8f9fa;
    border-right: 4px solid var(--primary-color);
}

.results-list li span {
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    color: var(--primary-color);
    margin-left: 8px;
}

.search-form-desktop button {
    border: none;
    background-color: var(--primary-color);
    color: var(--light-color);
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 0.3s;
    flex-shrink: 0;
}

.search-form-desktop button:hover {
    background-color: #0056b3;
}

.search-form-desktop input {
    border: none;
    background: transparent;
    outline: none;
    padding: 8px 12px;
    font-family: 'Vazir-regular', sans-serif;
    font-size: 0.9rem;
    color: var(--dark-text-color);
    width: 100%;
    transition: all 0.4s ease-in-out;
}

.section-subtitle {
    display: flex;
    justify-content: center;
    align-items: center;
}

.section-title {
    text-align: center;
    font-size: 2.2rem;
    /* margin-bottom: 60px; */
    color: var(--primary-color);
}

.section-title-left {
    font-size: 2.2rem;
    color: var(--primary-color);
    margin-bottom: 20px;
    text-align: center;
}

.services .section-title {
    color: var(--dark-text-color);
}


.services-slider {
    width: 100%;
    padding: 10px 10px 50px 10px;
    /* Add padding for shadow and pagination */
}

.simple-page-header .breadcrumb {
    justify-content: flex-start;
    margin-bottom: 15px;
}

.simple-page-header .breadcrumb a,
.simple-page-header .breadcrumb .fas {
    color: #6c757d;
}

.simple-page-header .breadcrumb span {
    color: var(--dark-text-color);
}

.simple-page-header h1 {
    font-size: 2.8rem;
    color: var(--dark-text-color);
}

.social-media-links {
    display: flex;
    gap: 20px;
}

.social-media-links a {
    font-size: 1.8rem;
    color: #ccc;
}

.social-share-float {
    position: absolute;
    top: 20px;
    left: -80px; /* Adjust this value based on your layout */
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.social-share-float .share-icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f0f2f5;
    color: #555;
    border-radius: 50%;
    text-decoration: none;
    font-size: 1.1rem;
    transition: all 0.3s;
}

.social-share-float .share-icon:hover {
    background-color: var(--primary-color);
    color: var(--light-color);
    transform: scale(1.1);
}

.sort-select {
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-family: 'Vazir-regular', sans-serif;
    background-color: #fff;
}

.spec-table td {
    padding: 12px;
    border: 1px solid #eee;
}

.spec-table td:first-child {
    font-weight: 500;
    width: 30%;
}

.spec-table tr:nth-child(odd) {
    background-color: #f8f9fa;
}

.stat-item {
    background: #f8f9fa;
    padding: 20px;
    border-radius: 8px;
    text-align: center;
    border: 1px solid #e9ecef;
}

.stat-item .stat-label {
    display: block;
    font-size: 1rem;
    color: #6c757d;
}

.stat-item .stat-number {
    display: block;
    font-size: 2.2rem;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    color: var(--primary-color);
}

.stat-item i {
    font-size: 2.2rem;
    color: #28a745;
    margin-bottom: 5px;
}

.stats-grid {
    flex-basis: 50%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}

.sticky-nav .header-bottom {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background-color: var(--light-color);
    /* Ensure solid white background */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    animation: slideDown 0.5s ease-out;
}
.header-bottom {
    position: relative;
    z-index: 10;
}

/* تصویر ثابت */
.flag-iran1 {
    position: fixed;
    top: 0; /* فاصله از بالای صفحه */
    left: 20px; /* یا left: 20px; بسته به محل دلخواه */
    width: 80px; /* اندازه دلخواه */
    height: auto;
    z-index: 1000; /* بالاتر از بقیه عناصر */
    pointer-events: none; /* تا روی منو کلیک رو مختل نکنه */
}
.flag-iran2{
    position: fixed;
    top: 0; /* فاصله از بالای صفحه */
    right: 20px; /* یا left: 20px; بسته به محل دلخواه */
    width: 80px; /* اندازه دلخواه */
    height: auto;
    z-index: 1000; /* بالاتر از بقیه عناصر */
    pointer-events: none; /* تا روی منو کلیک رو مختل نکنه */
}

/* اطمینان از اینکه بقیه آیتم‌ها جابه‌جا نشن */
.header-bottom .container {
    position: relative;
}


.swiper-button-next::after,
.swiper-button-prev::after {
    font-size: 1.2rem;
    font-weight: 900;
}

.swiper-button-next:hover,
.swiper-button-prev:hover {
    background-color: var(--cta-color);
    color: var(--dark-text-color);
}

.swiper-pagination-bullet {
    background: var(--cta-color);
    width: 10px;
    height: 10px;
    opacity: 0.5;
}

.swiper-pagination-bullet-active {
    opacity: 1;
    background: var(--cta-color);
}

.swiper-slide {
    height: auto;
    /* Allow slides to grow */
    display: flex;
}

.tab-buttons {
    display: flex;
    background-color: #f8f9fa;
}

.tab-buttons .tab-button {
    flex-grow: 1;
    padding: 15px;
    font-family: 'Vazir-regular', sans-serif;
    font-size: 1.1rem;
    font-weight: 500;
    border: none;
    background: transparent;
    cursor: pointer;
    transition: all 0.3s;
    border-bottom: 3px solid transparent;
}

.tab-buttons .tab-button.active {
    background-color: var(--primary-color);
    border-bottom-color: var(--primary-color);
    color: var(--light-color);
}

.tab-buttons .tab-button:hover {
    background-color: var(--cta-color);
}

.tab-content {
    padding: 30px;
    display: none;
}

.tab-content.active {
    display: block;
}

.tab-content ul li{
    font-family: 'Vazir-regular';
}

.tab-content p{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.tab-content img {
    width: 300px;
}
.thumbnail-images {
    display: flex;
    gap: 10px;
}

.thumbnail-images .thumb {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 5px;
    border: 2px solid #ddd;
    cursor: pointer;
    transition: all 0.3s;
    opacity: 0.7;
}

.thumbnail-images .thumb:hover,
.thumbnail-images .thumb.active {
    border-color: var(--cta-color);
    opacity: 1;
}

.video-responsive iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 8px;
}

.view-all-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    background-color: var(--primary-color);
    color: var(--light-color);
    border-radius: 50%;
    text-decoration: none;
    font-size: 1.2rem;
    position: relative;
    transition: all 0.3s ease;
}

.view-all-arrow .tooltip {
    position: absolute;
    bottom: 120%;
    left: 50%;
    transform: translateX(-50%);
    background-color: var(--dark-text-color);
    color: var(--light-color);
    padding: 5px 10px;
    border-radius: 5px;
    font-size: 0.85rem;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, bottom 0.3s;
}

.view-all-arrow:hover {
    background-color: var(--dark-text-color);
    transform: scale(1.1);
}

.view-all-arrow:hover .tooltip {
    opacity: 1;
    visibility: visible;
    bottom: 130%;
}

.view-all-wrapper {
    text-align: left;
    margin-top: 20px;
    padding-left: 20px;
}

.widget {
    background: var(--light-color);
    padding: 25px;
    border-radius: 8px;
    border: 1px solid #e9ecef;
}

.widget-category-list span {
    background-color: #eee;
    padding: 2px 8px;
    border-radius: 5px;
    font-size: 0.8rem;
    color: #555;
}

.widget-cta .btn-primary {
    display: block;
    width: 100%;
    text-align: center;
    padding: 12px 0;
}

.widget-cta h4 {
    color: var(--light-color);
    border-bottom-color: var(--cta-color);
}

.widget-cta p {
    color: #eee;
    margin-bottom: 25px;
}

.widget-post-list a, .widget-category-list a {
    text-decoration: none;
    color: var(--dark-text-color);
    transition: color 0.3s;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.widget-post-list a:hover, .widget-category-list a:hover {
    color: var(--primary-color);
}

.widget-post-list li, .widget-category-list li {
    margin-bottom: 10px;
    border-bottom: 1px dashed #eee;
    padding-bottom: 10px;
}

.widget-post-list li:last-child, .widget-category-list li:last-child {
    margin-bottom: 0;
    border-bottom: none;
    padding-bottom: 0;
}

.widget-title {
    font-size: 1.3rem;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--cta-color);
    color: var(--primary-color);
}


:root {
    --primary-color: #0D2B4E;
    /* Navy Blue */
    --cta-color: #FFC107;
    /* Yellow for main buttons */
    --secondary-color: #f8f9fa;
    /* Light Gray */
    --dark-text-color: #212529;
    --light-color: #ffffff;
    --header-top-height: 126px;
    --header-bottom-height: 60px;
    --corp-bg: #f8f9fa;
    --corp-text: #333333;
    --corp-blue: #0A2647;
    --ir-gold: #c5a059;
}

/*
=================================================
===      COMBINED PARTNERS & CONTACT SECTION    ===
=================================================
*/

.contact-partners-section {
    padding: 100px 0;
    background-color: var(--secondary-color);
}

/*
=================================================
===      CUSTOM STYLES FOR GRAVITY FORMS      ===
=================================================
*/

/* --- Main Form Wrapper --- */
/* This styles the main container of the form */

.gform_wrapper {
    max-width: 800px;
    margin: 0 auto !important;
    background: var(--light-color) !important;
    padding: 40px !important;
    border-radius: 12px !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1) !important;
    text-align: right !important;
}

/* --- Form Title & Description --- */
.gform_wrapper .gform_title {
    font-size: 2.2rem !important;
    color: var(--primary-color) !important;
    text-align: right !important;
    margin-bottom: 10px !important;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
}

.gform_wrapper .gform_description {
    font-size: 1.05rem !important;
    color: #6c757d !important;
    text-align: right !important;
    margin-bottom: 30px !important;
}

/* --- Main Fields Container --- */
.gform_wrapper ul.gform_fields {
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
}

/* --- Each Field (List Item) --- */
/* Aligns label and input side-by-side on larger screens */
.gform_wrapper li.gfield {
    display: flex !important;
    align-items: center !important;
    gap: 20px !important;
    margin-bottom: 20px !important;
    padding: 0 !important;
    border: none !important;
}

/* --- Field Label --- */
.gform_wrapper .gfield_label {
    flex-basis: 30% !important;
    font-weight: 500 !important;
    color: var(--dark-text-color) !important;
    padding: 0 !important;
    font-size: 1rem;
}

/* --- Input Container --- */
.gform_wrapper .ginput_container {
    flex-grow: 1 !important;
}

/* --- General Input & Textarea Styles --- */
.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper textarea {
    width: 100% !important;
    padding: 12px 15px !important;
    font-size: 1rem !important;
    font-family: 'Vazir-regular', sans-serif !important;
    border: 1px solid #ddd !important;
    border-radius: 8px !important;
    background-color: #f9f9f9 !important;
    transition: all 0.3s !important;
    box-shadow: none !important;
}

/* --- Textarea specific styles --- */
.gform_wrapper li.gfield_textarea {
    flex-direction: column !important;
    /* Stack label on top of textarea */
    align-items: flex-start !important;
}

.gform_wrapper li.gfield_textarea .gfield_label {
    margin-bottom: 8px !important;
}

.gform_wrapper textarea {
    min-height: 120px !important;
    resize: vertical !important;
}

/* --- Focus State for Inputs --- */
.gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]):focus,
.gform_wrapper textarea:focus {
    outline: none !important;
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 3px rgba(13, 43, 78, 0.1) !important;
}

/* --- Submit Button --- */
.gform_wrapper .gform_footer {
    text-align: left !important;
    /* Align button to the left in RTL layout */
    padding: 0 !important;
    margin-top: 30px !important;
}

.gform_wrapper .gform_button {
    padding: 12px 35px !important;
    border: none !important;
    border-radius: 8px !important;
    font-family: 'Vazir-Bold', sans-serif !important;
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    color: var(--light-color) !important;
    background: linear-gradient(90deg, var(--primary-color) 0%, #3a6ea5 100%) !important;
    cursor: pointer !important;
    transition: transform 0.3s, box-shadow 0.3s !important;
}

.gform_wrapper .gform_button:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 20px rgba(13, 43, 78, 0.25) !important;
}

/* --- Hide unnecessary elements --- */
.gform_wrapper .gfield_required {
    display: none !important;
    /* Hides the default red asterisk */
}

.gform_wrapper .gform-field-label--type-sub {
    display: none !important;
}
.ginput_container ginput_container_textarea{
    height: 40px !important;
}

/* --- Responsive Adjustments --- */
@media (max-width: 768px) {
    .gform_wrapper li.gfield {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 8px !important;
    }
}
/*
=================================================
===      ELEGANT SINGLE PROJECT (V2)          ===
=================================================
*/

/* --- Simple Page Header --- */
.simple-page-header {
    padding: 60px 0;
    background-color: var(--secondary-color);
    border-bottom: 1px solid #e9ecef;
}

/*
=================================================
===      STYLES FOR ARCHIVE PAGE TEMPLATE       ===
=================================================
*/

/* --- Filter and Sort Bar --- */
.filter-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    padding: 20px;
    background-color: var(--light-color);
    border: 1px solid #e9ecef;
    border-radius: 8px;
    margin-bottom: 40px;
}
/*
=================================================
===      SINGLE PRODUCT PAGE LAYOUT STYLES    ===
=================================================
*/

/* --- Main Layout Container --- */
.product-layout-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 50px;
    align-items: flex-start;
    padding: 20px;
    background: var(--light-color);
    border-radius: 12px;
    box-shadow: 0 5px 30px rgba(0,0,0,0.08);
}

/* --- Gallery Column --- */
.product-gallery-column {
    position: sticky;
    top: 120px;
}
.product-gallery-column .main-image {
    border: 1px solid #eee;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 15px;
}
.product-gallery-column .main-image img {
    width: 100%;
    height: auto;
    display: block;
}
.thumbnail-images {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.thumbnail-images .thumb {
    width: 80px;
    height: 80px;
    border-radius: 5px;
    border: 2px solid #ddd;
    cursor: pointer;
    transition: all 0.3s;
    opacity: 0.7;
    overflow: hidden;
}
.thumbnail-images .thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.thumbnail-images .thumb:hover,
.thumbnail-images .thumb.active {
    border-color: var(--cta-color);
    opacity: 1;
}

/* --- Info Column --- */
.product-info-column .product-title-inner {
    font-size: 2.4rem;
    color: var(--dark-text-color);
    margin-bottom: 15px;
}
.product-info-column .product-short-desc {
    font-size: 1.1rem;
    line-height: 1.8;
    color: #555;
    margin-bottom: 25px;
}
.product-key-features {
    list-style: none;
    padding: 0;
    margin-bottom: 30px;
}
.product-key-features li {
    padding-right: 20px;
    position: relative;
    margin-bottom: 12px;
    font-size: 1.1rem;
}
.product-key-features li i {
    color: var(--primary-color);
    position: absolute;
    right: 0;
    top: 5px;
}
.product-cta-box {
    margin-top: 30px;
}

/* --- Tabs below the main grid --- */
.product-tabs-container {
    margin-top: 60px;
}

/* --- Responsive Adjustments --- */
@media (max-width: 992px) {
    .product-layout-container {
        grid-template-columns: 1fr; /* Stack on smaller screens */
    }
    .product-gallery-column {
        position: static; /* Unstick the gallery on mobile */
    }
}
/*
=================================================
===      PRODUCT PRICE & ADD TO CART STYLES   ===
=================================================
*/

/* --- Price Wrapper --- */
.price-wrapper {
    margin-bottom: 20px;
}
.price-wrapper .price {
    font-size: 2rem;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    color: var(--primary-color);
}
/* Style for sale price */
.price-wrapper .price ins {
    text-decoration: none;
    color: var(--primary-color);
}
.price-wrapper .price del {
    font-size: 1.2rem;
    opacity: 0.5;
    margin-left: 10px;
}

/* --- Add to Cart Form Elements --- */
.product-cta-box form.cart {
    display: flex;
    align-items: center;
    gap: 15px;
}

/* --- Quantity Input --- */
.product-cta-box .quantity .input-text.qty {
    width: 80px;
    height: 50px;
    padding: 10px;
    text-align: center;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-family: 'Vazir-Bold', sans-serif;
    font-size: 1.2rem;
    font-weight: 700;
    transition: all 0.3s;
}
.product-cta-box .quantity .input-text.qty:focus {
    outline: none;
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(13, 43, 78, 0.1);
}

/* --- Add to Cart Button --- */
.product-cta-box .single_add_to_cart_button {
    flex-grow: 1;
    height: 50px;
    border: none;
    border-radius: 5px;
    background-color: var(--cta-color);
    color: var(--dark-text-color);
    font-family: 'Vazir-Bold', sans-serif;
    font-size: 1.1rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(255, 193, 7, 0.3);
    padding: 10px;
}
.product-cta-box .single_add_to_cart_button:hover {
    background-color: #ffcd39;
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(255, 193, 7, 0.5);
}
/*
=================================================
===      VIBRANT & COLORFUL ARTICLE HEADER      ===
=================================================
*/

/* --- Article Header --- */
.article-header {
    position: relative;
    padding: 100px 0 150px 0;
    text-align: center;
    color: var(--light-color);
    background-size: cover;
    background-position: center;
    background-attachment: fixed; /* Parallax effect */
    overflow: hidden;
}

/* --- Animated Top Border --- */
.card::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 4px;
    background-color: var(--cta-color);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* --- Archive Grid --- */
.archive-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 30px;
}

/* --- Article Body & Floating Share --- */
.article-body {
    font-size: 1.1rem;
    line-height: 2.0;
    color: #333;
    text-align: justify;

    /* این خط کلیدی‌ترین بخش است: */
    /* باعث می‌شود کادر متن کش بیاید تا عکس را در خود جا دهد */
    display: flow-root;

}
/* خیلی مهم: در موبایل باید حالت شناور را غیرفعال کنیم
   تا تصویر و متن زیر هم قرار بگیرند
*/
@media (max-width: 768px) {
    .single-featured-image.floating-image {
        float: none;
        width: 100%;
        max-width: 100%;
        margin-right: 0;
        margin-bottom: 25px;
    }
}

/* --- Author Box --- */
.author-box {
    margin-top: 50px;
    padding-top: 30px;
    border-top: 1px solid #eee;
    display: flex;
    align-items: center;
    gap: 25px;
}

/* --- Contact Side (Right) --- */
.contact-side .contact-form-revamped {
    margin: 0; /* Override previous margin */
}

/* --- Dropdown Arrow for items with children --- */
/* این کد با استفاده از کلاس .menu-item-has-children یک فلش کنار آیتم‌های دارای زیرمنو قرار می‌دهد */
.main-nav .menu-item-has-children > a::before {
    content: '\f078';
    /* آیکون فلش رو به پایین از فونت FontAwesome */
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    font-size: 0.7em;
    margin-left: 8px;
    transition: transform 0.3s ease;
}

/* --- Each Field (List Item) --- */
/* We use flexbox to align label and input side-by-side */
.gform_wrapper li.gfield {
    display: flex !important;
    align-items: center !important;
    gap: 20px !important;
    margin-bottom: 20px !important;
    padding: 0 !important;
    border: none !important;
}

/* --- Field Label --- */
.gform_wrapper .gfield_label {
    flex-basis: 30% !important; /* Adjust width of the label */
    font-weight: 500 !important;
    color: var(--dark-text-color) !important;
    padding: 0 !important;
    font-size: 1rem;
}

/* --- Focus State for Inputs --- */
.gform_wrapper input[type="text"]:focus,
.gform_wrapper input[type="email"]:focus,
.gform_wrapper input[type="tel"]:focus,
.gform_wrapper textarea:focus {
    outline: none !important;
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 3px rgba(13, 43, 78, 0.1) !important;
}

/* --- Form Title & Description --- */
.gform_wrapper .gform_title {
    font-size: 2.2rem !important;
    color: var(--primary-color) !important;
    text-align: right !important;
    margin-bottom: 10px !important;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
}

/* --- Full-width Image --- */
.project-fullwidth-image {
    margin: 60px 0;
}

/* --- General Input & Textarea Styles --- */
.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper textarea {
    width: 100% !important;
    padding: 12px 15px !important;
    font-size: 1rem !important;
    font-family: 'Vazir-regular', sans-serif !important;
    border: 1px solid #ddd !important;
    border-radius: 8px !important;
    background-color: #f9f9f9 !important;
    transition: all 0.3s !important;
    box-shadow: none !important;
}

/* --- Hide unnecessary elements --- */
.gform_wrapper .gfield_required {
    display: none !important; /* Hides the default red asterisk */
}

/* --- Input Container --- */
.gform_wrapper .ginput_container {
    flex-grow: 1 !important;
    position: relative !important;
}

/* --- Main Fields Container --- */
.gform_wrapper ul.gform_fields {
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
}

/* --- Partners Side (Left) --- */
.partners-side {
    text-align: right;
}

/* --- Product Gallery --- */
.product-gallery .main-image {
    border: 1px solid #eee;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 15px;
    width: 350px;
    height: auto;
}

/* --- Product Info --- */
.product-info .product-sku {
    font-size: 0.9rem;
    color: #888;
    margin-bottom: 10px;
    display: block;
}

/* --- Product Tabs --- */
.product-tabs-container {
    border: 1px solid #eee;
    border-radius: 8px;
    overflow: hidden;
}

/* --- Project Content --- */
.project-description-content {
    max-width: 850px;
    margin: 40px auto;
    /* Add margin to separate from intro */
}

/* --- Project Intro Grid --- */
.project-intro-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 50px;
    align-items: center;
    padding: 60px 0;
}

/* --- Responsive Adjustments --- */


/*
=================================================
===      STYLES FOR SINGLE ARTICLE PAGE         ===
=================================================
*/

/* --- Article Header --- */
.article-header {
    padding: 100px 0;
}

/* --- Responsive Adjustments --- */


/*
=================================================
===      VIBRANT & COLORFUL ARTICLE HEADER      ===
=================================================
*/

/* --- Article Header --- */
.article-header {
    position: relative;
    padding: 100px 0 150px 0;
    text-align: center;
    color: var(--light-color);
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    /* Parallax effect */
    overflow: hidden;
}

/* --- Responsive for Article page --- */




/*
=================================================
===      SIDEBAR WIDGET STYLES CORRECTION     ===
=================================================
*/

/* --- Sidebar General --- */
.sidebar-col {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

/* --- Revamped Icon Style --- */
.card-icon {
    width: 80px;
    height: 80px;
    margin: 0 auto 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: rgba(255, 193, 7, 0.1);
    color: var(--cta-color);
    font-size: 2.8rem;
    transition: all 0.4s ease;
}

/* --- Rotate arrow on hover --- */
.main-nav .menu-item-has-children:hover > a::before {
    transform: rotate(180deg);
}



/* --- Sidebar Call to Action (CTA) Widget --- */
.widget-cta {
    background-color: var(--primary-color);
    color: var(--light-color);
    text-align: center;
    border-radius: 8px;
    padding: 30px;
}

/* --- Sidebar Lists (Recent Posts & Categories) --- */
.widget-post-list, .widget-category-list {
    list-style: none;
    padding: 0;
    margin: 0;
}




/* --- Submit Button --- */
.gform_wrapper .gform_footer {
    text-align: left !important; /* Align button to the left in RTL */
    padding: 0 !important;
    margin-top: 30px !important;
}

/* --- Swiper Navigation & Pagination --- */
.swiper-button-next,
.swiper-button-prev {
    color: var(--cta-color);
    width: 50px;
    height: 50px;
    background-color: var(--light-color);
    border-radius: 50%;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    transition: all 0.3s;
}

/* --- Textarea specific --- */
.gform_wrapper li.gfield_textarea {
    flex-direction: column !important; /* Stack label on top of textarea */
    align-items: flex-start !important;
}

/* --- The new gradient overlay --- */
.page-header-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(45deg, rgba(13, 43, 78, 0.9) 0%, rgba(255, 193, 7, 0.4) 100%);
    opacity: 0.95;
}

/* --- The wave shape at the bottom --- */
.article-header::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100px; /* Height of the wave */
    background: var(--secondary-color); /* The color of the section below */
    clip-path: polygon(0 100%, 100% 100%, 100% 15%, 50% 100%, 0 15%);
    transform: scaleX(-1);
    z-index: 5;
}

/* --- Top Level Menu Items --- */
.main-nav ul.menu > li.menu-item {
    position: relative;
    /* این ویژگی برای جایگذاری صحیح زیرمنو ضروری است */
    margin: 0 15px;
}

/* --- Underline effect for top-level items --- */
.main-nav ul.menu > li.menu-item > a::after {
    content: '';
    position: absolute;
    width: 0;
    height: 3px;
    bottom: 0;
    right: 50%;
    transform: translateX(50%);
    background-color: var(--primary-color);
    transition: width 0.4s ease;
}

/* ======================= Company Intro & Stats Section ======================= */
.company-intro {
    padding: 60px 0;
    background-color: var(--light-color);
}

/* ======================= Footer & Contact Info Section ======================= */
.main-footer {
    background-color: var(--primary-color);
    color: #ccc;
    padding: 60px 0 20px 0;
}

/* ================================================= */
/* ===           NEWS SLIDER SECTION             === */
/* ================================================= */
.news {
    padding: 80px 0;
    background-color: #f5f7fa;
}

/* ================================================= */
/* ===           PARTNERS LOGO SECTION           === */
/* ================================================= */
.partners-section {
    padding: 80px 0;
    background-color: var(--light-color);
}

/* ================================================= */
/* ===         ANIMATED PROJECTS SECTION         === */
/* ================================================= */
#projects {
    --bg-start: #e9f3ff;
    --bg-end: var(--secondary-color);
    /* CHANGED */
    padding: 100px 0;
    position: relative;
    background-image: linear-gradient(to bottom, var(--bg-start), var(--bg-end));
    background-size: 100% 200%;
    background-position: 0 var(--scroll-percent, 0);
    transition: background-position 0.1s linear;
}

/* ================================================= */
/* ===         HAMBURGER & RESPONSIVE NAV        === */
/* ================================================= */
.hamburger-toggle {
    display: none;
}

/* ================================================= */
/* ===         HEADER & NAVIGATION STYLES        === */
/* ================================================= */

.main-header {
    background-color: var(--light-color);
    transition: transform 0.4s ease;
    z-index: 1000;
    box-shadow: rgb(0 0 0 / 10%) 0 8px 10px 0;
}

/* ================================================= */
/* ===         HEADER SEARCH BAR STYLES          === */
/* ================================================= */
.search-form-desktop {
    display: flex;
    align-items: center;
    background-color: var(--secondary-color);
    border: 1px solid #e0e0e0;
    border-radius: 25px;
    padding: 2px 5px;
    margin: 0 20px;
    flex-grow: 1;
    max-width: 400px;
}

/* ================================================= */
/* ===         SERVICES SLIDER SECTION           === */
/* ================================================= */
.services {
    padding: 80px 0;
    background-color: var(--light-color);
}

/* ================================================= */
/* ===        REVAMPED CONTACT FORM STYLES       === */
/* ================================================= */
.contact-section {
    padding: 100px 0;
    background: var(--secondary-color);
}

/* ================================================= */
/* ===      CLIENT LICENSES SLIDER STYLES        === */
/* ================================================= */

.client-licenses {
    /*padding: 80px 0;*/
    background-color: var(--light-color);
}

/* ================================================= */
/* ===      RESPONSIVE STYLES FOR MOBILE MENU    === */
/* ================================================= */


#ajaxsearchpro1_1 .probox .proinput {
    width: 400px !important;
}

/* Buttons */
.btn {
    border-radius: 5px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    display: inline-block;

}

/* General Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Hero Section */
/*.hero {*/
/* position: relative;*/
/* height: calc(95vh - var(--header-height));*/
/* min-height: 1000px;*/
/* display: flex;*/
/* align-items: center;*/
/* justify-content: center;*/
/* text-align: center;*/
/* color: var(--light-color);*/
/*}*/

/*
=================================================
===      NEW CLEAN SINGLE ARTICLE STYLES      ===
=================================================
*/





/* --- 1. Article Header --- */
.single-article-header {
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 2px solid var(--primary-color);
}

.single-article-header .entry-title {
    font-size: 2.8rem;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    color: var(--dark-text-color);
    margin-bottom: 20px;
    line-height: 1.4;
}

.entry-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
    font-size: 0.9rem;
    color: #555;
}

.entry-meta .meta-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.entry-meta .meta-item i {
    color: var(--primary-color);
}

/* --- 2. Featured Image --- */
.single-featured-image {
    margin-bottom: 30px;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    width: 50%;

}

.single-featured-image img {
    width: 100%;
    height: auto;
    display: block; /* Removes bottom space */
}

/* --- 3. Article Body --- */
.article-body {
    font-size: 1.1rem;
    line-height: 2.0; /* Increased line height for readability */
    color: #333;
}
.article-body p {
    margin-bottom: 25px;
}
.article-body h2, .article-body h3 {
    color: var(--primary-color);
    margin-top: 40px;
    margin-bottom: 20px;
}
.article-body ul, .article-body ol {
    margin: 0 25px 25px 0;
}

/* --- 4. Article Footer (Tags) --- */
.entry-footer {
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px solid #eee;
}
.tags-links {
    font-size: 0.95rem;
}
.tags-title {
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    color: var(--dark-text-color);
    margin-left: 10px;
}
.tags-links a {
    display: inline-block;
    background-color: var(--secondary-color);
    padding: 5px 12px;
    border-radius: 5px;
    text-decoration: none;
    color: #555;
    margin: 2px;
    transition: all 0.3s;
}
.tags-links a:hover {
    background-color: var(--primary-color);
    color: var(--light-color);
}

/* --- Responsive for Article Page --- */
@media (max-width: 992px) {
    .single-article-header .entry-title {
        font-size: 2.2rem;
    }
}
/*
=================================================
===      NEW CENTERED SINGLE ARTICLE LAYOUT     ===
=================================================
*/

/* این کلاس اصلی است که محتوا را "بزرگتر" و "وسط‌چین" می‌کند
  و "حاشیه کناری" را مدیریت می‌کند.
*/
.article-main-column.single-centered-content {
    /*max-width: 950px; !* عریض‌تر از قبل برای خوانایی بهتر *!*/
    margin: 0 auto; /* این دستور محتوا را کاملاً وسط صفحه می‌آورد */
}

/* استایل‌های قبلی برای هدر، تصویر و متن مقاله
  همچنان پابرجا هستند و نیازی به تغییر ندارند.
  فقط برای اطمینان، چند مورد را باز-تعریف می‌کنیم.
*/
.single-article-header .entry-title {
    font-size: 2.6rem; /* کمی بزرگتر برای تاکید */
}

.article-body {
    font-size: 1.1rem;
    line-height: 2.0; /* فاصله خطوط عالی برای خواندن */
    color: #333;
}

/* در موبایل، عرض کامل را می‌گیرد */
@media (max-width: 992px) {
    .single-article-header .entry-title {
        font-size: 2.2rem;
    }
}


/*=================================================*/
/*===      STYLES FOR MAIN NAVIGATION & DROPDOWNS  ===*/
/*=================================================*/


/* --- Main Navigation Container --- */
.main-nav {
    width: 100%;
}

/* Responsive Styles for Intro Section */


/* ================================================= */
/* ===         COURSES SLIDER SECTION            === */
/* ================================================= */
.courses {
    padding: 80px 0;
    background-color: var(--light-color);
}

/* Spec Table */
.spec-table {
    width: 100%;
    border-collapse: collapse;
}

/* Sticky Navigation Styles */
.sticky-nav .header-top {
    transform: translateY(-100%);
    opacity: 0;
    visibility: hidden;
}

/* Video Responsive */
.video-responsive {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 Aspect Ratio */
    height: 0;
    overflow: hidden;
}



from {
    transform: translateY(-100%);
}

html {
    scroll-behavior: smooth;
    overflow-x: hidden;
}

to {
    transform: translateY(0);
}
/* استایل پایه برای دسکتاپ (دو ستونه) */
.slide-grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr; /* دو ستون برابر */
    gap: 30px;
    width: 100%;
}
/* =================================================
===   MOBILE OPTIMIZATION FOR PROMO SLIDER    ===
=================================================
*/

@media (max-width: 768px) {

    /* 1. تبدیل گرید به تک ستونه */
    .slide-grid-2 {
        display: block !important; /* حالت گرید را غیرفعال می‌کنیم */
    }

    /* 2. استایل کارت‌ها در حالت تک ستونه */
    .promo-card {
        width: 100% !important;       /* عرض کامل */
        margin-bottom: 20px;          /* فاصله بین کارت‌ها */
        display: flex;                /* چیدمان افقی (عکس راست، متن چپ) */
        flex-direction: row;
        align-items: center;
        height: auto !important;      /* ارتفاع خودکار */
        min-height: 120px;            /* حداقل ارتفاع برای زیبایی */
    }

    /* 3. تنظیم تصویر در کارت افقی موبایل */
    .promo-image-col {
        width: 40% !important;        /* عکس ۴۰ درصد عرض را بگیرد */
        height: 100% !important;
        flex-shrink: 0;
    }
    .promo-image-col img {
        height: 100% !important;
        object-fit: cover;
    }

    /* 4. تنظیم محتوا و مخفی کردن توضیحات اضافی */
    .promo-content-col {
        width: 60% !important;        /* متن ۶۰ درصد عرض را بگیرد */
        padding: 10px 15px !important;
        text-align: right;
    }

    /* مخفی کردن توضیحات طولانی برای کاهش ارتفاع */
    .promo-description {
        display: none !important;
    }

    /* کوچک کردن عنوان */
    .promo-title {
        font-size: 1rem !important;
        margin-bottom: 10px !important;
        line-height: 1.4 !important;
    }

    /* تگ بالای کارت (پیشنهاد ویژه) را هم می‌توانیم کوچک یا مخفی کنیم */
    .promo-eyebrow {
        font-size: 0.7rem !important;
        padding: 2px 8px !important;
        margin-bottom: 5px !important;
    }

    /* دکمه کوچک‌تر */
    .promo-content-col .btn {
        padding: 5px 12px !important;
        font-size: 0.8rem !important;
        margin-top: 5px;
    }
}


/* Main Navigation */
.main-nav {
    width: 100%;
}

@media (max-width: 992px) {
    .search-form-desktop {
        display: none;
    }

    .header-top-actions .user-actions {
        display: none;
    }

    /* Hide login on tablet */
    .header-bottom .container {
        justify-content: space-between;
    }



    .hamburger-icon {
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        width: 30px;
        height: 25px;
        cursor: pointer;
        z-index: 1001;
    }

    .hamburger-icon span {
        display: block;
        width: 100%;
        height: 3px;
        background-color: var(--primary-color);
        border-radius: 3px;
        transition: all 0.3s ease-in-out;
    }

    .main-nav {
        position: absolute;
        top: 100%;
        right: 0;
        width: 100%;
        background-color: var(--light-color);
        box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
        transform: translateY(-150%);
        transition: transform 0.4s ease-in-out;
        z-index: 999;
    }

    .main-nav ul {
        flex-direction: column;
        padding: 20px 0;
    }

    .main-nav ul li {
        margin: 0;
        text-align: center;
    }

    .main-nav ul li a {
        display: block;
        padding: 15px 0;
    }

    .hamburger-toggle:checked ~ .main-nav {
        transform: translateY(0);
    }

    .hamburger-toggle:checked ~ .hamburger-icon span:nth-child(1) {
        transform: rotate(45deg) translate(6px, 6px);
    }

    .hamburger-toggle:checked ~ .hamburger-icon span:nth-child(2) {
        opacity: 0;
    }

    .hamburger-toggle:checked ~ .hamburger-icon span:nth-child(3) {
        transform: rotate(-45deg) translate(6px, -6px);
    }

    .mobile-search-form {
        display: block;
        padding: 10px 20px;
    }

    .mobile-search-form form {
        display: flex;
        width: 100%;
        border: 1px solid #ddd;
        border-radius: 8px;
        overflow: hidden;
    }

    .mobile-search-form input {
        flex-grow: 1;
        border: none;
        padding: 12px;
        font-size: 1rem;
        font-family: 'Vazir-regular', sans-serif;
    }

    .mobile-search-form input:focus {
        outline: none;
    }

    .mobile-search-form button {
        border: none;
        background: #f0f0f0;
        padding: 0 15px;
        cursor: pointer;
        color: var(--primary-color);
    }
}

@media (max-width: 768px) {
    .header-top .logo {
        font-size: 1.5rem;
    }

    .header-top-actions .lang-switcher {
        display: none;
    }
}

@media (max-width: 992px) {
    .company-intro .container {
        flex-direction: column;
        gap: 50px;
    }

    .intro-text,
    .stats-grid {
        flex-basis: 100%;
        text-align: center;
    }
}

@media (max-width: 992px) {

    .project-row,
    .project-row-reverse {
        flex-direction: column !important; /* همیشه زیر هم باشند */
        gap: 20px;
        margin-bottom: 60px; /* فاصله بین پروژه‌ها */
    }

    .project-image-col,
    .project-content-col {
        width: 100%;
        padding: 0;
    }
    .project-image-col img {
        height: 200px; /* ارتفاع فیکس برای عکس در موبایل */
        width: 100%;
        object-fit: cover;
        border-radius: 12px;
    }

    .project-content-col h3 {
        font-size: 1.2rem !important; /* در موبایل باز هم کوچک‌تر */
        margin-top: 15px;
    }

    .project-content-col {
        margin-top: 30px;
        padding: 0;
    }
}

@media (max-width: 768px) {
    .form-group {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
}

@media (max-width: 768px) {

    /* Adaptive Typography */
    .hero h1 {
        font-size: 2.2rem;
    }

    .hero p {
        font-size: 1.05rem;
    }

    .section-title {
        font-size: 1.8rem;
    }

    .card-title {
        font-size: 1.3rem;
    }

    /* Simpler Layouts */
    .hero-buttons {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .hero-buttons .btn {
        font-size: 0.85rem !important; /* فونت ریزتر */
        padding: 8px 16px !important;   /* دکمه جمع‌وجورتر */
        margin: 4px !important;         /* فاصله کمتر بین دکمه‌ها */
        height: auto !important;
        min-width: auto !important;
    }
    /* 3. کوچک کردن فلش‌های چپ و راست (Navigation) */
    .hero-background-slider .swiper-button-next,
    .hero-background-slider .swiper-button-prev {
        width: 30px !important;   /* عرض دکمه */
        height: 30px !important;  /* ارتفاع دکمه */
        background-color: rgba(255, 255, 255, 0.6) !important; /* کمی شفاف‌تر */
    }
    /* اندازه آیکون فلش داخل دکمه */
    .hero-background-slider .swiper-button-next::after,
    .hero-background-slider .swiper-button-prev::after {
        font-size: 12px !important; /* آیکون خیلی ریزتر */
        font-weight: bold;
    }
    /* 4. تنظیم کادر محتوا که متن توش هست */
    .hero-content {
        width: 90% !important; /* عرض کادر بیشتر بشه تا متن جا بشه */
        padding: 15px !important; /* پدینگ کمتر */
        bottom: 20px !important; /* فاصله از پایین */
    }

}

@media (max-width: 576px) {
    .stats-grid {
        grid-template-columns: 1fr;
    }

    .intro-text h2 {
        font-size: 1.8rem;
    }
}

@media (max-width: 992px) {
    .main-nav ul {
        flex-direction: column;
        padding: 20px 0;
    }

    .main-nav ul.menu > li.menu-item {
        margin: 0;
        text-align: center;
    }

    .main-nav ul.menu > li.menu-item > a {
        padding: 15px 20px;
    }

    .main-nav ul.menu > li.menu-item > a::after {
        display: none;
        /* مخفی کردن خط زیرین در موبایل */
    }

    .main-nav .menu-item-has-children > a::before {
        margin-right: 8px;
        margin-left: 0;
    }
}

@media (max-width: 992px) {
    .project-intro-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 992px) {
    .product-layout {
        grid-template-columns: 1fr; /* Stack gallery and info */
    }
}

@media (max-width: 1200px) {
    .social-share-float {
        display: none; /* Hide floating icons on smaller screens, can be replaced by inline icons */
    }
}

@media (max-width: 768px) {
    .article-header h1 {
        font-size: 2.4rem;
    }

    .author-box {
        flex-direction: column;
        text-align: center;
    }
}

@media (max-width: 768px) {
    .gform_wrapper li.gfield {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 8px !important;
    }
}

@media (max-width: 992px) {
    .contact-partners-grid {
        grid-template-columns: 1fr; /* Stack columns on smaller screens */
        gap: 80px;
    }

    .partners-side {
        text-align: center;
    }

    .section-title-left {
        text-align: center;
    }

    .partners-logo-grid-compact {
        justify-content: center;
    }
}

@media (max-width: 576px) {
    .partners-logo-grid-compact .partner-logo {
        flex-basis: calc(50% - 15px); /* Two logos per row on mobile */
    }
}

@media (max-width: 992px) {

    .main-nav .menu-item-has-children > a::before {
        margin-right: 8px;
        margin-left: 0;
    }
}
/*
=================================================
===      CONTACT US PAGE STYLES               ===
=================================================
*/

.contact-page-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 50px;
    background: var(--light-color);
    padding: 40px;
    border-radius: 12px;
    box-shadow: 0 5px 30px rgba(0, 0, 0, 0.08);
    margin-bottom: 50px;
}

.contact-info-col h3,
.contact-form-col h3 {
    font-size: 1.8rem;
    color: var(--primary-color);
    margin-bottom: 15px;
}

.contact-info-col p,
.contact-form-col p {
    color: #555;
    line-height: 1.8;
    margin-bottom: 30px;
}

.info-box {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 25px;
}

.info-icon {
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    background-color: rgba(13, 43, 78, 0.07);
    color: var(--primary-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
}

.info-text h4 {
    font-size: 1.2rem;
    margin-bottom: 5px;
    color: var(--dark-text-color);
}

.info-text a {
    margin-bottom: 0;
    font-size: 1rem;
    text-decoration: none;
    color: #555;
}

.info-text p a {
    color: #555;
    text-decoration: none;
}

.info-text p a:hover {
    color: var(--primary-color);
}

/* --- Contact Form --- */
.contact-form-col .contact-form-revamped {
    padding: 0;
    box-shadow: none;
}

/* --- Google Maps --- */
.google-map-section {
    width: 100%;
    margin-top: -5px;
    /* To align perfectly with the section above */
}

.google-map-section iframe {
    display: block;
}

/* --- Responsive for Contact Page --- */
@media (max-width: 992px) {
    .contact-page-grid {
        grid-template-columns: 1fr;
        /* Stack on smaller screens */
    }
}
/*
=================================================
===      PRODUCT PAGE WITH SIDEBAR STYLES     ===
=================================================
*/

/* --- The Main Grid Layout --- */
.product-page-grid {
    display: grid;
    grid-template-columns: 2fr 1fr; /* 2/3 for main content, 1/3 for sidebar */
    gap: 50px;
    align-items: flex-start;
}

/* --- Popular Products Sidebar --- */
.product-sidebar-popular {
    position: sticky;
    top: 120px; /* Adjust based on your sticky header height */
}

.product-sidebar-popular .widget {
    background-color: var(--light-color);
    border: 1px solid #e9ecef;
    border-radius: 12px;
    padding: 25px;
    box-shadow: 0 5px 25px rgba(0,0,0,0.05);
}

.popular-products-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.popular-product-item {
    display: flex;
    align-items: center;
    gap: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid #f0f0f0;
}
.popular-products-list .popular-product-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.popular-product-image {
    flex-shrink: 0;
}
.popular-product-image img {
    width: 70px;
    height: 70px;
    object-fit: cover;
    border-radius: 8px;
}

.popular-product-title {
    font-size: 1rem;
    font-weight: 500;
    margin-bottom: 5px;
}
.popular-product-title a {
    color: var(--dark-text-color);
    text-decoration: none;
    transition: color 0.3s;
}
.popular-product-title a:hover {
    color: var(--primary-color);
}
.popular-product-price {
    font-size: 0.9rem;
    color: var(--primary-color);
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
}
.popular-product-price ins {
    text-decoration: none;
    background: none;
}


/* --- Responsive Adjustments --- */
@media (max-width: 992px) {
    .product-page-grid {
        grid-template-columns: 1fr; /* Stack columns on smaller screens */
    }
    .product-sidebar-popular {
        position: static; /* Unstick the sidebar on mobile */
        margin-top: 50px;
    }
}

/*
=================================================
===      PRODUCT PAGE LAYOUT CORRECTION       ===
=================================================
*/

/* --- Adjusting the main grid ratio --- */
.product-layout-container {
    /* We give the info column more space (1.2fr) than the gallery (1fr) */
    grid-template-columns: 1fr 1.2fr;
}

/* --- Improving the Add to Cart box layout --- */
.product-cta-box form.cart {
    display: flex;
    flex-wrap: wrap; /* Allows items to wrap onto the next line on smaller screens */
    align-items: center;
    gap: 15px;
}

.product-cta-box .quantity {
    flex-grow: 1; /* Allows quantity input to take some space */
}

.product-cta-box .single_add_to_cart_button {
    flex-grow: 2; /* Allows the button to take more space */
}

.product-cta-box .btn-secondary {
    text-align: center;
    width: 200px;
    height: 50px;
}
.course-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
    direction: rtl;
    font-family: "IRANSans", "Tahoma", sans-serif;
}
.course-table th,
.course-table td {
    border: 1px solid #ddd;
    padding: 8px 12px;
    text-align: center;
}
.course-table th {
    background-color: #f2f2f2;
    font-weight: bold;
}
.course-outline h2 {
    font-size: 20px;
    margin-top: 30px;
    margin-bottom: 10px;
    color: #333;
}

.entry-summary,
.excerpt,
.post-excerpt {
    display: -webkit-box;
    -webkit-line-clamp: 1; /* فقط یک خط */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.hover-thumbnail-wrapper {
    position: relative;
}

.hover-thumbnail-wrapper a {
    display: block;
    position: relative;
}

.hover-thumbnail-wrapper img {
    display: block;
    width: 100%;
    height: auto;
    transition: opacity 0.3s ease-in-out;
}

.hover-thumbnail-wrapper .hover-thumbnail {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: 2;
    transition: opacity 0.3s ease-in-out;
}

.hover-thumbnail-wrapper .main-thumbnail {
    position: relative;
    z-index: 1;
    transition: opacity 0.3s ease-in-out;
}

.hover-thumbnail-wrapper:hover .hover-thumbnail {
    opacity: 1;
}

.hover-thumbnail-wrapper:hover .main-thumbnail {
    opacity: 0;
}

/* /////////////////////////////// */

.item-image-link {
    position: relative;
    display: block;
}

.item-image-link img {
    width: 100%;
    height: auto;
    display: block;
    transition: opacity 0.3s ease-in-out;
}

.item-image-link .hover-thumbnail {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: 2;
    transition: opacity 0.3s ease-in-out;
}

.item-image-link .main-thumbnail {
    position: relative;
    z-index: 1;
}

.course-card:hover .hover-thumbnail,
.archive-item-card:hover .hover-thumbnail {
    opacity: 1;
}

.course-card:hover .main-thumbnail,
.archive-item-card:hover .main-thumbnail {
    opacity: 0;
}

/* قاب تصویر کارت محصول */
.product-thumb .thumb-wrap {
    position: relative;
    display: block;
    overflow: hidden;
    aspect-ratio: 16 / 10; /* <-- مثل صفحه ایندکس: کادرها را یکدست می‌کند */
    background-color: #f8f9fa; /* <-- پس‌زمینه تمیز برای فضاهای خالی */
}

/* تصویر اصلی */
.product-thumb .thumb-wrap .img-main {
    display: block;
    width: 100%;
    height: 100%; /* <-- کلید: ارتفاع کادر والد را پر می‌کند */
    object-fit: contain; /* <-- کلید: کل تصویر را بدون برش نمایش می‌دهد */
    transition: opacity 0.25s ease, transform 0.25s ease;

    /* اینها تصویر را در کادر وسط‌چین می‌کنند */
    position: absolute;
    top: 0;
    left: 0;
}

/* تصویر هاور (ابتدا مخفی) */
.product-thumb .thumb-wrap .img-hover {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain; /* <-- اصلاح شد: این هم باید 'contain' باشد */
    opacity: 0;
    transition: opacity 0.25s ease;
    pointer-events: none;
}

/* افکت هاور: نمایش تصویر دوم */
.product-thumb:hover .thumb-wrap .img-hover {
    opacity: 1;
}

/* اگر خواستی کمی زوم ملایم روی عکس اصلی بدی */
.product-thumb:hover .thumb-wrap .img-main {
    transform: scale(1.04);
    opacity: 0.0; /* اگر می‌خوای عکس اصلی کامل محو بشه؛ می‌تونی 0.15 بذاری */
}
.simple-gallery-swiper {
    width: 300px;
    max-width: 300px; /* به دلخواه */
    margin: 0 auto;
    border-radius: 10px;
    overflow: hidden;
}
.simple-gallery-img {
    width: 300px;
    height: auto;
    object-fit: contain;
}
.swiper-button-prev,
.swiper-button-next {
    color: #333;
}
/*
=================================================
===      LOGIN & REGISTER PAGE STYLES         ===
=================================================
*/

.login-register-body {
    background-color: var(--secondary-color);
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 20px;
}

.form-container-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    max-width: 1000px;
    width: 100%;
    background: var(--light-color);
    border-radius: 15px;
    box-shadow: 0 15px 50px rgba(0,0,0,0.1);
    overflow: hidden;
}

/* --- Branding Side (Left) --- */
.branding-side {
    position: relative;
    background-size: cover;
    background-position: center;
    color: var(--light-color);
    text-align: center;
    padding: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.branding-overlay {
    position: relative;
    z-index: 2;
}
.branding-side::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to top, var(--primary-color), rgba(13, 43, 78, 0.7));
    z-index: 1;
}

.branding-logo {
    display: inline-block;
    margin-bottom: 30px;
    font-size: 2rem;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    color: var(--light-color);
    text-decoration: none;
}
.branding-side h2 {
    font-size: 2.2rem;
    margin-bottom: 15px;
}
.branding-side p {
    font-size: 1.1rem;
    line-height: 1.8;
    opacity: 0.9;
}

/* --- Form Side (Right) --- */
.form-side {
    padding: 50px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.form-tabs {
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
    background-color: #f0f2f5;
    border-radius: 30px;
    padding: 5px;
}
.tab-link {
    flex: 1;
    padding: 10px;
    border: none;
    background: transparent;
    border-radius: 30px;
    font-family: 'Vazir-regular', sans-serif;
    font-size: 1.1rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
}
.tab-link.active {
    background-color: var(--cta-color);
    color: var(--dark-text-color);
    box-shadow: 0 4px 10px rgba(255, 193, 7, 0.3);
}


.auth-form.active {
    display: block;
    animation: fadeIn 0.5s ease-in-out;
}
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.form-footer {
    text-align: center;
    margin-top: 30px;
}
.form-footer a {
    color: #777;
    text-decoration: none;
}

/* --- Responsive for Login Page --- */
@media (max-width: 992px) {
    .form-container-wrapper {
        grid-template-columns: 1fr;
    }
    .branding-side {
        display: none; /* Hide branding on mobile for a focused form experience */
    }
}

/*
=================================================
===      LOGIN & REGISTER PAGE STYLES         ===
=================================================
*/

.login-register-body {
    background-color: var(--secondary-color);
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 20px;
}

.form-container-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    max-width: 1000px;
    width: 100%;
    background: var(--light-color);
    border-radius: 15px;
    box-shadow: 0 15px 50px rgba(0,0,0,0.1);
    overflow: hidden;
}

/* --- Branding Side (Left) --- */
.branding-side {
    position: relative;
    background-size: cover;
    background-position: center;
    color: var(--light-color);
    text-align: center;
    padding: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.branding-overlay {
    position: relative;
    z-index: 2;
}
.branding-side::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to top, var(--primary-color), rgba(13, 43, 78, 0.7));
    z-index: 1;
}

.branding-logo {
    display: inline-block;
    margin-bottom: 30px;
    font-size: 2rem;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    color: var(--light-color);
    text-decoration: none;
}
.branding-side h2 {
    font-size: 2.2rem;
    margin-bottom: 15px;
}
.branding-side p {
    font-size: 1.1rem;
    line-height: 1.8;
    opacity: 0.9;
}

/* --- Form Side (Right) --- */
.form-side {
    padding: 50px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.form-tabs {
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
    background-color: #f0f2f5;
    border-radius: 30px;
    padding: 5px;
}
.tab-link {
    flex: 1;
    padding: 10px;
    border: none;
    background: transparent;
    border-radius: 30px;
    font-family: 'Vazir-regular', sans-serif;
    font-size: 1.1rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
}
.tab-link.active {
    background-color: var(--cta-color);
    color: var(--dark-text-color);
    box-shadow: 0 4px 10px rgba(255, 193, 7, 0.3);
}

.auth-form-wrapper {
    display: none;
}
.auth-form-wrapper.active {
    display: block;
    animation: fadeIn 0.5s ease-in-out;
}
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.auth-form h3 {
    text-align: center;
    font-size: 1.8rem;
    color: var(--primary-color);
    margin-bottom: 25px;
}

/* --- Error Message Styling (NEW) --- */
.auth-error {
    background-color: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
    padding: 10px 15px;
    border-radius: 8px;
    margin-bottom: 20px;
    text-align: center;
    font-size: 0.9rem;
}

.form-field {
    position: relative;
    margin-bottom: 20px;
}
.form-field input {
    width: 100%;
    padding: 12px 45px 12px 15px;
    border: 1px solid #ddd;
    border-radius: 8px;
    background: #f9f9f9;
    font-family: 'Vazir-regular', sans-serif;
    font-size: 1rem;
}
.form-field input:focus {
    outline: none;
    border-color: var(--primary-color);
}
.form-field label {
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    color: #aaa;
}

.form-options {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.9rem;
    margin-bottom: 25px;
}
.remember-me {
    display: flex;
    align-items: center;
    gap: 5px;
}
.forgot-password {
    color: var(--primary-color);
    text-decoration: none;
}

.btn-submit-auth {
    width: 100%;
    padding: 15px;
    border: none;
    border-radius: 8px;
    font-family: 'Vazir-Bold', sans-serif;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--light-color);
    background: var(--primary-color);
    cursor: pointer;
    transition: all 0.3s;
}
.btn-submit-auth:hover {
    background-color: var(--dark-text-color);
    transform: translateY(-3px);
}

.form-footer {
    text-align: center;
    margin-top: 30px;
}
.form-footer a {
    color: #777;
    text-decoration: none;
}

/* --- Responsive for Login Page --- */
@media (max-width: 992px) {
    .form-container-wrapper {
        grid-template-columns: 1fr;
    }
    .branding-side {
        display: none;
    }
}

/*
=================================================
===      WOOCOMMERCE MY ACCOUNT PAGE STYLES   ===
=================================================
*/

/* --- Main Layout Grid --- */
.my-account-grid {
    display: grid;
    grid-template-columns: 300px 1fr; /* Sidebar and main content */
    gap: 40px;
    align-items: flex-start;
}

/* --- Account Navigation Sidebar --- */
.my-account-navigation {
    background-color: var(--light-color);
    border: 1px solid #e9ecef;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 5px 25px rgba(0,0,0,0.05);
}

.my-account-navigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 250px;
}

.my-account-navigation ul li {
    margin-bottom: 5px;
}

.my-account-navigation ul li a {
    display: block;
    padding: 12px 15px;
    text-decoration: none;
    color: var(--dark-text-color);
    font-weight: 500;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.my-account-navigation ul li a:hover {
    background-color: #f0f2f5;
    color: var(--primary-color);
}

.my-account-navigation ul li.is-active > a {
    background-color: var(--primary-color);
    color: var(--light-color);
}

/* --- Account Content Area --- */
.my-account-content {
    background-color: var(--light-color);
    border: 1px solid #e9ecef;
    border-radius: 12px;
    padding: 30px;
    box-shadow: 0 5px 25px rgba(0,0,0,0.05);
}

.my-account-content p:first-child {
    margin-top: 0;
}
.my-account-content p a {
    color: var(--primary-color);
    font-weight: 500;
}

/* --- WooCommerce Tables (Orders, etc.) --- */
.woocommerce-orders-table, .woocommerce-table {
    width: 100%;
}
.woocommerce-orders-table .button {
    background-color: var(--cta-color);
    color: var(--dark-text-color);
    border-radius: 5px;
    padding: 8px 15px;
    font-family: 'Vazir-regular', sans-serif;
}

/* --- WooCommerce Forms (Address, etc.) --- */
.woocommerce-address-fields .button {
    background: var(--primary-color);
    color: var(--light-color);
    padding: 12px 25px;
    border-radius: 5px;
    font-family: 'Vazir-regular', sans-serif;
}

/* --- Responsive for Account Page --- */
@media (max-width: 992px) {
    .my-account-grid {
        grid-template-columns: 1fr; /* Stack columns */
    }
}

/*
=================================================
===      DYNAMIC USER ACTION BUTTON STYLES    ===
=================================================
*/

.user-actions {
    display: flex;
    align-items: center;
    gap: 10px; /* Creates space between buttons */
}

/* Optional: Adding an icon to the account button */
.user-actions .btn .fas {
    margin-left: 8px;
}

/* A new custom style for the logout button */
.btn-secondary-custom {
    background-color: #f0f2f5;
    color: var(--dark-text-color);
    padding: 8px 18px;
    border-radius: 5px;
    font-size: 0.9rem;
    text-decoration: none;
    transition: all 0.3s;
    border: 1px solid #ddd;
}

.btn-secondary-custom:hover {
    background-color: #e2e6ea;
    border-color: #ccc;
}
.woocommerce-account .woocommerce-MyAccount-navigation{
    float: right;
    width: 30%;!important;
}

.site-cart {
    display:inline-flex; align-items:center; gap:.4rem;
    text-decoration:none; position:relative; font-weight:600;
}
.site-cart .cart-icon { display:inline-flex; }
.site-cart .cart-count {
    min-width:1.4rem; height:1.4rem; line-height:1.4rem;
    font-size:.8rem; text-align:center; border-radius:999px;
    padding:0 .35rem; background:#f33; color:#fff; display:inline-block;
}
/*
=================================================
===      ATTRACTIVE WOOCOMMERCE CART STYLES   ===
=================================================
*/

.cart-section-v2 {
    background-color: #f9fafb;
}
/* --- Hiding the default WooCommerce title --- */
.woocommerce-cart .entry-title {
    display: none;
}

/* --- Main Layout: Items on left, Totals on right --- */
.woocommerce-cart-form {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 40px;
    align-items: flex-start;
}

/* --- Cart Items Table (Left Column) --- */
.woocommerce-cart-form .shop_table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 15px;
    background: none;
    border: none;
}

.woocommerce-cart-form .shop_table thead {
    display: none; /* We don't need the classic table header */
}

.woocommerce-cart-form .shop_table tbody tr.cart_item {
    background-color: var(--light-color);
    border-radius: 12px;
    box-shadow: 0 5px 25px rgba(0,0,0,0.07);
}

.woocommerce-cart-form .shop_table tbody td {
    padding: 20px;
    vertical-align: middle;
    border: none;
}

.woocommerce-cart-form .product-thumbnail img {
    width: 100px;
    height: 100px;
    object-fit: cover;
    border-radius: 8px;
}

.woocommerce-cart-form .product-name a {
    color: var(--dark-text-color);
    text-decoration: none;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    font-size: 1.1rem;
}

.woocommerce-cart-form .product-price,
.woocommerce-cart-form .product-subtotal {
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    font-size: 1.2rem;
    color: var(--primary-color);
}

.woocommerce-cart-form .product-quantity .quantity .input-text {
    width: 70px;
    padding: 10px;
    text-align: center;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-family: 'Vazir-regular', sans-serif;
    font-size: 1.1rem;
}

.woocommerce-cart-form .product-remove a.remove {
    color: #bbb;
    font-size: 1.5rem;
    text-decoration: none;
    display: block;
    text-align: center;
}
.woocommerce-cart-form .product-remove a.remove:hover {
    color: #d9534f;
}

.woocommerce-cart-form .actions {
    padding: 0;
}
.woocommerce-cart-form .actions .coupon {
    display: flex;
    gap: 10px;
}
.woocommerce-cart-form .actions .coupon input {
    flex-grow: 1;
}
.woocommerce-cart-form .actions .button {
    background-color: var(--dark-text-color);
    color: var(--light-color);
}


/* --- Cart Totals (Right Column) --- */
.cart-collaterals .cart_totals {
    background: var(--light-color);
    padding: 30px;
    border-radius: 12px;
    box-shadow: 0 5px 25px rgba(0,0,0,0.07);
    border: 1px solid #e9ecef;
    position: sticky;
    top: 120px;
}
.cart-collaterals .cart_totals h2 {
    font-size: 1.6rem;
    margin-bottom: 25px;
    padding-bottom: 15px;
    border-bottom: 1px solid #eee;
    color: var(--primary-color);
    text-align: center;
}
.cart-collaterals .shop_table {
    border: none;
}
.cart-collaterals .shop_table td,
.cart-collaterals .shop_table th {
    border: none;
    padding: 10px 0;
}
.cart-collaterals .order-total td,
.cart-collaterals .order-total th {
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    font-size: 1.4rem;
    padding-top: 20px;
    border-top: 2px dashed #ddd;
    color: var(--primary-color);
}

.wc-proceed-to-checkout .button.checkout-button {
    width: 100%;
    text-align: center;
    padding: 15px;
    font-size: 1.2rem;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    margin-top: 20px;
    background: linear-gradient(45deg, var(--cta-color), #ffd43b);
    border: none;
    box-shadow: 0 4px 15px rgba(255, 193, 7, 0.4);
    color: var(--dark-text-color);
}


/* --- Responsive for Cart Page --- */
@media (max-width: 992px) {
    .woocommerce-cart-form {
        grid-template-columns: 1fr; /* Stack on smaller screens */
    }
    .cart-collaterals .cart_totals {
        position: static;
        margin-top: 40px;
    }
}
.woocommerce-cart table.cart img{
    width: 300px;!important;
}
.return-to-shop{
    display: none;
}

/* === Sub-menu: 2-column dropdown (RTL friendly) === */
.main-nav .menu-item-has-children { position: relative; }

.main-nav .menu-item-has-children > .sub-menu {
    position: absolute;
    top: 100%;
    right: 0;                 /* چون RTL هستی */
    z-index: 999;
    display: grid !important; /* به‌جای flex */
    grid-template-columns: repeat(2, minmax(180px, 1fr));
    gap: 0;                   /* اگر خواستی 8px هم می‌تونی بدی */
    width: 480px;             /* پهنای باکس زیرمنو */
    max-width: 80vw;          /* که در نمایشگر کوچک بیرون نزنه */
    padding: 10px 0;
    margin: 0;
    list-style: none;
    background: var(--light-color);
    border-top: 3px solid var(--primary-color);
    border-radius: 0 0 8px 8px;
    box-shadow: 0 8px 25px rgba(0,0,0,.15);

    /* حالت پیش‌فرض مخفی */
    opacity: 0;
    visibility: hidden;
    transform: translateY(15px);
    transition: opacity .3s, transform .3s, visibility .3s;
}

/* نمایش موقع هاور روی آیتم والد */
.main-nav .menu-item-has-children:hover > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* هر آیتم توی شبکه */
.main-nav .sub-menu > li {
    width: auto;          /* از 100% خارج بشه تا شبکه درست چیده بشه */
}

/* لینک‌های آیتم‌ها */
.main-nav .sub-menu a {
    display: block;
    padding: 10px 16px;
    font-size: .95rem;
    color: var(--dark-text-color);
    text-decoration: none;
    transition: background-color .25s, color .25s, padding-right .25s;
    text-align: right;
}
.main-nav .sub-menu a:hover {
    background-color: var(--secondary-color);
    color: var(--primary-color);
    padding-right: 22px;
}

/* ریسپانسیو: در موبایل تک ستونه شود و مثل آکاردئون نمایش بده */
@media (max-width: 992px) {
    .main-nav .menu-item-has-children > .sub-menu {
        position: static;
        width: 100%;
        max-width: none;
        display: block !important; /* در موبایل یک ستون */
        box-shadow: none;
        border-top: 1px solid #e0e0e0;
        border-radius: 0;
        opacity: 1;
        visibility: visible;
        transform: none;
        padding: 0;
    }
    .main-nav .sub-menu > li { width: 100%; }
    .main-nav .sub-menu a { padding: 12px 30px; }
}
/*
=================================================
===      PRODUCT PRICE STYLES IN ARCHIVE      ===
=================================================
*/

.card-product-price {
    font-family: 'Vazir-Bold', sans-serif;
    font-size: 1.1rem;
    color: #28a745; /* رنگ سبز برای قیمت */
    font-weight: 700;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* استایل قیمت اصلی (ins) - معمولاً ووکامرس این تگ را برای قیمت جدید می‌گذارد */
.card-product-price ins {
    text-decoration: none;
    background: transparent;
    color: #28a745;
}

/* استایل قیمت خط خورده (del) - برای زمان تخفیف */
.card-product-price del {
    color: #999;
    font-size: 0.9rem;
    opacity: 0.8;
    font-weight: 400;
}

/* جهت اطمینان از چیدمان راست‌چین در فارسی */
.woocommerce-Price-amount {
    direction: ltr; /* برای اینکه اعداد و واحد پولی درست کنار هم قرار بگیرند */
    display: inline-block;
}

/*
=================================================
===      MODERN HERO GRID STYLES              ===
=================================================
*/

.hero-section-modern {
    padding: 30px 0; /* فاصله از بالا و پایین */
    background-color: #fff;
}

/* شبکه اصلی */
.hero-grid-layout {
    display: grid;
    /* قبلاً 2.5fr 1fr بود. الان 1.5 به 1 می‌کنیم تا کناری جا باز کند */
    /*grid-template-columns: 2.5fr 1fr !important;*/
    gap: 20px;
    height: 380px; /* ارتفاع کلی بخش هیرو */
}

/* 2. استایل کارت‌های کناری (افقی: عکس چپ، متن راست) */
.side-promo-card-horizontal {
    display: flex;
    flex-direction: row; /* چیدمان افقی */
    background: #fff;
    border-radius: 15px;
    overflow: hidden;
    flex: 1; /* ارتفاع برابر برای هر دو کارت در کانتینر فلکس */
    min-height: 0; /* جلوگیری از مشکل اورفلو در برخی مرورگرها */
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    border: 1px solid #eee;
    transition: transform 0.3s;
    text-decoration: none;
}

.side-promo-card-horizontal:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
}
/* 3. بخش تصویر (سمت چپ) */
.side-card-img {
    width: 45%; /* 40 درصد عرض برای عکس */
    position: relative;
    overflow: hidden;
}
.side-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* پر کردن کامل قاب */
    transition: transform 0.5s;
}

.side-promo-card-horizontal:hover .side-card-img img {
    transform: scale(1.1); /* زوم هنگام هاور */
}

/* 4. بخش متن (سمت راست) */
.side-card-content {
    width: 55%; /* 60 درصد عرض برای متن */
    padding: 10px 15px;
    display: flex;
    flex-direction: column;
    justify-content: center; /* وسط‌چین عمودی */
    text-align: right;

}

.side-card-badge {
    display: inline-block;
    background: rgba(255, 193, 7, 0.15);
    color: var(--cta-color);
    font-size: 0.75rem;
    padding: 2px 8px;
    border-radius: 10px;
    margin-bottom: 5px;
    align-self: flex-start;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
}

.side-card-price {
    font-size: 1rem;
    color: #28a745;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    height: 176px;
}

.side-card-title {
    font-size: 0.95rem;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    color: var(--primary-color);
    margin-bottom: 5px;
    line-height: 1.3;
}

/* --- استایل ستون اسلایدر --- */
.hero-main-slider-area {
    width: 100%;
    height: 100%;
    border-radius: 15px;
    overflow: hidden;
    position: relative;
}

/* تنظیم اسلایدر برای پر کردن ستون */
.hero-background-slider {
    width: 100%;
    height: 100%;
}
.hero-background-slider .swiper-slide {
    background-size: cover;
    background-position: center;
}

/* --- استایل ستون بنرهای کناری --- */
.hero-side-banners-area {
    display: flex;
    flex-direction: column;
    gap: 20px;
    height: 100%;
}

.side-banner-item {
    display: block;
    flex: 1; /* هر بنر دقیقاً نصف ارتفاع را می‌گیرد */
    border-radius: 15px;
    overflow: hidden;
    position: relative;
}

.side-banner-item img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* تصویر کامل کادر را پر می‌کند */
    transition: transform 0.3s ease;
}

.side-banner-item:hover img {
    transform: scale(1.05); /* افکت زوم هنگام هاور */
}

/* --- ریسپانسیو (موبایل و تبلت) --- */
@media (max-width: 992px) {
    .hero-grid-layout {
        grid-template-columns: 2.5fr 1fr !important;
        height: 380px;
    }

    .hero-main-slider-area {
        height: 350px; /* ارتفاع اسلایدر در موبایل */
    }
    /* در موبایل هم افقی بماند ولی ارتفاعش کمتر شود */
    .side-promo-card-horizontal {
        height: 140px;
    }

    .side-card-content {
        padding: 10px 15px;
        justify-content: center !important;

    }

    .side-card-title {
        font-size: 0.95rem;
        margin-bottom: 5px !important;
        line-height: 1.3 !important;
    }

    .side-card-badge {
        margin-bottom: 5px !important;
        padding: 2px 8px !important;
    }

    /* تنظیم تصویر بنر کناری */
    .side-card-img {
        width: 45% !important; /* سهم عکس کمی بیشتر شود تا در عرض کم دفرمه نشود */
    }
    .side-card-content {
        width: 55% !important;
    }

    .hero-side-banners-area {
        flex-direction: row; /* بنرها کنار هم قرار بگیرند */
        height: 200px;
    }
}

@media (max-width: 576px) {
    .hero-main-slider-area {
        height: 300px;
    }
    .hero-side-banners-area {
        flex-direction: column; /* بنرها زیر هم */
        height: auto;
    }
    .side-banner-item {
        height: 150px;
    }
}

/*
=================================================
===    COMPANY ACTIVITIES SECTION STYLES      ===
=================================================
*/

.company-activities-section {
    padding: 80px 0;
    background-color: #fff;
    border-top: 1px solid #eee;
}

.section-header-center {
    text-align: center;
    margin-bottom: 50px;
}

.activities-sub-title {
    text-align: center;
    font-size: 1.8rem;
    color: var(--primary-color);
    margin: 60px 0 30px;
    position: relative;
    padding-bottom: 15px;
}
.activities-sub-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 50px;
    height: 3px;
    background-color: var(--cta-color);
}

/* --- 1. Stats Grid --- */
.activities-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    margin-bottom: 50px;
}

.stat-box {
    background: var(--primary-color);
    color: #fff;
    padding: 30px 20px;
    border-radius: 12px;
    text-align: center;
    box-shadow: 0 10px 30px rgba(13, 43, 78, 0.15);
    transition: transform 0.3s ease;
}
.stat-box:hover {
    transform: translateY(-10px);
    background: #153e6e; /* کمی روشن‌تر هنگام هاور */
}

.stat-icon {
    font-size: 2.5rem;
    color: var(--cta-color);
    margin-bottom: 15px;
}

.stat-number {
    display: block;
    font-size: 2.5rem;
    font-weight: 800;
    margin-bottom: 5px;
}

.stat-label {
    font-size: 1rem;
    opacity: 0.9;
}

/* --- 2. Partners Grid --- */
.partners-grid-boxes {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 20px;
}

.partner-box {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    padding: 20px;
    border-radius: 8px;
    text-align: center;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    color: #555;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100px;
    transition: all 0.3s;
}
.partner-box:hover {
    background: #fff;
    border-color: var(--cta-color);
    color: var(--primary-color);
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

/* --- 3. Gallery Slider --- */
.activity-gallery-slider {
    padding: 10px 10px 50px 10px; /* فضای پایین برای Pagination */
}

.gallery-card {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08);
    border: 1px solid #eee;
}

.gallery-card img {
    width: 100%;
    height: 250px;
    object-fit: cover;
    display: block;
}

.gallery-caption {
    padding: 20px;
    text-align: right;
}

.gallery-caption h4 {
    color: var(--primary-color);
    margin-bottom: 10px;
    font-size: 1.1rem;
}

.gallery-caption p {
    color: #666;
    font-size: 0.9rem;
    margin: 0;
}

/* --- Responsive --- */
@media (max-width: 992px) {
    .activities-stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .activities-stats-grid {
        grid-template-columns: 1fr;
    }
}
/* ========================================
   MOBILE HEADER & DRAWER STYLES
========================================
*/

/* --- مخفی کردن هدر موبایل در دسکتاپ --- */
.mobile-header-view {
    display: none;
}

/* --- استایل منوی موبایل (وقتی صفحه کوچک می‌شود) --- */
@media (max-width: 992px) {

    /* مخفی کردن هدر دسکتاپ */
    .desktop-header-view {
        display: none;
    }

    /* نمایش هدر موبایل */
    .mobile-header-view {
        display: block;
        background: #fff;
        box-shadow: 0 2px 10px rgba(0,0,0,0.05);
        padding: 10px 0;
        position: relative;
        z-index: 100;
    }

    .mobile-container-flex {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .mobile-logo img {
        height: 50px;
        width: auto;
    }

    .mobile-left-actions {
        display: flex;
        align-items: center;
        gap: 15px;
    }

    /* آیکون همبرگری */
    .mobile-hamburger {
        width: 30px;
        height: 22px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        cursor: pointer;
    }
    .mobile-hamburger span {
        display: block;
        width: 100%;
        height: 3px;
        background: var(--primary-color);
        border-radius: 3px;
    }

    /* آیکون سبد خرید موبایل */
    .mobile-cart {
        color: var(--primary-color);
        font-size: 1.2rem;
        position: relative;
        text-decoration: none;
    }
    .mobile-cart .cart-count {
        position: absolute;
        top: -8px;
        right: -8px;
        background: red;
        color: white;
        font-size: 0.7rem;
        width: 16px;
        height: 16px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
}

/* --- Mobile Drawer (منوی کشویی) --- */
.mobile-menu-drawer {
    position: fixed;
    top: 0;
    right: -320px; /* خارج از صفحه */
    width: 300px;
    height: 100vh;
    background: #fff;
    z-index: 9999;
    box-shadow: -5px 0 20px rgba(0,0,0,0.1);
    transition: right 0.3s cubic-bezier(0.77, 0.2, 0.05, 1.0);
    display: flex;
    flex-direction: column;
}

.mobile-menu-drawer.is-open {
    right: 0; /* باز شدن */
}

.mobile-menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    z-index: 9998;
    display: none;
    opacity: 0;
    transition: opacity 0.3s;
}
.mobile-menu-overlay.is-active {
    display: block;
    opacity: 1;
}

/* دکمه بستن */
.close-mobile-menu {
    align-self: flex-end;
    background: none;
    border: none;
    font-size: 2rem;
    padding: 10px 20px;
    cursor: pointer;
    color: #555;
}

/* سرچ باکس موبایل */
.mobile-search-box {
    padding: 0 20px 20px;
    border-bottom: 1px solid #eee;
}
.mobile-search-box form {
    display: flex;
    border: 1px solid #ddd;
    border-radius: 8px;
    overflow: hidden;
}
.mobile-search-box input {
    flex-grow: 1;
    border: none;
    padding: 10px;
    font-family: inherit;
}
.mobile-search-box button {
    background: var(--primary-color);
    color: #fff;
    border: none;
    padding: 0 15px;
}

/* اسکرول لیست منو */
.mobile-scroll-area {
    overflow-y: auto;
    flex-grow: 1;
    padding: 20px;
}

/* لیست منو */
.mobile-menu-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.mobile-menu-list li {
    border-bottom: 1px solid #f9f9f9;
}
.mobile-menu-list li a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0;
    text-decoration: none;
    color: #333;
    font-weight: 500;
    font-size: 1rem;
}

/* آیکون فلش برای منوهای دارای فرزند */
.mobile-menu-list .menu-item-has-children > a::after {
    content: '+';
    font-size: 1.2rem;
    color: #999;
    transition: transform 0.3s;
}
.mobile-menu-list .menu-item-has-children.submenu-open > a::after {
    content: '-';
    color: var(--primary-color);
}

/* زیر منو (پیش‌فرض مخفی) */
.mobile-menu-list .sub-menu {
    display: none;
    list-style: none;
    padding: 0;
    margin: 0;
    background: #f8f9fa;
    border-radius: 8px;
}
.mobile-menu-list .sub-menu li {
    border-bottom: 1px solid #eee;
}
.mobile-menu-list .sub-menu li:last-child {
    border-bottom: none;
}
.mobile-menu-list .sub-menu li a {
    padding: 10px 15px;
    font-size: 0.9rem;
    color: #666;
}

/* دکمه ورود موبایل */
.mobile-user-actions {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid #eee;
}
.btn-mobile-auth {
    display: block;
    text-align: center;
    background: var(--primary-color);
    color: #fff;
    padding: 10px;
    border-radius: 8px;
    text-decoration: none;
}
/*
=================================================
===   FIX FOR FAINT/OVERLAYED PROJECTS SECTION ===
=================================================
*/

/* 1. اطمینان از شفافیت کامل عکس */
.project-image-col img {
    opacity: 1 !important;        /* اطمینان از عدم شفافیت */
    filter: none !important;      /* حذف هر گونه فیلتر (مثلا grayscale یا blur) */
}

/* 2. اطمینان از عدم شفافیت روی کل کادر یا متن */
.project-row,
.project-row-reverse,
.project-card, /* اگر کارتی در این بخش هست */
.project-content-col,
.project-content-col h3,
.project-content-col p,
.project-category,
.btn-project {
    opacity: 1 !important;        /* اطمینان از عدم شفافیت روی کل بخش */
    filter: none !important;      /* حذف هر گونه فیلتر */
}
/*
=================================================
===   MOBILE FIX FOR STATS (COMPACT GRID)     ===
=================================================
*/

@media (max-width: 768px) {

    /* 1. تبدیل چیدمان به 2 ستون (2 در 2) */
    .activities-stats-grid {
        grid-template-columns: repeat(2, 1fr) !important; /* دو ستون کنار هم */
        gap: 10px !important; /* فاصله بین باکس‌ها کمتر شود */
        margin-bottom: 30px !important;
    }

    /* 2. کوچک کردن خود باکس */
    .stat-box {
        padding: 15px 5px !important; /* پدینگ خیلی کمتر */
        min-height: auto !important;
    }

    /* 3. کوچک کردن آیکون */
    .stat-icon {
        font-size: 1.5rem !important; /* سایز آیکون نصف شود */
        margin-bottom: 8px !important;
    }

    /* 4. کوچک کردن عدد (300+) */
    .stat-number {
        font-size: 1.3rem !important;
        font-weight: 700 !important;
        font-family: 'Vazir-Bold', sans-serif;
        margin-bottom: 2px !important;
    }

    /* 5. کوچک کردن متن توضیحات */
    .stat-label {
        font-size: 0.75rem !important; /* فونت ریز و خوانا */
        line-height: 1.2 !important;
        display: block;
    }
    /* 1. تبدیل لیست به 2 ستون کنار هم */
    .partners-grid-boxes {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important; /* دو ستون */
        gap: 8px !important; /* فاصله بین باکس‌ها خیلی کم شود */
    }

    /* 2. استایل باکس‌ها (کوچک و ظریف) */
    .partner-box {
        padding: 10px 5px !important;   /* فضای داخلی کم */
        min-height: 60px !important;    /* ارتفاع باکس کم شود */
        font-size: 0.75rem !important;  /* فونت ریزتر */
        line-height: 1.3 !important;    /* فاصله خطوط کمتر */
        border-radius: 6px !important;  /* گردی گوشه‌ها کمتر */

        /* ترازبندی دقیق متن در وسط */
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    /* 1. تبدیل لیست عمودی به شبکه 2 ستونه */
    .stats-grid {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important; /* دو ستون کنار هم */
        gap: 15px !important; /* فاصله بین کارت‌ها */
        margin-top: 30px;
    }

    /* 2. استایل هر کارت */
    .stat-item {
        padding: 15px 5px !important; /* کاهش فضای داخلی */
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        min-height: 100px; /* ارتفاع یکسان */
    }

    /* 3. تنظیم سایز اعداد بزرگ (+15, +200) */
    .stat-item .stat-number {
        font-size: 1.6rem !important; /* کوچک‌تر کردن فونت */
        font-weight: 800;
        margin-bottom: 5px;
    }

    /* 4. تنظیم سایز آیکون (برای آیتم آخر) */
    .stat-item i {
        font-size: 1.6rem !important; /* هم‌اندازه با اعداد */
        margin-bottom: 5px;
        display: block;
    }

    /* 5. تنظیم متن توضیحات (سال تجربه و...) */
    .stat-item .stat-label {
        font-size: 0.8rem !important; /* فونت ریز و خوانا */
        line-height: 1.3;
    }
    /* 1. تغییر ساختار گرید به بلاک ساده */
    .news-layout-grid-v2 {
        display: block !important;
        position: relative;
        padding-bottom: 60px; /* فضای خالی پایین برای دکمه‌ها */
    }

    /* 2. مخفی کردن ستون‌های کناری (چون باعث شلوغی می‌شوند) */
    /* نگران نباشید، چون اسلایدر می‌چرخد، همه پست‌ها در کارت اصلی نمایش داده می‌شوند */
    .regular-articles-column {
        display: none !important;
    }

    /* 3. تنظیم کارت اصلی (ویژه) */
    .featured-article-column {
        width: 100% !important;
        margin: 0 !important;
    }

    .article-card-large {
        box-shadow: 0 5px 15px rgba(0,0,0,0.05) !important; /* سایه سبک‌تر */
        border: 1px solid #eee;
    }

    /* تنظیم تصویر کارت اصلی */
    .article-image-link-large img {
        height: 220px !important; /* ارتفاع فیکس برای عکس */
        object-fit: cover;
    }

    /* تنظیم محتوای متنی */
    .article-content {
        padding: 20px !important;
        text-align: center; /* وسط چین کردن متن در موبایل زیباتر است */
    }

    .article-meta {
        justify-content: center; /* وسط چین کردن تاریخ و دسته */
    }

    .article-title-large a {
        font-size: 1.3rem !important; /* کوچک کردن تیتر */
    }

    .article-excerpt {
        font-size: 0.9rem !important;
        text-align: justify; /* متن پاراگراف مرتب باشد */
    }

    /* 4. جابجایی دکمه‌های ناوبری به زیر کارت */
    /* قبلاً وسط صفحه بودند، الان می‌آوریم پایین کارت */
    .news-rotator-nav {
        top: auto !important;
        bottom: 0 !important;
        transform: none !important;
        background-color: #fff !important;
        border: 1px solid var(--primary-color) !important;
        color: var(--primary-color) !important;
    }

    /* دکمه بعدی (سمت چپ) */
    .news-rotator-nav.next {
        left: 35% !important; /* تنظیم موقعیت */
    }

    /* دکمه قبلی (سمت راست) */
    .news-rotator-nav.prev {
        right: 35% !important; /* تنظیم موقعیت */
    }

    /* فاصله دکمه‌ها از هم */
    .news-rotator-nav:hover {
        background-color: var(--primary-color) !important;
        color: #fff !important;
    }
    .license-slider .swiper-slide img {
        height: 250px !important; /* در موبایل کمی کوچک‌تر شود */
    }

    .license-slider .swiper-slide a {
        max-width: 230px;
        padding: 12px;
    }

    .license-slider .swiper-slide-prev a,
    .license-slider .swiper-slide-duplicate-prev a {
        transform: perspective(1000px) rotateY(12deg) translateX(4px) scale(0.9);
    }

    .license-slider .swiper-slide-next a,
    .license-slider .swiper-slide-duplicate-next a {
        transform: perspective(1000px) rotateY(-12deg) translateX(-4px) scale(0.9);
    }

    /* مخفی کردن فلش‌های کناری در موبایل برای تمیزی */
    .license-slider .swiper-button-next,
    .license-slider .swiper-button-prev {
        display: none;
    }

    /* 1. تنظیم کادر اصلی */
    .partners-side {
        text-align: center !important; /* وسط‌چین کردن تیتر */
        padding-bottom: 30px;
    }

    .section-title-left {
        text-align: center !important;
        font-size: 1.4rem !important;
        margin-bottom: 20px !important;
    }

    /* 2. تنظیم نگهدارنده لوگوها (Flex Container) */
    .partners-logo-grid-compact .partner-logo {
        display: flex !important;
        flex-wrap: wrap !important; /* اجازه می‌دهد لوگوها به خط بعد بروند */
        justify-content: center !important; /* وسط‌چین در صفحه */
        gap: 15px !important; /* فاصله بین لوگوها */
    }

    /* 3. تنظیم هر آیتم لینک (قاب لوگو) */
    .partners-logo-grid-compact .partner-logo a {
        display: flex !important;
        align-items: center;
        justify-content: center;

        /* تنظیم عرض: 30% یعنی 3 تا در یک ردیف (حدودی) */
        /* اگر بخواهید 2 تا باشند، این را 45% کنید */
        flex: 0 0 30% !important;

        background-color: #fff; /* یک زمینه سفید تمیز */
        border-radius: 10px;
        padding: 10px !important;
        box-shadow: 0 3px 10px rgba(0,0,0,0.05); /* سایه نرم */
        border: 1px solid #f0f0f0;
    }

    /* 4. تنظیم خود عکس لوگو */
    .partners-logo-grid-compact .partner-logo img {
        width: 100% !important; /* عرض تصویر */
        height: auto !important;
        max-height: 60px !important; /* حداکثر ارتفاع (مهم: لوگو را کوچک نگه می‌دارد) */
        object-fit: contain !important; /* کل لوگو دیده شود و بریده نشود */
        filter: grayscale(0%) !important; /* در موبایل همیشه رنگی باشد (اختیاری) */
        opacity: 1 !important;
    }

}
/*
=================================================
===   MOBILE FIX FOR SINGLE PRODUCT PAGE      ===
=================================================
*/

@media (max-width: 992px) {

    /* 1. تک ستونه کردن ساختار اصلی */
    /* اگر از کلاس‌های استاندارد ووکامرس استفاده شده باشد */
    .woocommerce div.product .woocommerce-product-gallery,
    .woocommerce div.product .summary.entry-summary {
        width: 100% !important;
        float: none !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
    }

    /* اگر از کلاس اختصاصی خودمان (product-layout-container) استفاده شده باشد */
    .product-layout-container {
        display: block !important; /* گرید را غیرفعال می‌کنیم */
        padding: 20px !important;
    }

    .product-gallery-column,
    .product-info-column {
        width: 100% !important;
        margin-bottom: 30px !important;
    }

    /* 2. اصلاح گالری تصاویر */
    .woocommerce-product-gallery__image img {
        height: auto !important;
        width: 100% !important;
    }

    /* 3. اصلاح تب‌ها (Tabs) */
    /* تب‌ها را در موبایل زیر هم می‌چینیم تا جای بیشتری داشته باشند */
    .woocommerce-tabs ul.tabs {
        display: flex !important;
        flex-direction: column !important;
        padding: 0 !important;
        margin: 0 0 20px !important;
    }

    .woocommerce-tabs ul.tabs li {
        width: 100% !important;
        margin: 0 0 5px !important;
        border: 1px solid #eee !important;
        border-radius: 8px !important;
        background-color: #f9f9f9 !important;
    }

    .woocommerce-tabs ul.tabs li.active {
        background-color: var(--primary-color) !important;
        color: #fff !important;
    }

    .woocommerce-tabs .panel {
        padding: 15px !important; /* پدینگ کمتر برای محتوا */
        border: 1px solid #eee;
        border-radius: 8px;
    }

    /* 4. محصولات مرتبط (Related Products) */
    /* تبدیل به شبکه 2 ستونه */
    .related.products ul.products {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 15px !important;
    }

    .related.products ul.products li.product {
        width: 100% !important; /* حذف عرض‌های درصدی پیش‌فرض ووکامرس */
        margin: 0 !important;
    }

    /* 1. ثابت کردن هدر در بالای صفحه */
    .mobile-header-view {
        position: fixed !important; /* چسباندن به صفحه */
        top: 0;
        left: 0;
        width: 100%;
        z-index: 9990; /* لایه بالاتر از همه محتوا */
        box-shadow: 0 2px 15px rgba(0,0,0,0.1); /* سایه برای تفکیک از محتوا */
    }

    /* 2. ایجاد فضای خالی بالای صفحه */
    /* چون هدر شناور می‌شود، محتوا می‌رود زیر آن. این کد محتوا را هل می‌دهد پایین */
    body {
        padding-top: 75px; /* این عدد باید تقریباً هم‌اندازه ارتفاع هدر موبایل باشد */
    }

    /* 3. اگر ادمین بار وردپرس (نوار سیاه بالا) هست، هدر را پایین‌تر بیاور */
    body.admin-bar .mobile-header-view {
        /*top: 32px;*/
    }

    /* 4. تنظیم منوی کشویی که زیر هدر نیفتد */
    .mobile-menu-drawer {
        z-index: 9999 !important; /* منو باید روی هدر بیفتد */
    }

    /* تنظیم ماسک سیاه پشت منو */
    .mobile-menu-overlay {
        z-index: 9995 !important;
    }

    /* تنظیم فاصله بین آیتم‌های سمت چپ (زبان، سبد، منو) */
    .mobile-left-actions {
        gap: 12px !important; /* فاصله کمتر برای جا شدن همه */
    }

    /* استایل لیست زبان‌ها */
    .mobile-lang-switcher ul {
        display: flex;
        list-style: none;
        padding: 0;
        margin: 0;
        gap: 8px;
        align-items: center;
    }

    .mobile-lang-switcher li {
        display: inline-block;
        line-height: 1;
    }

    /* لینک زبان (EN / FA) */
    .mobile-lang-switcher a {
        text-decoration: none;
        color: #555;
        font-size: 0.85rem;
        font-weight: 700;
        font-family: 'Vazir-Bold', sans-serif;
        text-transform: uppercase;
        transition: color 0.3s;
    }

    /* رنگ زبان فعال */
    .mobile-lang-switcher .current-lang a {
        color: var(--primary-color);
    }

    /* جداکننده بین زبان‌ها (خط عمودی | ) */
    .mobile-lang-switcher li:not(:last-child)::after {
        content: '|';
        margin-left: 8px; /* در فارسی margin-right و در انگلیسی margin-left */
        color: #ccc;
        font-weight: 400;
    }

    /* تنظیم سبد خرید */
    .mobile-cart {
        margin-right: 5px;
    }
}
/*
=================================================
===      MODERN CATEGORY ARCHIVE STYLES       ===
=================================================
*/

.page-content-archive {
    background-color: #fdfdfd;
}

/* --- 1. استایل هدر (Hero) --- */
.archive-hero-modern {
    /* پس‌زمینه گرادینت سرمه‌ای */
    background: linear-gradient(135deg, #3a6ea5 0%, #659bc9 100%) !important;    padding: 60px 0;
    color: #fff;
    position: relative;
    overflow: hidden;
    margin-bottom: 60px;
    border-radius: 0 0 40px 40px; /* گوشه‌های گرد پایین */
    box-shadow: 0 15px 40px rgba(58, 110, 165, 0.25) !important;}

.hero-archive-grid {
    display: grid;
    /* ستون اول (متن) بزرگتر، ستون دوم (عکس) کمی کوچکتر */
    grid-template-columns: 1.2fr 0.8fr;
    align-items: center;
    gap: 60px;
}

/* --- متن و توضیحات (سمت راست) --- */
.hero-archive-content {
    position: relative;
    z-index: 2;
}

.archive-title {
    font-size: 2.8rem;
    font-weight: 800;
    margin-bottom: 20px;
    line-height: 1.3;
}

.archive-description {
    font-size: 1.1rem;
    line-height: 1.9;
    color: rgba(255,255,255,0.9); /* سفید کمی شفاف */
    margin-bottom: 30px;
    text-align: justify;
}

.archive-meta span {
    background: rgba(255, 255, 255, 0.2) !important;    padding: 8px 20px;
    border-radius: 30px;
    font-size: 0.95rem;
    border-color: rgba(255, 255, 255, 0.3) !important;
    display: inline-flex;
    align-items: center;
    gap: 10px;

}

/* --- تصویر (سمت چپ) --- */
.hero-archive-image {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: center;
}

.image-wrapper-3d img {
    width: 100%;
    max-width: 400px; /* محدود کردن عرض عکس */
    height: auto;
    border-radius: 20px;
    /* افکت سایه و زاویه جذاب */
    box-shadow: -20px 20px 50px rgba(0,0,0,0.3);
    transform: perspective(1000px) rotateY(10deg) rotateX(5deg);
    transition: transform 0.5s ease;
    border-color: rgba(255, 255, 255, 0.2) !important;}

.image-wrapper-3d:hover img {
    transform: perspective(1000px) rotateY(0deg) rotateX(0deg) scale(1.02);
}

/* المان‌های تزئینی پشت عکس */
.deco-circle {
    position: absolute;
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, var(--cta-color) 0%, transparent 70%);
    opacity: 0.2;
    top: -50px;
    left: -50px;
    z-index: -1;
    filter: blur(50px);
}

/* --- 2. لیست محصولات --- */
.section-header-simple {
    margin-bottom: 40px;
}
.section-header-simple h2 {
    font-size: 1.8rem;
    color: var(--primary-color);
    margin-bottom: 15px;
}
.divider-line {
    width: 70px;
    height: 4px;
    background: var(--cta-color);
    border-radius: 2px;
}

/* --- ریسپانسیو (موبایل) --- */
@media (max-width: 992px) {
    .archive-hero-modern {
        padding: 40px 0;
        text-align: center;
        border-radius: 0 0 25px 25px;
    }

    .hero-archive-grid {
        grid-template-columns: 1fr; /* تک ستونه شدن */
        gap: 40px;
    }

    /* عکس برود بالای متن در موبایل (استانداردتر است) */
    .hero-archive-image {
        order: -1;
    }

    .image-wrapper-3d img {
        transform: none; /* حذف چرخش سه بعدی در موبایل */
        max-width: 80%;
    }

    .archive-description {
        text-align: center;
    }
}

/*
=================================================
===      DYNAMIC TRUST SLIDER STYLES          ===
=================================================
*/

.trust-slider-section {
    padding: 80px 0;
    background-color: #fdfdfd; /* یک پس‌زمینه خیلی روشن */
}

.trust-slider {
    padding-bottom: 50px; /* جا برای دکمه‌های پایین */
}

/* چیدمان اسلاید (راست متن - چپ عکس) */
.trust-slide-grid {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr; /* متن کمی عریض‌تر */
    gap: 50px;
    align-items: center;
    background: #fff;
    padding: 40px;
    border-radius: 20px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.05); /* سایه نرم */
    border: 1px solid #eee;
}

/* ستون متن */
.trust-content-col {
    text-align: right;
}

.trust-item-title {
    font-size: 1.8rem;
    color: var(--primary-color);
    margin-bottom: 20px;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
}

.trust-item-desc {
    font-size: 1.05rem;
    line-height: 1.9;
    color: #555;
    margin-bottom: 30px;
    text-align: justify;
}

.btn-text-arrow {
    color: var(--cta-color);
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.3s;
}
.btn-text-arrow:hover {
    gap: 12px; /* حرکت فلش هنگام هاور */
    color: var(--primary-color);
}

/* ستون تصویر */
.trust-image-col img {
    width: 100%;
    height: 350px; /* ارتفاع ثابت برای یکدستی */
    object-fit: cover;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

/* --- ریسپانسیو (موبایل) --- */
@media (max-width: 992px) {
    .trust-slide-grid {
        grid-template-columns: 1fr; /* تک ستونه */
        gap: 30px;
        padding: 25px;
        text-align: center;
    }

    .trust-content-col {
        text-align: center;
        order: 2; /* متن برود پایین */
    }

    .trust-image-col {
        order: 1; /* عکس بیاید بالا */
    }

    .trust-image-col img {
        height: 250px; /* ارتفاع کمتر در موبایل */
    }

    .trust-item-desc {
        text-align: center; /* متن وسط‌چین در موبایل */
        font-size: 0.95rem;
    }
}

/*
=================================================
===      CREATIVE PROMO CARDS STYLES          ===
=================================================
*/

.creative-promo-section {
    padding: 80px 0;
    background-color: #f4f6f9; /* پس زمینه متفاوت */
}

.creative-promo-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 3 ستون */
    gap: 30px;
}

/* --- استایل کارت اصلی --- */
.creative-card {
    position: relative;
    height: 400px; /* ارتفاع بلند و بنری */
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 15px 35px rgba(0,0,0,0.1);
    transition: all 0.4s ease;
    background-color: #000; /* رنگ پشت عکس */
}

.creative-card:hover {
    transform: translateY(-10px); /* بالا آمدن کارت */
    box-shadow: 0 25px 50px rgba(13, 43, 78, 0.25);
}

/* لینک نامرئی روی کل کارت */
.card-link-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    z-index: 5;
}

/* --- تصویر پس‌زمینه --- */
.card-bg-image {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background-size: cover;
    background-position: center;
    transition: transform 0.6s ease;
    opacity: 0.85;
}

.creative-card:hover .card-bg-image {
    transform: scale(1.1); /* زوم شدن عکس */
    opacity: 1;
}

/* --- گرادینت روی عکس (برای خوانایی متن) --- */
.card-overlay-gradient {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to top, rgba(13, 43, 78, 0.9) 0%, rgba(13, 43, 78, 0.14) 50%, transparent 100%);
    transition: opacity 0.3s;
}

/* --- نشان ویژه (Badge) --- */
.card-badge {
    position: absolute;
    top: 20px;
    right: 20px;
    background-color: var(--cta-color);
    color: var(--dark-text-color);
    padding: 5px 15px;
    border-radius: 20px;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    font-size: 0.85rem;
    z-index: 2;
    box-shadow: 0 5px 15px rgba(255, 193, 7, 0.4);
}

/* --- محتوای کارت --- */
.card-details {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 30px;
    z-index: 3;
    color: #fff;
}

.card-category {
    display: block;
    font-size: 0.85rem;
    color: var(--cta-color);
    margin-bottom: 8px;
    text-transform: uppercase;
    opacity: 0.9;
}
.card-category a { color: inherit; text-decoration: none; }

.card-title {
    font-size: 1.5rem;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    margin: 0 0 10px 0;
    line-height: 1.4;
    color: #242424;
    /*text-shadow: 0 2px 10px rgba(0,0,0,0.5);*/
}

.sidecard-title{
    font-size: 1.5rem;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    margin: 0 0 10px 0;
    line-height: 1.4;
    color: #fff;
    text-shadow: 0 2px 10px rgba(0,0,0,0.5);
}

/* --- اطلاعات مخفی (که با هاور می آید) --- */
.card-hidden-info {
    max-height: 0; /* در حالت عادی مخفی */
    opacity: 0;
    overflow: hidden;
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1);
    transform: translateY(20px);
}

.creative-card:hover .card-hidden-info {
    max-height: 100px; /* باز شدن */
    opacity: 1;
    transform: translateY(0);
    margin-top: 15px;
}

.card-price {
    font-size: 1.2rem;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    color: #fff;
    margin-bottom: 15px;
}
.card-price del { color: rgba(255,255,255,0.6); font-size: 0.9rem; margin-left: 5px; }
.card-price ins { text-decoration: none; color: var(--cta-color); }

.btn-creative {
    display: inline-block;
    background: rgba(255,255,255,0.2);
    color: #fff;
    padding: 8px 20px;
    border-radius: 30px;
    font-size: 0.9rem;
    backdrop-filter: blur(5px);
    border: 1px solid rgba(255,255,255,0.3);
    transition: all 0.3s;
}
.creative-card:hover .btn-creative {
    background: var(--cta-color);
    color: var(--dark-text-color);
    border-color: var(--cta-color);
}

/* --- ریسپانسیو (موبایل) --- */
@media (max-width: 992px) {
    .creative-promo-grid {
        grid-template-columns: repeat(2, 1fr); /* تبلت */
    }
}

@media (max-width: 768px) {
    .creative-promo-grid {
        grid-template-columns: 1fr; /* موبایل تک ستون */
        gap: 20px;
    }

    .creative-card {
        height: 350px; /* ارتفاع کمتر در موبایل */
    }

    /* در موبایل، اطلاعات همیشه نمایش داده شود (چون هاور نداریم) */
    .card-hidden-info {
        max-height: 100px;
        opacity: 1;
        transform: translateY(0);
        margin-top: 10px;
    }
}

/*
=================================================
===   HERO SIDE CREATIVE CARDS STYLES         ===
=================================================
*/

/* تنظیم کارت‌ها در حالت سایدبار */
.creative-card.side-mode {
    flex: 1; /* پر کردن فضای خالی ستون به طور مساوی */
    height: auto !important; /* ارتفاع را از فلکس بگیرد */
    min-height: 0; /* جلوگیری از سرریز در فایرفاکس */
    border-radius: 15px;
    margin-bottom: 0; /* حذف فاصله اضافه چون گپ گرید داریم */
}

/* کوچک کردن فونت عنوان در سایدبار */
.card-title.side-title {
    font-size: 1.1rem;
    margin-bottom: 5px;
}

/* کوچک کردن قیمت */
.card-price.side-price {
    font-size: 1rem;
    margin-bottom: 8px;
}

/* دکمه کوچک‌تر */
.btn-creative.btn-sm {
    padding: 5px 15px;
    font-size: 0.8rem;
}

/* بج کوچک‌تر */
.card-badge.small {
    padding: 3px 10px;
    font-size: 0.7rem;
    top: 15px;
    right: 15px;
}

/* در موبایل، ارتفاع کارت‌ها را فیکس کنیم چون فلکس عمودی نیست */
@media (max-width: 992px) {
    .creative-card.side-mode {
        min-height: 180px; /* ارتفاع مناسب برای موبایل */
        width: 100%;
    }
}

/*
=================================================
===   SIDE FADE SLIDER STYLES                 ===
=================================================
*/

/* تنظیم ارتفاع اسلایدر کناری */
.side-promo-slider {
    width: 100%;
    height: 100%;
    border-radius: 15px;
    overflow: hidden;
}

/* گروه داخل هر اسلاید (شامل 2 کارت) */
.side-slide-group {
    display: flex;
    flex-direction: column;
    gap: 20px; /* فاصله بین دو بنر */
    height: 100%;
}

/* تنظیم کارت‌ها برای پر کردن فضا */
.creative-card.side-mode {
    flex: 1; /* ارتفاع برابر برای هر دو کارت */
    margin: 0 !important; /* حذف مارجین‌های اضافه */
}

/* اصلاح در موبایل */
@media (max-width: 992px) {
    .side-promo-slider {
        height: auto; /* در موبایل ارتفاع خودکار باشد */
    }
    .side-slide-group {
        height: auto;
        gap: 15px;
    }
    .creative-card.side-mode {
        height: 200px !important; /* ارتفاع فیکس در موبایل */
        flex: none;
    }
}

/*
=================================================
===      CUSTOM 404 PAGE STYLES               ===
=================================================
*/

.error-404-wrapper {
    min-height: 80vh; /* ارتفاع مناسب برای قرارگیری در وسط */
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f8f9fa;
    text-align: center;
    padding: 60px 20px;
}

.error-content {
    max-width: 600px;
    margin: 0 auto;
}

/* --- استایل عدد 404 --- */
.error-number {
    font-size: 10rem;
    font-weight: 900;
    color: var(--primary-color);
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 20px;
}

/* تنظیمات آیکون وسط */
.radiation-icon-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 140px;
    height: 140px;
}

.radiation-icon {
    font-size: 8rem;
    color: var(--cta-color); /* زرد */
    z-index: 2;
    animation: spin-slow 10s linear infinite; /* چرخش خیلی آرام */
}

/* انیمیشن تپش (Pulse) پشت آیکون */
.pulse-ring {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 2px solid var(--cta-color);
    opacity: 0;
    z-index: 1;
    animation: pulse-animation 2s infinite;
}

/* --- متن‌ها --- */
.error-title {
    font-size: 2rem;
    color: var(--dark-text-color);
    margin-bottom: 15px;
}

.error-text {
    font-size: 1.1rem;
    color: #666;
    margin-bottom: 40px;
    line-height: 1.8;
}

/* --- سرچ باکس --- */
.error-search-box {
    margin-bottom: 30px;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
}
.error-search-box form {
    display: flex;
    border: 2px solid #eee;
    border-radius: 50px;
    overflow: hidden;
    background: #fff;
    transition: border-color 0.3s;
}
.error-search-box form:focus-within {
    border-color: var(--primary-color);
}
.error-search-box input {
    flex-grow: 1;
    border: none;
    padding: 15px 20px;
    outline: none;
    font-family: inherit;
}
.error-search-box button {
    background: var(--primary-color);
    color: #fff;
    border: none;
    padding: 0 25px;
    cursor: pointer;
    font-size: 1.2rem;
    transition: background 0.3s;
}
.error-search-box button:hover {
    background: var(--cta-color);
    color: var(--dark-text-color);
}

/* --- دکمه بازگشت --- */
.btn-home {
    padding: 12px 30px;
    font-size: 1.1rem;
    border-radius: 50px;
    box-shadow: 0 5px 15px rgba(13, 43, 78, 0.2);
}

/* --- تعریف انیمیشن‌ها --- */
@keyframes pulse-animation {
    0% {
        transform: scale(0.8);
        opacity: 1;
        border-width: 5px;
    }
    100% {
        transform: scale(1.5);
        opacity: 0;
        border-width: 0px;
    }
}

@keyframes spin-slow {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* --- ریسپانسیو --- */
@media (max-width: 768px) {
    .error-number {
        font-size: 6rem;
    }
    .radiation-icon-wrapper {
        width: 80px;
        height: 80px;
    }
    .radiation-icon {
        font-size: 5rem;
    }
    .error-title {
        font-size: 1.5rem;
    }
}
/*
=================================================
===      PRODUCT PAGE WITH STICKY VIDEO       ===
=================================================
*/

/* 1. تنظیم گرید صفحه محصول (محتوا + سایدبار) */
.product-page-grid {
    display: grid;
    /* ستون محتوا (بزرگ) | ستون سایدبار (کوچک - 300 پیکسل) */
    grid-template-columns: 1fr 300px;
    gap: 30px;
    align-items: start; /* مهم: برای اینکه sticky کار کند باید start باشد */
    margin-top: 30px;
}

/* 2. تنظیم خود سایدبار برای چسبندگی */
.product-sidebar-sticky {
    position: -webkit-sticky; /* برای سافاری */
    position: sticky;
    top: 120px; /* فاصله از بالای صفحه وقتی اسکرول می‌شود (بسته به ارتفاع هدر تنظیم کنید) */
    z-index: 90;
    transition: top 0.3s;
    /* برای اطمینان از اینکه سایدبار ارتفاع دارد */
    height: fit-content;
    align-self: start;
}

/* 3. استایل باکس ویدیو */
.video-widget {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}

.video-widget .widget-title {
    font-size: 1.1rem;
    color: var(--primary-color);
    margin-bottom: 15px;
    border-bottom: 2px solid var(--cta-color);
    padding-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* 4. اصلاح پلیر برای سایدبار */
.video-widget .aparat-lazy-wrapper {
    margin: 0; /* حذف مارجین‌های اضافه */
    aspect-ratio: 16 / 9;
    border-radius: 8px;
}

/* --- حالت ریسپانسیو (موبایل) --- */
@media (max-width: 992px) {
    /* برگرداندن تنظیمات overflow برای موبایل اگر نیاز بود */
    body, main {
        overflow-x: hidden !important;
    }
    .product-page-grid {
        grid-template-columns: 1fr; /* تک ستونه شدن */
    }

    .product-sidebar-sticky {
        position: static !important;
        top: auto !important;
    }

    /* ویدیو برود زیر توضیحات */
    .product-content-main {
        order: 1;
    }
    .product-sidebar-sticky {
        order: 2;
    }
}

/*
=================================================
===      SINGLE PRODUCT (DEVICE) FIXES        ===
=================================================
*/

/* محدود کردن ارتفاع گالری تصاویر */
.product-gallery .woocommerce-product-gallery__image img {
    max-height: 400px; /* ارتفاع حداکثر */
    width: auto; /* عرض متناسب */
    margin: 0 auto; /* وسط چین */
    display: block;
    border-radius: 12px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}

/* استایل دکمه دانلود کاتالوگ */
.btn-catalog {
    display: inline-block;
    margin-top: 10px;
    background-color: #f0f2f5;
    color: #333;
    border: 1px solid #ccc;
    padding: 10px 20px;
    border-radius: 5px;
    font-size: 0.9rem;
    text-decoration: none;
    transition: all 0.3s;
}
.btn-catalog:hover {
    background-color: #e2e6ea;
    border-color: #bbb;
}

/* فاصله و خط‌کشی برای زیبایی */
.product-info-column {
    border-left: 1px solid #eee; /* خط جداکننده */
    padding-left: 30px;
}

/* راست‌چین کردن (در حالت RTL) */
html[dir="rtl"] .product-info-column {
    border-left: none;
    border-right: 1px solid #eee;
    padding-left: 0;
    padding-right: 30px;
}

/* ریسپانسیو: حذف خط در موبایل */
@media (max-width: 992px) {
    .product-info-column {
        border: none !important;
        padding: 0 !important;
    }
}

/* استایل دکمه استعلام قیمت */
.btn-call-for-price {
    display: block;
    width: 100%;
    background-color: #28a745; /* رنگ سبز */
    color: #fff !important;
    text-align: center;
    padding: 12px 20px;
    border-radius: 5px;
    font-size: 1rem;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    text-decoration: none;
    transition: background-color 0.3s;
}

.btn-call-for-price:hover {
    background-color: #218838; /* سبز تیره‌تر در هاور */
    color: #fff !important;
    box-shadow: 0 4px 10px rgba(40, 167, 69, 0.3);
}

.btn-call-for-price i {
    margin-left: 8px; /* فاصله آیکون تا متن */
}

/* =================================================
   FORCE FIX: WIDER HERO + SHORTER HEIGHT
================================================= */

@media (min-width: 992px) {

    /* 1. تنظیم اکید شبکه (Grid) */
    .hero-grid-layout {
        /* ستون اول (اسلایدر) 3 برابر ستون دوم باشد */
        /*grid-template-columns: 3fr 1fr !important;*/

        /* ارتفاع کل بخش روی 400 پیکسل قفل شود */
        height: 570px !important;
    }

    /* 2. تنظیم تصویر اسلایدر اصلی */
    .hero-main-slider-area,
    .hero-background-slider,
    .hero-background-slider .swiper-slide {
        height: 100% !important; /* اطمینان از پر کردن ارتفاع */
    }

    /* 3. فشرده‌سازی بنرهای کناری برای جا شدن در ارتفاع کم */
    .side-promo-slider,
    .side-slide-group {
        height: 100% !important;
    }

    /* کارت‌های کناری */
    .creative-card.side-mode {
        /* تنظیم ارتفاع کارت‌ها تا از کادر بیرون نزنند */
        /* ارتفاع کل منهای فاصله (20px) تقسیم بر 2 */
        height: calc(50% - 10px) !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: row !important; /* چیدمان افقی (عکس چپ، متن راست) */
        align-items: center !important;
    }

    /* عکس کارت‌های کناری (کوچک شود) */
    .creative-card.side-mode .card-bg-image {
        width: 40% !important; /* عکس فقط 40 درصد عرض کارت را بگیرد */
        height: 100% !important;
        position: relative !important; /* برای اینکه کنار متن قرار بگیرد */
        order: 1; /* عکس سمت چپ (یا راست در فارسی) */
    }

    /* متن کارت‌های کناری */
    .creative-card.side-mode .card-details {
        width: 60% !important;
        position: relative !important;
        padding: 10px !important;
        background: #fff !important; /* زمینه سفید برای متن */
        height: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        order: 2;
    }

    /* گرادینت روی عکس حذف شود چون عکس و متن جدا شدند */
    .creative-card.side-mode .card-overlay-gradient {
        display: none !important;
    }

    /* تنظیم فونت‌ها در کارت کوچک */
    .creative-card.side-mode .card-title {
        font-size: 0.9rem !important;
        color: var(--primary-color) !important;
        margin-bottom: 5px !important;
        text-shadow: none !important;
    }

    .creative-card.side-mode .card-price {
        color: #28a745 !important;
        font-size: 0.9rem !important;
    }

    /* دکمه کوچک */
    .creative-card.side-mode .btn-creative {
        padding: 2px 10px !important;
        font-size: 0.7rem !important;
        color: #555 !important;
        background: #eee !important;
        border: none !important;
    }
}

.woocommerce-breadcrumb a{
    color: #242424 !important;
}

/*
=================================================
===    NEW CLICKABLE ACTIVITIES STYLES        ===
=================================================
*/

/* چیدمان شبکه */
.activities-links-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* 4 ستون در دسکتاپ */
    gap: 20px;
    margin-bottom: 50px;
}

/* استایل کارت لینک‌دار */
.activity-card-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 15px;
    padding: 30px 20px;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 5px 15px rgba(0,0,0,0.03);
    position: relative;
    overflow: hidden;
}

/* افکت هاور جذاب */
.activity-card-link:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 30px rgba(13, 43, 78, 0.15);
    border-color: var(--cta-color);
    background: #fff;
}

/* آیکون بالا */
.act-icon-box {
    font-size: 2.5rem;
    color: var(--primary-color);
    margin-bottom: 20px;
    transition: transform 0.3s;
}

.activity-card-link:hover .act-icon-box {
    transform: scale(1.1);
    color: var(--cta-color);
}

/* عنوان فعالیت */
.act-title {
    font-size: 1.1rem;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    color: var(--dark-text-color);
    margin: 0 0 15px 0;
    line-height: 1.4;
}

/* فلش پایین (نشان‌دهنده کلیک) */
.act-arrow {
    font-size: 0.9rem;
    color: #ccc;
    transition: all 0.3s;
    opacity: 0;
    transform: translateX(10px);
}

.activity-card-link:hover .act-arrow {
    opacity: 1;
    transform: translateX(0);
    color: var(--primary-color);
}

/* --- ریسپانسیو (موبایل) --- */
@media (max-width: 992px) {
    .activities-links-grid {
        grid-template-columns: repeat(2, 1fr); /* 2 ستون در تبلت */
    }
}

@media (max-width: 576px) {
    .activities-links-grid {
        grid-template-columns: 1fr; /* تک ستون در موبایل */
        gap: 15px;
    }

    .activity-card-link {
        flex-direction: row; /* در موبایل افقی شود (آیکون راست، متن چپ) */
        padding: 20px;
        justify-content: start;
        text-align: right;
    }

    .act-icon-box {
        margin-bottom: 0;
        margin-left: 15px;
        font-size: 1.8rem;
    }

    .act-title {
        margin: 0;
        font-size: 1rem;
    }

    .act-arrow {
        margin-right: auto; /* چسباندن فلش به چپ */
        opacity: 1; /* در موبایل همیشه دیده شود */
        transform: none;
    }
}

/*
=================================================
===   HOVER SLIDE-UP CAPTION STYLE            ===
=================================================
*/

/* استایل نوار پایین (مخفی در حالت عادی) */
.hero-content-bar {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background: rgba(13, 43, 78, 0.85); /* پس‌زمینه شیشه‌ای تیره */
    backdrop-filter: blur(5px);
    padding: 20px 30px;
    display: flex;
    justify-content: space-between; /* متن راست، دکمه چپ */
    align-items: center;

    /* تنظیمات انیمیشن */
    transform: translateY(100%); /* هل دادن به پایین (مخفی شدن) */
    transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    opacity: 0;
}

/* قانون جدید:
   1. وقتی موس هاور شد (:hover)
   2. یا وقتی کلاس show-caption توسط جاوااسکریپت اضافه شد
   نوار بیاید بالا
*/
.hover-trigger:hover .hero-content-bar,
.hover-trigger.show-caption .hero-content-bar {
    transform: translateY(0); /* برگشت به سر جای اصلی */
    opacity: 1;
}

/* وقتی موس روی اسلاید رفت، نوار بیاید بالا */
.hover-trigger:hover .hero-content-bar {
    transform: translateY(0); /* برگشت به سر جای اصلی */
    opacity: 1;
}

/* استایل عنوان (سمت راست) */
.hero-bar-text {
    flex-grow: 1;
    text-align: right;
    padding-left: 20px;
}

.hero-bar-title {
    color: #fff;
    font-size: 1.2rem;
    margin: 0;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
}

/* استایل دکمه‌ها (سمت چپ) */
.hero-bar-buttons {
    display: flex;
    gap: 10px;
    flex-shrink: 0;
}

/* دکمه ثانویه (سفید/شیشه‌ای) */
.btn-light {
    background: rgba(255,255,255,0.2);
    color: #fff;
    border: 1px solid rgba(255,255,255,0.4);
    transition: all 0.3s;
}
.btn-light:hover {
    background: #fff;
    color: var(--primary-color);
}

/* --- اصلاح برای موبایل --- */
/* در موبایل چون موس نداریم، بهتر است نوار همیشه دیده شود یا با کلیک بیاید */
/* اینجا تنظیم می‌کنیم که همیشه دیده شود ولی کوچکتر باشد */
@media (max-width: 992px) {
    .hero-content-bar {
        transform: translateY(0) !important; /* همیشه بالا باشد */
        opacity: 1 !important;
        padding: 10px 15px !important;
        flex-direction: column; /* زیر هم قرار بگیرند */
        text-align: center;
        gap: 10px;
    }

    .hero-bar-text {
        text-align: center;
        padding: 0;
    }

    .hero-bar-title {
        font-size: 1rem;
    }

    .hero-bar-buttons {
        width: 100%;
        justify-content: center;
    }
}

/* =================================================
   FIX NEWS GRID ALIGNMENT (SYMMETRY)
================================================= */

/* 1. اصلاح گرید اصلی: ستون‌ها باید کشیده شوند تا هم‌قد شوند */
.news-layout-grid-v2 {
    align-items: stretch !important; /* قبلاً center بود که باعث ناهماهنگی می‌شد */
}

/* 2. تنظیم ستون‌های کناری: توزیع کارت‌ها */
.regular-articles-column {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important; /* فاصله بین کارت‌ها را تنظیم می‌کند تا کل ارتفاع را پر کنند */
    height: 100% !important;
}

/* 3. اطمینان از اینکه کارت‌های کوچک فشرده نمی‌شوند */
.article-card-small {
    flex-grow: 1; /* اجازه می‌دهد کارت در صورت نیاز کمی کش بیاید */
    display: flex;
    align-items: center;
}

/*
=================================================
===   MOBILE FIX FOR TRUST SLIDER             ===
=================================================
*/

@media (max-width: 992px) {

    /* 1. تبدیل گرید به تک ستونه */
    .trust-slide-grid {
        grid-template-columns: 1fr !important; /* یک ستون */
        gap: 20px !important;
        padding: 30px 20px !important; /* فضای داخلی کمتر */
        text-align: center !important;
        height: auto !important;
    }

    /* 2. تصویر بیاید بالا (Order 1) */
    .trust-image-col {
        order: 1 !important;
        width: 100% !important;
        margin-bottom: 15px !important;
    }

    /* تنظیم ارتفاع تصویر در موبایل */
    .trust-image-col img {
        height: 220px !important; /* ارتفاع کمتر و مناسب موبایل */
        width: 100% !important;
        object-fit: cover !important;
    }

    /* 3. متن برود پایین (Order 2) */
    .trust-content-col {
        order: 2 !important;
        text-align: center !important; /* متن وسط‌چین */
        padding: 0 !important;
    }

    /* 4. سایز فونت‌ها */
    .trust-item-title {
        font-size: 1.4rem !important;
        margin-bottom: 15px !important;
    }

    .trust-item-desc {
        font-size: 0.95rem !important;
        line-height: 1.6 !important;
        text-align: center !important; /* یا justify */
        margin-bottom: 20px !important;
    }

    /* 5. دکمه وسط‌چین */
    .btn-text-arrow {
        justify-content: center !important;
        width: 100% !important;
    }

    /* مخفی کردن فلش‌های کناری در موبایل (چون با دست ورق می‌زنند) */
    .trust-slider .swiper-button-next,
    .trust-slider .swiper-button-prev {
        display: none !important;
    }
}

/*
=================================================
===   MOBILE OPTIMIZATION FOR HERO SECTION    ===
=================================================
*/

@media (max-width: 992px) {

    /* 1. تنظیم گرید اصلی (تبدیل به تک ستونه) */
    .hero-grid-layout {
        display: flex !important;       /* استفاده از فلکس برای کنترل بهتر */
        flex-direction: column !important; /* آیتم‌ها زیر هم */
        height: auto !important;        /* ارتفاع خودکار بر اساس محتوا */
        gap: 20px !important;           /* فاصله بین اسلایدر و بنرها */
    }

    /* 2. تنظیم اسلایدر اصلی (Hero Slider) */
    .hero-main-slider-area {
        width: 100% !important;
        height: 300px !important;       /* ارتفاع ثابت و مناسب برای موبایل */
        min-height: 300px !important;
    }

    /* تنظیم تصویر داخل اسلایدر */
    .hero-background-slider .swiper-slide {
        background-position: center center !important;
        background-size: cover !important;
    }

    /* 3. نوار پایین اسلایدر (Caption) */
    .hero-content-bar {
        /* در موبایل همیشه دیده شود (نه فقط با هاور) */
        transform: translateY(0) !important;
        opacity: 1 !important;

        /* چیدمان */
        padding: 10px 15px !important;
        flex-direction: column !important; /* متن بالا، دکمه پایین */
        text-align: center !important;
        gap: 8px !important;
        background: rgba(13, 43, 78, 0.9) !important; /* پس‌زمینه تیره‌تر برای خوانایی */
    }

    .hero-bar-text {
        text-align: center !important;
        padding: 0 !important;
        width: 100% !important;
    }

    .hero-bar-title {
        font-size: 1rem !important; /* فونت کوچک‌تر */
        margin: 0 !important;
    }

    .hero-bar-buttons {
        width: 100% !important;
        justify-content: center !important;
    }

    .hero-bar-buttons .btn {
        padding: 5px 12px !important; /* دکمه‌های کوچک‌تر */
        font-size: 0.8rem !important;
    }

    /* 4. تنظیم بنرهای کناری (که در موبایل می‌روند پایین) */
    .hero-side-banners-area {
        width: 100% !important;
        height: auto !important;
        /* در موبایل، اگر اسلایدر کناری است، ارتفاعش را کم می‌کنیم */
    }

    /* تنظیم کارت‌های بنر کناری */
    .creative-card.side-mode {
        height: 120px !important; /* ارتفاع کم برای هر بنر */
        margin-bottom: 0 !important;
        flex-direction: row !important; /* عکس کنار متن بماند */
    }

    .side-card-img {
        width: 35% !important; /* عکس کوچکتر */
    }

    .side-card-content {
        width: 65% !important; /* فضای بیشتر برای متن */
        padding: 10px !important;
        text-align: right !important; /* متن راست‌چین */
    }

    .side-card-title {
        font-size: 0.9rem !important;
        margin-bottom: 5px !important;
    }

    .side-card-badge {
        font-size: 0.65rem !important;
        padding: 2px 6px !important;
    }

    .side-card-price {
        font-size: 0.85rem !important;
    }
}

/*
=================================================
===   ARCHIVE HERO IMAGE STYLES               ===
=================================================
*/

/* کانتینر تصویر (ستون سمت چپ) */
.hero-archive-image {
    display: flex;
    justify-content: flex-end; /* تصویر را به راست می‌چسباند */
    align-items: center;
}

/* باکس اطراف تصویر */
.image-wrapper-archive {
    width: 700px; /* عرض اصلی باکس در دسکتاپ */
    font-family: 'Vazir-Bold', sans-serif;
    height: auto; /* ارتفاع اصلی باکس در دسکتاپ */
    border-radius: 20px;
    overflow: hidden;
    /*box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);*/
    position: relative;
    transform: rotate(-2deg); /* کمی چرخش برای جذابیت */
    transition: all 0.5s ease;
}

/* خود تگ تصویر */
.hero-archive-image .img-main-archive {
    width: 100%;
    height: 100%;
    object-fit: cover; /* مطمئن می‌شویم که عکس کل کادر را پر کند */
    display: block;
    transition: transform 0.5s ease;
}

/* افکت هاور (اختیاری) */
.hero-archive-image:hover .image-wrapper-archive {
    transform: rotate(0deg); /* چرخش به حالت عادی برگردد */
    /*box-shadow: 0 15px 40px rgba(0, 0, 0, 0.2);*/
}

/* --- ریسپانسیو (برای موبایل) --- */
@media (max-width: 768px) {
    /* در موبایل، تصویر تمام عرض را بگیرد و بالا قرار گیرد */
    .hero-archive-grid {
        display: flex;
        flex-direction: column-reverse; /* تصویر برود بالا، محتوا بیاید پایین */
    }

    .hero-archive-image {
        justify-content: center; /* وسط‌چین کردن تصویر */
        margin-bottom: 25px;
    }

    .image-wrapper-archive {
        width: 100%; /* عرض کامل */
        max-width: 250px; /* محدودیت اندازه در مرکز */
        height: 250px;
        border-radius: 10px;
        transform: none; /* حذف چرخش در موبایل */
    }
}

/* =================================================
   NEW DEVICE PRODUCT PAGE STYLES (Dynamic)
================================================= */

/* گرید اصلی */
.product-page-wrapper {
    display: grid;
    grid-template-columns: 1fr 320px; /* محتوا - سایدبار */
    gap: 40px;
    align-items: start;
    padding-bottom: 60px;
    margin-top: 30px;
}

/* باکس اصلی سفید */
.product-main-content {
    background: #fff;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.03);
    overflow: hidden;
    border: 1px solid #e9ecef;
}

/* بخش بالایی (گالری و اطلاعات) */
.product-top-section {
    display: grid;
    grid-template-columns: 40% 60%;
    border-bottom: 1px solid #e9ecef;
}

/* گالری */
.product-gallery-area {
    padding: 30px;
    border-left: 1px solid #e9ecef; /* خط جداکننده */
}
.product-gallery-area .main-image {
    width: 100%;
    height: 350px;
    object-fit: contain;
    border-radius: 10px;
    margin-bottom: 15px;
    border: 1px solid #f0f0f0;
}
.thumbnails {
    display: flex;
    gap: 10px;
    justify-content: center;
    flex-wrap: wrap;
}
.thumbnails .thumb {
    width: 60px;
    height: 60px;
    object-fit: cover;
    border: 2px solid #eee;
    border-radius: 8px;
    cursor: pointer;
    transition: 0.3s;
}
.thumbnails .thumb:hover { border-color: var(--primary-color); }

/* اطلاعات متنی */
.product-info-area {
    padding: 40px;
}
.product-title {
    font-size: 1.8rem;
    color: var(--primary-color);
    margin: 0 0 15px;
    font-weight: 800;
}
.product-meta {
    font-size: 0.9rem;
    color: #777;
    margin-bottom: 25px;
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}
.product-meta span i { color: var(--cta-color); margin-left: 5px; }
.product-meta a { color: #777; text-decoration: none; }

/* ویژگی‌ها */
.product-features {
    margin: 20px 0 30px;
    list-style: none;
    padding: 0;
}
.product-features li {
    margin-bottom: 10px;
    font-size: 0.95rem;
    display: flex;
    align-items: center;
}
.product-features li i {
    color: #28a745;
    margin-left: 10px;
    font-size: 1.1rem;
}

/* دکمه‌ها */
.product-actions {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}
.btn-call {
    flex: 1;
    background: #28a745;
    color: #fff !important;
    text-align: center;
    padding: 12px;
    border-radius: 8px;
    font-weight: bold;
    text-decoration: none;
    box-shadow: 0 4px 15px rgba(40, 167, 69, 0.2);
    transition: 0.3s;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
}
.btn-call:hover { background: #218838; transform: translateY(-3px); }

.btn-catalog {
    background: #fff;
    border: 2px solid var(--primary-color);
    color: var(--primary-color) !important;
    padding: 12px 25px;
    border-radius: 8px;
    font-weight: bold;
    text-decoration: none;
    transition: 0.3s;
    display: flex;
    align-items: center;
    gap: 8px;
}
.btn-catalog:hover { background: var(--primary-color); color: #fff !important; }

/* تب‌ها */
.product-tabs-wrapper {
    padding: 40px;
}
.tab-buttons {
    display: flex;
    border-bottom: 2px solid #eee;
    margin-bottom: 30px;
}
.tab-btn {
    padding: 15px 30px;
    font-size: 1.1rem;
    font-weight: bold;
    color: #666;
    cursor: pointer;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    transition: 0.3s;
}
.tab-btn.active {
    color: var(--primary-color);
    border-bottom-color: var(--primary-color);
}
.tab-content {
    display: none;
    animation: fadeIn 0.5s;
}
.tab-content.active { display: block; }

/* جدول مشخصات فنی ووکامرس */
.woocommerce-product-attributes {
    width: 100%;
    border-collapse: collapse;
}
.woocommerce-product-attributes th,
.woocommerce-product-attributes td {
    padding: 15px;
    border-bottom: 1px solid #eee;
}
.woocommerce-product-attributes tr:nth-child(odd) { background: #fcfcfc; }
.woocommerce-product-attributes th { color: var(--primary-color); width: 30%; }

/* سایدبار */
.product-sidebar {
    position: sticky;
    top: 120px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.sidebar-widget {
    background: #fff;
    border-radius: 12px;
    padding: 25px;
    border: 1px solid #e9ecef;
    box-shadow: 0 5px 15px rgba(0,0,0,0.03);
}
.contact-list { list-style: none; padding: 0; margin: 0; }
.contact-list li { margin-bottom: 15px; display: flex; align-items: center; gap: 10px; color: #555; }
.contact-list i { color: var(--primary-color); font-size: 1.2rem; background: #eef4f9; padding: 8px; border-radius: 50%; width: 35px; height: 35px; display: flex; justify-content: center; align-items: center;}

/* ریسپانسیو */
@media (max-width: 992px) {
    .product-page-wrapper { grid-template-columns: 1fr; }
    .product-top-section { grid-template-columns: 1fr; }
    .product-gallery-area { border-left: none; border-bottom: 1px solid #e9ecef; }
    .product-sidebar { position: static; }
    .thumbnails { justify-content: flex-start; }
}


/*
=================================================
===      HERO GRID LAYOUT (SLIDER + BANNERS)  ===
=================================================
*/

/* 1. سکشن اصلی */
.hero-section-modern {
    padding: 30px 0 60px 0; /* فاصله از بالا و پایین */
    background-color: #fff;
}

/* 2. گرید اصلی (تقسیم به دو ستون) */
.hero-grid-layout {
    display: grid;
    /* سهم ستون پست ها بیشتر شد تا دو کارت کناری درشت تر دیده شوند. */
    grid-template-columns: minmax(0, 1.65fr) minmax(320px, 1.35fr);
    gap: 20px;
    height: 500px; /* ارتفاع فیکس برای دسکتاپ */
}

/* 3. محدوده اسلایدر (سمت راست) */
.hero-main-slider-area {
    width: 100%;
    height: 100%;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    box-shadow: 0 10px 30px rgba(13, 43, 78, 0.1);
}

.hero-background-slider {
    width: 100%;
    height: 100%;
}

.hero-slide-item {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    position: relative;
}

/* 4. محدوده بنرهای کناری (سمت چپ) */
.hero-side-banners-area {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.side-promo-card-horizontal {
    min-height: 0;
}

.side-card-img {
    width: 42%;
}

.side-card-content {
    width: 58%;
    padding: 18px 20px;
}

.side-card-title {
    font-size: 1.08rem;
    line-height: 1.55;
    margin-bottom: 10px;
}

.side-card-price {
    font-size: 0.95rem;
    line-height: 1.9;
    height: auto;
}

/* 5. اسلایدر عمودی برای بنرها (اگر بنرها زیاد باشند) */
.side-promo-slider {
    width: 100%;
    height: 100%;
}

/* 6. گروه بنرها در هر اسلاید (دوتا زیر هم) */
.side-slide-group {
    display: flex;
    flex-direction: column;
    gap: 20px; /* فاصله بین دو بنر */
    height: 100%;
}

/* 7. آیتم بنر تکی */
.side-banner-item {
    display: block;
    position: relative;
    flex: 1; /* هر بنر نصف ارتفاع را بگیرد */
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    transition: transform 0.3s ease;
}

.side-banner-item:hover {
    transform: translateY(-5px);
}

.side-banner-item img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* پر کردن کامل کادر */
    transition: transform 0.5s ease;
}

.side-banner-item:hover img {
    transform: scale(1.1); /* زوم عکس هنگام هاور */
}

/* متن روی بنر (اختیاری) */
.side-banner-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 15px;
    background: linear-gradient(to top, rgba(0,0,0,0.8), transparent);
    color: #fff;
    z-index: 2;
}

.side-banner-title {
    font-size: 1rem;
    margin-bottom: 5px;
    font-weight: 700;
    font-family: 'Vazir-Bold', sans-serif;
    text-shadow: 0 2px 5px rgba(0,0,0,0.5);
}

.side-banner-cta {
    font-size: 0.8rem;
    color: var(--cta-color);
    display: flex;
    align-items: center;
    gap: 5px;
}

/* پلیس‌هولدر برای زمانی که بنری نیست */
.side-banner-item.placeholder {
    background-color: #eee;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #999;
    font-weight: bold;
}

/* --- تنظیمات دکمه‌های اسلایدر اصلی --- */
.hero-main-slider-area .swiper-button-next,
.hero-main-slider-area .swiper-button-prev {
    color: #fff;
    width: 50px;
    height: 50px;
    background: rgba(255,255,255,0.2);
    backdrop-filter: blur(5px);
    border-radius: 50%;
}
.hero-main-slider-area .swiper-button-next:after,
.hero-main-slider-area .swiper-button-prev:after {
    font-size: 1.2rem;
    font-weight: bold;
}

/* --- ریسپانسیو (موبایل و تبلت) --- */
@media (max-width: 992px) {
    .hero-grid-layout {
        display: flex;
        flex-direction: column; /* زیر هم قرار گرفتن */
        height: auto;
        gap: 20px;
    }

    .hero-main-slider-area {
        height: 350px; /* ارتفاع اسلایدر در تبلت */
    }

    .hero-side-banners-area {
        height: auto;
    }

    .side-card-content {
        padding: 16px 18px;
    }

    .side-slide-group {
        flex-direction: row; /* بنرها کنار هم در تبلت */
        height: 180px;
    }
}

@media (max-width: 576px) {
    .hero-main-slider-area {
        height: 250px; /* ارتفاع اسلایدر در موبایل */
    }

    .side-slide-group {
        flex-direction: column; /* بنرها دوباره زیر هم در موبایل */
        height: auto;
    }

    .side-banner-item {
        height: 150px; /* ارتفاع هر بنر در موبایل */
        width: 100%;
    }
}

.ir-corp-section {
    background-color: var(--corp-bg);
    padding: 100px 20px;
    font-family: 'Vazir-regular', sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    overflow: hidden;
}

/* --- استایل شعر دو خطی در سمت راست --- */
.ir-bg-poem {
    position: absolute;

    /* تغییر مکان به سمت راست */
    right: 26%;
    top: 46%;
    transform: translateY(-50%) rotate(-10deg); /* چرخش ملایم */

    font-family: 'Noto Nastaliq Urdu', serif;
    font-size: 6rem; /* سایز کمی کوچکتر شد تا دو خط جا بشه */
    line-height: 2.2; /* فاصله زیاد بین خطوط برای جلوگیری از تداخل حروف نستعلیق */
    color: var(--corp-blue);
    opacity: 0.12; /* کمرنگ و شیک */

    text-align: center; /* وسط چین کردن دو مصرع نسبت به هم */
    pointer-events: none;
    z-index: 0;
    user-select: none;
}

.ir-container {
    max-width: 1200px;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 60px;
    position: relative;
    z-index: 1; /* متن روی شعر باشد */
}

/* --- ستون متن --- */
.ir-text-col {
    flex: 1;
    min-width: 300px;
}

.ir-heading-wrapper {
    display: flex;
    align-items: center;
    margin-bottom: 25px;
}

.ir-line {
    width: 50px;
    height: 3px;
    background-color: var(--ir-gold);
    margin-left: 15px;
    border-radius: 2px;
}

.ir-text-col h2 {
    font-size: 2.2rem;
    color: var(--corp-blue);
    margin: 0;
    font-weight: 800;
    line-height: 1.3;
}

.ir-text-col p {
    color: #555;
    line-height: 1.9;
    font-size: 1.05rem;
    margin-bottom: 30px;
    text-align: justify;
}

.ir-btn-minimal {
    color: var(--corp-blue);
    text-decoration: none;
    font-weight: bold;
    border-bottom: 2px solid var(--ir-gold);
    padding-bottom: 5px;
    transition: all 0.3s ease;
    display: inline-block;
}

.ir-btn-minimal:hover {
    color: var(--ir-gold);
    border-bottom-color: var(--corp-blue);
    transform: translateX(-5px);
}

/* --- ستون تصویر --- */
.ir-img-col {
    flex: 1;
    min-width: 300px;
    display: flex;
    justify-content: center;
}

.ir-image-mask {
    width: 100%;
    max-width: 550px;
    height: 550px;

    /* لینک تصویر لوکال شما */
    background-image: url('pic/iran-flag-waving_1498-39.webp');

    background-size: cover;
    background-position: center bottom;
    border-radius: 25px;

    box-shadow: 15px 15px 40px rgba(10, 38, 71, 0.15);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.ir-img-col:hover .ir-image-mask {
    transform: translateY(-8px);
    box-shadow: 20px 20px 50px rgba(10, 38, 71, 0.2);
}

/* --- ریسپانسیو --- */
@media (max-width: 900px) {
    .ir-container {
        flex-direction: column-reverse;
        gap: 40px;
        text-align: center;
    }
    .ir-heading-wrapper { justify-content: center; }
    .ir-line { display: none; }
    .ir-text-col p { text-align: center; }

    /* در موبایل شعر وسط صفحه بیاید */
    .ir-bg-poem {
        right: auto;
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 3.5rem;
        width: 100%;
        line-height: 2;
    }

    .ir-image-mask {
        height: 350px;
        max-width: 400px;
        border-radius: 200px 200px 20px 20px;
    }
    .ir-text-col h2 { font-size: 1.8rem; }
}

.hero-section-modern .container,
#news .container,
#services .container,
.promo-cta-section .container,
#courses .container {
    width: min(100% - 32px, 1400px);
}

.hero-grid-layout {
    grid-template-columns: minmax(0, 1.7fr) minmax(300px, 0.95fr) !important;
    align-items: stretch;
}

.hero-main-slider-area,
.hero-background-slider,
.hero-background-slider .swiper-slide,
.hero-slide {
    height: 100%;
}

.hero-slide {
    min-height: clamp(360px, 52vw, 560px);
    background-position: center center;
}

.hero-content-bar {
    gap: 16px;
    flex-wrap: wrap;
}

.hero-bar-text {
    max-width: 32rem;
}

.hero-bar-title {
    font-size: clamp(1.05rem, 1.1vw + 0.85rem, 1.5rem);
    line-height: 1.8;
}

.hero-bar-buttons {
    flex-wrap: wrap;
}

.hero-bar-buttons .btn {
    min-width: 138px;
    justify-content: center;
}

.side-promo-slider,
.side-promo-slider .swiper-wrapper,
.side-slide-group {
    height: 100%;
}

.side-promo-card-horizontal {
    min-height: 0;
    align-items: stretch;
}

.side-card-img {
    flex: 0 0 42%;
    width: auto;
}

.side-card-content {
    flex: 1 1 auto;
    width: auto;
    padding: 18px;
}

.side-card-title,
.side-card-price {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.side-card-title {
    -webkit-line-clamp: 2;
}

.side-card-price {
    -webkit-line-clamp: 4;
}

.news-rotator-container {
    padding: 0 56px;
}

.news-layout-grid-v2 {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) minmax(0, 1fr);
    gap: 24px;
    align-items: stretch;
}

.featured-article-column,
.regular-articles-column {
    min-width: 0;
}

.article-card-small {
    align-items: flex-start;
}

.article-card-small .article-image-link-small {
    flex: 0 0 96px;
}

.article-card-small .article-image-link-small img {
    width: 96px;
    height: 78px;
}

.services-slider,
.courses-slider {
    padding-inline: 14px;
}

.slide-grid-2 {
    align-items: stretch;
}

.promo-card {
    height: 100%;
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
    align-items: center;
}

.promo-image-col {
    height: 100%;
}

.promo-image-col img {
    height: 100%;
    min-height: 220px;
}

.promo-content-col {
    justify-content: center;
}

.course-card {
    height: 100%;
}

.course-title,
.course-description {
    overflow-wrap: anywhere;
}

@media (max-width: 1199px) {
    .hero-section-modern .container,
    #news .container,
    #services .container,
    .promo-cta-section .container,
    #courses .container {
        width: min(100% - 28px, 1180px);
    }

    .hero-grid-layout {
        grid-template-columns: minmax(0, 1fr) minmax(280px, 0.82fr) !important;
        height: auto !important;
    }

    .hero-main-slider-area {
        min-height: 460px;
    }

    .side-slide-group {
        gap: 16px;
    }

    .side-card-content {
        padding: 16px;
    }

    .news-rotator-container {
        padding-inline: 44px;
    }

    .news-layout-grid-v2 {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, 1fr);
        gap: 18px;
    }
}

@media (max-width: 991px) {
    .hero-section-modern {
        padding: 20px 0 44px;
        margin-top: 30px;
    }

    .hero-section-modern .container,
    #news .container,
    #services .container,
    .promo-cta-section .container,
    #courses .container {
        width: min(100% - 24px, 100%);
    }

    .section-title,
    .section-title-left {
        font-size: clamp(1.5rem, 2.2vw + 1rem, 2rem);
        margin-bottom: 28px;
    }

    .hero-grid-layout {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }

    .hero-main-slider-area {
        min-height: 360px;
        height: auto !important;
    }

    .hero-slide {
        min-height: 360px;
    }

    .hero-content-bar {
        padding: 16px 18px !important;
        align-items: flex-start;
        text-align: right !important;
    }

    .hero-bar-text,
    .hero-bar-buttons {
        width: 100% !important;
    }

    .hero-bar-text {
        text-align: right !important;
    }

    .hero-bar-buttons {
        justify-content: flex-start !important;
    }

    .hero-side-banners-area,
    .side-promo-slider,
    .side-promo-slider .swiper-wrapper {
        height: auto !important;
    }

    .side-slide-group {
        flex-direction: column !important;
        height: auto !important;
    }

    .side-promo-card-horizontal {
        min-height: 168px;
    }

    .news {
        padding: 64px 0;
    }

    .news-rotator-container {
        padding: 0 0 64px;
    }

    .news-layout-grid-v2 {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .featured-article-column {
        order: -1;
        margin-bottom: 0;
    }

    .news-rotator-nav {
        top: auto;
        bottom: 0;
        transform: none;
    }

    .news-rotator-nav.prev {
        right: calc(50% + 8px);
    }

    .news-rotator-nav.next {
        left: calc(50% + 8px);
    }

    .slide-grid-2,
    .promo-card {
        grid-template-columns: 1fr;
    }

    .promo-card {
        gap: 18px;
    }

    .promo-image-col img {
        min-height: 240px;
    }

    .services-slider,
    .courses-slider {
        padding-inline: 8px !important;
    }
}

@media (max-width: 767px) {
    .hero-main-slider-area,
    .hero-slide {
        min-height: 300px;
    }

    .hero-content-bar {
        padding: 14px !important;
        gap: 12px;
    }

    .hero-bar-title {
        font-size: 0.98rem !important;
        line-height: 1.75;
    }

    .hero-bar-buttons .btn {
        min-width: 0;
        width: 100%;
    }

    .side-promo-card-horizontal {
        flex-direction: column;
        min-height: 0;
    }

    .side-card-img,
    .side-card-content {
        width: 100% !important;
        flex-basis: auto;
    }

    .side-card-img {
        min-height: 180px;
    }

    .side-card-content {
        padding: 14px;
    }

    .article-card-small {
        gap: 12px;
        padding: 12px;
    }

    .article-card-small .article-image-link-small {
        flex-basis: 88px;
    }

    .article-card-small .article-image-link-small img {
        width: 88px;
        height: 72px;
    }

    .promo-image-col img,
    .course-card img,
    .main-thumbnail,
    .hover-thumbnail {
        min-height: 0;
        height: 200px !important;
    }

    .course-content {
        padding: 14px !important;
    }
}

@media (max-width: 575px) {
    .hero-section-modern .container,
    #news .container,
    #services .container,
    .promo-cta-section .container,
    #courses .container {
        width: min(100% - 20px, 100%);
    }

    .hero-main-slider-area,
    .hero-slide {
        min-height: 260px;
    }

    .hero-main-slider-area .swiper-button-next,
    .hero-main-slider-area .swiper-button-prev {
        width: 38px;
        height: 38px;
    }

    .hero-bar-buttons {
        flex-direction: column;
    }

    .news {
        padding: 52px 0;
    }

    .news-rotator-container {
        padding-bottom: 58px;
    }

    .news-rotator-nav {
        width: 40px;
        height: 40px;
    }

    .section-title,
    .section-title-left {
        font-size: 1.35rem;
    }

    .promo-card {
        padding: 14px;
        border-radius: 14px;
    }

    .promo-image-col img {
        height: 190px !important;
    }

    .course-title {
        font-size: 1.05rem !important;
        height: auto;
    }

    .course-description {
        height: auto !important;
        -webkit-line-clamp: 3;
    }
}

/* =====================================================
   INDEX.PHP RESPONSIVE OVERRIDES (PART 2)
   Sections: projects, licenses, activities, ir-corp, contact/partners
   Breakpoints: 1199 / 991 / 767 / 575
   ===================================================== */

.projects {
    padding: 80px 0;
}

.project-showcase {
    gap: clamp(48px, 6vw, 80px);
}

.project-row,
.project-row-reverse {
    gap: clamp(24px, 4vw, 40px);
    opacity: 1;
    transform: none;
}

.project-image-col {
    flex: 1 1 46%;
    min-width: 0;
}

.project-content-col {
    flex: 1 1 46%;
    min-width: 0;
    padding-inline: 0;
}

.project-image-col img {
    aspect-ratio: 16 / 10;
    height: auto;
    object-fit: cover;
}

.project-content-col h3 {
    font-size: clamp(1.2rem, 1.4vw + 0.8rem, 1.6rem);
}

.client-licenses {
    padding: 70px 0;
}

.license-slider {
    padding: 40px 0 60px;
}

.license-slider .swiper-slide a {
    max-width: min(280px, 80vw);
}

.license-slider .swiper-slide img {
    height: clamp(200px, 40vw, 300px) !important;
}

.activities-links-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(14px, 2vw, 20px);
}

.act-title {
    overflow-wrap: anywhere;
}

.ir-corp-section {
    overflow: hidden;
}

.ir-container {
    gap: clamp(32px, 5vw, 60px);
}

.ir-image-mask {
    width: 100%;
    max-width: 550px;
    height: clamp(320px, 60vw, 550px);
}

.ir-text-col h2 {
    font-size: clamp(1.6rem, 2vw + 1rem, 2.4rem);
}

.contact-partners-section {
    padding: 70px 0;
}

.partners-logo-grid-compact {
    gap: clamp(16px, 2.5vw, 32px);
    width: 100%;
}

.partners-logo-grid-compact .partner-logo {
    flex-basis: calc(33.333% - 16px);
    min-width: 0;
}

.partners-logo-grid-compact .partner-logo img {
    max-width: 100%;
    max-height: 70px;
}

.view-all-wrapper {
    margin-top: 24px;
    padding-inline: 8px;
}

/* --- Tablet (<=1199px) --- */
@media (max-width: 1199px) {
    .activities-links-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ir-container {
        flex-direction: column-reverse;
        text-align: center;
    }

    .ir-heading-wrapper {
        justify-content: center;
    }

    .ir-line {
        display: none;
    }

    .ir-text-col p {
        text-align: center;
    }
}

/* --- Large mobile / small tablet (<=991px) --- */
@media (max-width: 991px) {
    .projects,
    .client-licenses,
    .contact-partners-section {
        padding: 56px 0;
    }

    .project-row,
    .project-row-reverse {
        flex-direction: column !important;
        gap: 20px;
    }

    .project-image-col,
    .project-content-col {
        flex: 1 1 100%;
        width: 100%;
    }

    .project-content-col {
        margin-top: 10px;
        padding: 0;
    }

    .project-image-col img {
        aspect-ratio: 16 / 9;
    }

    .partners-side {
        text-align: center;
        width: 100%;
    }

    .partners-logo-grid-compact {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }

    .partners-logo-grid-compact .partner-logo {
        flex-basis: calc(33.333% - 16px);
    }
}

/* --- Mobile (<=767px) --- */
@media (max-width: 767px) {
    .projects,
    .client-licenses,
    .contact-partners-section {
        padding: 44px 0;
    }

    .project-showcase {
        gap: 40px;
    }

    .project-content-col h3 {
        font-size: 1.2rem;
    }

    /* ساده‌سازی اسلایدر مجوزها برای جلوگیری از overflow افقی */
    .license-slider .swiper-slide a {
        max-width: 86vw;
        transform: none !important;
    }

    .license-slider .swiper-slide-prev a,
    .license-slider .swiper-slide-next a,
    .license-slider .swiper-slide-duplicate-prev a,
    .license-slider .swiper-slide-duplicate-next a {
        transform: none !important;
        opacity: 0.7;
    }

    .license-slider .swiper-slide img {
        height: 220px !important;
    }

    .ir-bg-poem {
        font-size: 3rem;
        width: 100%;
    }

    .ir-image-mask {
        height: 320px;
        max-width: 100%;
        border-radius: 160px 160px 20px 20px;
    }

    .partners-logo-grid-compact .partner-logo {
        flex-basis: calc(50% - 12px);
    }
}

/* --- Small mobile (<=575px) --- */
@media (max-width: 575px) {
    .projects,
    .client-licenses,
    .contact-partners-section {
        padding: 36px 0;
    }

    .activities-links-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .activity-card-link {
        flex-direction: row;
        justify-content: flex-start;
        text-align: right;
        padding: 16px;
    }

    .act-icon-box {
        margin: 0 0 0 14px;
        font-size: 1.7rem;
    }

    .act-title {
        margin: 0;
        font-size: 0.98rem;
    }

    .act-arrow {
        margin-right: auto;
        opacity: 1;
        transform: none;
    }

    .project-image-col img {
        aspect-ratio: 4 / 3;
    }

    .license-slider .swiper-button-next,
    .license-slider .swiper-button-prev {
        display: none;
    }

    .ir-bg-poem {
        font-size: 2.4rem;
        line-height: 1.9;
    }

    .partners-logo-grid-compact .partner-logo {
        flex-basis: calc(50% - 10px);
    }

    .partners-logo-grid-compact .partner-logo img {
        max-height: 56px;
    }
}

/* =====================================================
   HERO SIDE CARDS — IMAGE SIZE FIX (mobile/tablet)
   Prevents side-card images from rendering at natural
   (oversized) height when the layout switches to auto height.
   ===================================================== */

@media (max-width: 991px) {
    .side-promo-card-horizontal {
        flex-direction: row !important;
        align-items: stretch;
        min-height: 0 !important;
        height: auto;
    }

    .side-card-img {
        flex: 0 0 38% !important;
        width: auto !important;
        min-height: 0 !important;
        height: 130px;
    }

    .side-card-img img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    .side-card-content {
        flex: 1 1 auto !important;
        width: auto !important;
        padding: 12px 14px !important;
    }

    .side-card-title {
        font-size: 0.95rem !important;
        margin-bottom: 6px !important;
        -webkit-line-clamp: 2;
    }

    .side-card-price {
        font-size: 0.82rem !important;
        line-height: 1.6 !important;
        -webkit-line-clamp: 3;
    }
}

@media (max-width: 767px) {
    .side-card-img {
        flex: 0 0 35% !important;
        height: 112px;
    }

    .side-card-content {
        padding: 10px 12px !important;
    }

    .side-card-title {
        font-size: 0.88rem !important;
    }

    .side-card-price {
        font-size: 0.78rem !important;
        -webkit-line-clamp: 2;
    }
}

@media (max-width: 575px) {
    .side-card-img {
        flex: 0 0 33% !important;
        height: 96px;
    }

    .side-card-content {
        padding: 8px 10px !important;
    }

    .side-card-title {
        font-size: 0.82rem !important;
    }

    .side-card-price {
        font-size: 0.74rem !important;
        -webkit-line-clamp: 2;
    }
}

/* =====================================================
   HERO CAPTION — AUTO-HIDE ON MOBILE/TABLET
   Matches desktop behavior: hidden by default, shown
   briefly (via .show-caption) then fades out.
   Neutralizes the legacy "always visible" mobile rules.
   ===================================================== */
@media (max-width: 991px) {
    .hero-content-bar {
        transform: translateY(100%) !important;
        opacity: 0 !important;
        transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1),
                    opacity 0.4s ease !important;
    }

    .hover-trigger.show-caption .hero-content-bar,
    .hover-trigger:hover .hero-content-bar {
        transform: translateY(0) !important;
        opacity: 1 !important;
    }
}