:root {
     --primary: #0f4c81;
     --primary-light: #1d9bf0;
     --accent: #17b26a;
     --bg: #eef3f8;
     --text: #233044;
     --primary-color: #0b2e59;
     /* سرمه‌ای عمیق */
     --secondary-color: #1e60a3;
     /* آبی متوسط */
     --accent-color: #00a8ff;
     /* آبی روشن (نئونی) */
     --bg-body: #f1f5f9;
     /* خاکستری روشن */
     --warm-highlight: #f39c12;
 }

 body {
     margin: 0;
     background: var(--bg);
     font-family: Vazirmatn;
     color: var(--text);
     overflow-x: hidden;
 }

 /* =========================
           NAVBAR
        ========================= */
 .top-navbar {
     margin-top: 20px !important;
     position: relative;
     z-index: 9999;
 }

 .nav-shell {
     background: rgba(255, 255, 255, .92);
     backdrop-filter: blur(12px);
     border-radius: 28px;
     padding: 16px 24px;
     border-top: 3px solid var(--primary-light);
     box-shadow: 0 8px 30px rgba(15, 76, 129, .06);
     position: relative;
     overflow: visible;
     z-index: 9999;
 }
 .nav-shell .nav-tools li{
  list-style: none; 
 }
 .nav-shell .brand-box img {
     width: 100%;
 }

 .nav-shell .brand-box .brand-text {
     margin-left: 9px;
     width: 163px;
 }

 /* لوگو */

 .brand-box {
     display: flex;
     align-items: center;
     gap: 16px;
     text-decoration: none;
 }

 .brand-icon {
     width: 62px;
     height: 62px;
     border-radius: 20px;
     background: linear-gradient(135deg, var(--primary), var(--primary-light));
     display: flex;
     align-items: center;
     justify-content: center;
     color: #fff;
     font-size: 26px;
     box-shadow: 0 10px 25px rgba(29, 155, 240, .18);
     position: relative;
     overflow: hidden;
 }

 .brand-icon::after {
     content: "";
     position: absolute;
     inset: 7px;
     border: 1px dashed rgba(255, 255, 255, .35);
     border-radius: 15px;
 }


 .brand-text h2 {
     margin: 0;
     font-size: 18px;
     font-weight: 800;
     color: #12385e;
 }

 .brand-text span {
     font-size: 12px;
     color: #6b7280;
 }

 /* ================= MENU ================= */
 .menu-list {
     display: flex;
     margin-bottom: 0;
     gap: 20px;
 }

 .main-menu {
     display: flex;
     align-items: center;
     gap: 10px;
     margin-right: 105px;
 }

 .main-menu li {
     list-style: none;
 }

 .nav-item {
     position: relative;
 }

 .nav-link-custom {

     height: 48px;
     padding: 0 5px;

     border-radius: 14px;

     display: flex;
     align-items: center;
     gap: 10px;

     text-decoration: none;

     color: #24364d;

     font-size: 14px;
     font-weight: 700;

     transition: .25s;

     white-space: nowrap;

 }

 .nav-link-custom i {
     font-size: 14px;
 }

 .nav-link-custom .fa-home,
 .nav-link-custom .fa-building {
     color: var(--primary-light);
 }

 .nav-link-custom .fa-desktop,
 .nav-link-custom .fa-newspaper-o {
     color: var(--accent);
 }

 .nav-link-custom:hover {

     background: #f3f8fd;
     color: var(--primary);

 }

 .nav-link-custom.active {

     background: linear-gradient(135deg, var(--primary), var(--primary-light));
     color: #fff;

     box-shadow: 0 10px 25px rgba(29, 155, 240, .18);

 }

 .nav-link-custom.active i {
     color: #fff;
 }

 /* ==================== استایل‌های منو فقط برای موبایل و تبلت ==================== */
 @media (max-width: 991.98px) {

     /* تنظیمات باکس اصلی منوی بازشونده برای پوشش کامل صفحه (100vh) */
     .navbar-collapse {
         background-color: #ffffff !important;
         height: calc(100vh - 80px) !important;
         /* اعمال ارتفاع کامل صفحه (منهای ارتفاع تقریبی هدر بالا) */
         min-height: calc(100vh - 80px) !important;
         /* جلوگیری از جمع شدن باکس */
         overflow-y: auto !important;
         /* امکان اسکرول داخل منو */
         border-radius: 0 0 25px 25px !important;
         box-shadow: 0 15px 30px rgba(0, 0, 0, 0.08) !important;
         padding: 10px 20px 25px 20px !important;
         margin-top: 10px !important;

         /* برای اینکه ابزارها همیشه پایین بمانند، باکس اصلی را flex می‌کنیم */
         display: flex !important;
         flex-direction: column !important;
     }

     /* وقتی منو بسته است، flex نباید اعمال شود تا Bootstrap دچار خطا نشود */
     .navbar-collapse:not(.show) {
         display: none !important;
     }

     /* باکس دربرگیرنده لینک‌های منو */
     .main-menu {
         flex-grow: 1 !important;
         /* هول دادن ابزارهای پایین به انتهای صفحه */
     }

     /* ریست کردن فاصله‌های لیست */
     .main-menu .nav-item,
     .main-menu li {
         width: 100% !important;
         display: block !important;
         position: relative !important;
         border-bottom: 1px solid #f4f6f8 !important;
         float: none !important;
         margin: 0 !important;
         padding: 0 !important;
     }

     /* لینک‌های اصلی منو */
     .main-menu .nav-item>a,
     .main-menu li>a {
         display: flex !important;
         justify-content: space-between !important;
         align-items: center !important;
         padding: 18px 5px !important;
         text-align: right !important;
         color: #2c3e50 !important;
         font-weight: 700 !important;
         font-size: 0.95rem !important;
         text-decoration: none !important;
         direction: rtl !important;
     }

     /* استایل دکمه اول (صفحه اصلی) */
     .main-menu .nav-item:first-child>a,
     .main-menu li:first-child>a {
         color: #ffffff !important;
         background: linear-gradient(90deg, #1b6be2, #0d47a1) !important;
         border-radius: 12px !important;
         padding: 12px 20px !important;
         margin: 10px 0 !important;
     }

     /* ==================== استایل ابزارهای پایین منو ==================== */
     .nav-tools {
         display: flex !important;
         justify-content: center !important;
         align-items: center !important;
         gap: 15px !important;
         padding-top: 25px !important;
         margin-top: auto !important;
         /* می‌چسبد به پایین صفحه */
         border-top: none !important;
         padding-bottom: 20px !important;
     }

     /* ظاهر دکمه‌های ابزار شبیه عکس */
     .nav-tools .tool-btn {
         display: flex !important;
         justify-content: center !important;
         align-items: center !important;
         width: 45px !important;
         height: 45px !important;
         border: 1px solid #edf1f5 !important;
         border-radius: 14px !important;
         background-color: #ffffff !important;
         color: #2c3e50 !important;
         font-size: 1rem !important;
         font-weight: 600 !important;
         text-decoration: none !important;
         box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02) !important;
     }

     /* ==================== باکس اصلی زیرمنو ==================== */
     .main-menu .dropdown-menu,
     .main-menu .dropdown-menu-custom,
     .main-menu ul li ul {
         position: relative !important;
         display: none !important;
         float: none !important;

         width: 100% !important;
         margin: 0 0 15px 0 !important;
         background-color: #f8fafc !important;
         border-radius: 12px !important;
         padding: 5px 0 !important;
         box-shadow: inset 0 3px 10px rgba(0, 0, 0, 0.02) !important;
         border: 1px solid #edf1f5 !important;

         transform: none !important;
         inset: auto !important;
         clear: both !important;
         direction: rtl !important;
     }

     /* مخفی کردن فلش بالا */
     .main-menu .dropdown-menu::before,
     .main-menu .dropdown-menu-custom::before,
     .main-menu ul li ul::before,
     .main-menu .dropdown-menu::after,
     .main-menu .dropdown-menu-custom::after,
     .main-menu ul li ul::after {
         display: none !important;
     }

     /* ==================== آیتم‌های داخل زیرمنو ==================== */
     .main-menu .dropdown-menu a,
     .main-menu .dropdown-menu-custom a,
     .main-menu ul li ul li a {
         color: #4a5568 !important;
         padding: 12px 25px 12px 15px !important;
         display: block !important;
         border-bottom: 1px solid #f1f5f9 !important;
         text-align: right !important;
         font-size: 0.85rem !important;
         text-decoration: none !important;
         font-weight: 500 !important;
         direction: rtl !important;
     }

     .main-menu .dropdown-menu a:last-child,
     .main-menu .dropdown-menu-custom a:last-child,
     .main-menu ul li ul li:last-child a {
         border-bottom: none !important;
     }

     /* ==================== باز و بسته شدن زیرمنو ==================== */
     .main-menu .nav-item.open-menu>.dropdown-menu,
     .main-menu .nav-item.open-menu>.dropdown-menu-custom,
     .main-menu li.open-menu>ul,
     .main-menu .nav-item.active>.dropdown-menu,
     .main-menu li.active>ul {
         display: block !important;
     }

     /* ==================== انیمیشن چرخش فلش منو ==================== */
     .main-menu .nav-item>a i,
     .main-menu li>a i,
     .main-menu .nav-item>a::after,
     .main-menu li>a::after {
         transition: transform 0.3s ease-in-out !important;
         display: inline-block !important;
         font-size: 0.8rem !important;
         color: #a0aec0 !important;
     }

     .main-menu .nav-item.open-menu>a i,
     .main-menu li.open-menu>a i,
     .main-menu .nav-item.active>a i,
     .main-menu li.active>a i,
     .main-menu .nav-item.open-menu>a::after,
     .main-menu li.open-menu>a::after,
     .main-menu .nav-item.active>a::after,
     .main-menu li.active>a::after {
         transform: rotate(180deg) !important;
     }
 }

 /* ================= DROPDOWN ================= */

 .dropdown-menu-custom {

     position: absolute;

     top: 100%;
     right: 0;

     width: 283px;

     background: #fff;

     border-radius: 18px;

     padding: 10px;

     box-shadow: 0 20px 40px rgba(15, 23, 42, .08);

     opacity: 0;
     visibility: hidden;

     transform: translateY(8px);

     transition: .25s;

     z-index: 999999;

     overflow: visible;

 }

 /* فاصله نامرئی */

 .dropdown-menu-custom::before {

     content: "";

     position: absolute;

     top: -12px;

     left: 0;

     width: 100%;

     height: 12px;

 }

 .nav-item:hover>.dropdown-menu-custom {

     opacity: 1;
     visibility: visible;

     transform: translateY(0);

 }

 .dropdown-menu-custom a {

     display: flex;
     align-items: center;
     justify-content: space-between;

     padding: 12px 14px;

     text-decoration: none;

     color: #334155;

     font-size: 13px;

     border-radius: 12px;

     transition: .2s;

     white-space: nowrap;

 }

 .dropdown-menu-custom a:hover {

     background: #f3f8fd;

     color: var(--primary);

     padding-right: 18px;

 }

 .dropdown-menu-custom a i {

     color: var(--primary-light);

     font-size: 12px;

 }

 /* ================= SUB MENU ================= */

 .dropdown-submenu {

     position: relative;

 }

 .dropdown-submenu>.dropdown-menu-custom {

     top: 0;

     right: 100%;

     margin-right: 3px;

     opacity: 0;

     visibility: hidden;

     transform: translateX(10px);

 }

 .dropdown-submenu:hover>.dropdown-menu-custom {

     opacity: 1;

     visibility: visible;

     transform: translateX(0);

 }

 /* ================= SUB MENU ================= */

 .dropdown-submenu {
     position: relative;
 }

 .dropdown-submenu>.dropdown-menu-custom {
     top: 0;
     right: 100%;
     /* باز شدن به سمت چپ با توجه به ساختار راست‌چین */
     margin-right: 4px;
     opacity: 0;
     visibility: hidden;
     transform: translateX(10px);
     transition: .25s;
 }

 .dropdown-submenu:hover>.dropdown-menu-custom {
     opacity: 1;
     visibility: visible;
     transform: translateX(0);
 }

 /* ================= TOOLS ================= */

 .nav-tools {
     gap: 10px;
 }

 .tool-btn {

     width: 42px;
     height: 42px;

     border-radius: 14px;

     background: rgba(255, 255, 255, .8);

     border: 1px solid #edf2f7;

     display: flex;
     align-items: center;
     justify-content: center;

     text-decoration: none;

     color: #475569;

     transition: .25s;

 }

 .tool-btn:hover {

     background: var(--primary);

     color: #fff;

 }

 /* =========================
           HEALTH BAR
        ========================= */

 .health-bar-wrap {
     margin: 22px 0;
 }

 .health-bar {
     height: 58px;
     background: rgba(255, 255, 255, .9);
     border-radius: 20px;
     overflow: hidden;
     display: flex;
     align-items: center;
     box-shadow: 0 5px 18px rgba(0, 0, 0, .04);
 }

 .health-title {
     min-width: 180px;
     height: 100%;
     background:
         linear-gradient(135deg,
             var(--primary),
             var(--primary-light));
     color: #fff;
     font-weight: 700;
     font-size: 14px;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 10px;
     position: relative;
 }

 .health-title::before {
     content: "";
     position: absolute;
     left: -22px;
     top: 0;
     width: 40px;
     height: 100%;
     background: rgba(255, 255, 255, .08);
     transform: skewX(-22deg);
 }

 .health-ticker {
     flex: 1;
     overflow: hidden;
     position: relative;
     height: 100%;
     display: flex;
     align-items: center;
 }

 .health-track {
     white-space: nowrap;
     position: absolute;
     animation: tickerMove 26s linear infinite;
     font-size: 14px;
     color: #334155;
     font-weight: 500;
 }

 .health-track span {
     margin: 0 30px;
     color: var(--primary-light);
 }

 @keyframes tickerMove {
     0% {
         transform: translateX(-100%);
     }

     100% {
         transform: translateX(100%);
     }
 }

 /* =========================
           MOBILE
        ========================= */

 @media(max-width:992px) {

     .nav-shell {
         padding: 16px;
		 margin-bottom: 30px;
     }

     .brand-text h2 {
         font-size: 16px;
     }

     .main-menu {
         margin-top: 20px;
         flex-wrap: wrap;
         justify-content: center;
     }

     .nav-tools {
         margin-top: 18px;
         justify-content: center;
     }

     .health-title {
         min-width: 130px;
         font-size: 13px;
     }

 }


 /* =========================
       MAIN SLIDER
    ========================= */

 .hero-slider {
     position: relative;
     border-radius: 34px;
     overflow: hidden;
     height: 470px;
     box-shadow: 0 18px 50px rgba(15, 76, 129, .10);
 }

 .hero-item {
     position: relative;
     height: 470px;
     overflow: hidden;
 }

 .hero-item img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     transition: 1.2s;
 }

 .hero-item:hover img {
     transform: scale(1.06);
 }

 /* overlay */

 .hero-overlay {
     position: absolute;
     inset: 0;
     background:
         linear-gradient(to left,
             rgba(0, 18, 45, .10),
             rgba(0, 37, 72, .75));
     z-index: 1;
 }

 /* floating gradient */

 .hero-overlay::before {
     content: "";
     position: absolute;
     width: 500px;
     height: 500px;
     border-radius: 50%;
     background:
         radial-gradient(circle,
             rgba(0, 183, 255, .18),
             transparent 70%);
     top: -120px;
     left: -120px;
 }

 /* content */

 .hero-content {
     position: absolute;
     bottom: 70px;
     right: 60px;
     z-index: 3;
     max-width: 600px;
 }

 .hero-badge {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     background: rgba(255, 255, 255, .12);
     backdrop-filter: blur(10px);
     color: #fff;
     padding: 8px 16px;
     border-radius: 50px;
     margin-bottom: 18px;
     font-size: 13px;
     font-weight: 600;
     border: 1px solid rgba(255, 255, 255, .12);
 }

 .hero-title {
     color: #fff;
     font-size: 38px;
     font-weight: 800;
     line-height: 1.8;
     margin-bottom: 14px;
 }

 .hero-desc {
     color: rgba(255, 255, 255, .85);
     font-size: 15px;
     line-height: 2.1;
     margin-bottom: 28px;
 }

 .hero-btns {
     display: flex;
     gap: 14px;
 }

 .hero-btn {
     height: 50px;
     padding: 0 26px;
     border-radius: 18px;
     display: inline-flex;
     align-items: center;
     gap: 10px;
     text-decoration: none;
     font-size: 14px;
     font-weight: 700;
     transition: .3s;
 }

 .hero-btn-primary {
     background:
         linear-gradient(135deg,
             #1da1f2,
             #0f75bc);
     color: #fff;
     box-shadow: 0 10px 30px rgba(29, 161, 242, .30);
 }

 .hero-btn-primary:hover {
     transform: translateY(-4px);
     color: #fff;
 }

 .hero-btn-glass {
     background: rgba(255, 255, 255, .10);
     border: 1px solid rgba(255, 255, 255, .18);
     backdrop-filter: blur(10px);
     color: #fff;
 }

 .hero-btn-glass:hover {
     background: rgba(255, 255, 255, .18);
     color: #fff;
 }

 /* bottom blur */

 .hero-bottom {
     position: absolute;
     bottom: -1px;
     left: 0;
     width: 100%;
     z-index: 2;
 }

 .hero-bottom svg {
     display: block;
     width: 100%;
     height: 120px;
 }

 /* =========================
       SLIDER NAV
    ========================= */

 .hero-slider .owl-nav {
     position: absolute;
     top: 30px;
     left: 30px;
     display: flex;
     gap: 10px;
 }

 .hero-slider .owl-nav button {
     width: 48px;
     height: 48px;
     border-radius: 16px !important;
     border: none !important;
     background: rgba(255, 255, 255, .14) !important;
     backdrop-filter: blur(12px);
     color: #fff !important;
     font-size: 20px !important;
     transition: .3s;
 }

 .hero-slider .owl-nav button:hover {
     background: #1da1f2 !important;
     transform: translateY(-3px);
 }

 /* dots */

 .hero-slider .owl-dots {
     position: absolute;
     bottom: 25px;
     right: 60px;
 }

 .hero-slider .owl-dot span {
     width: 12px !important;
     height: 12px !important;
     background: rgba(255, 255, 255, .35) !important;
     transition: .3s;
 }

 .hero-slider .owl-dot.active span {
     width: 34px !important;
     border-radius: 20px !important;
     background: #1da1f2 !important;
 }

 /* =========================
   SERVICES
========================= */

 .services-section {
     padding: 30px 0;
 }

 /* title */

 .section-head {
     margin-bottom: 42px;
 }

 .mini-title {
     display: inline-flex;
     align-items: center;
     gap: 8px;

     background: rgba(29, 155, 240, .08);
     color: #1484d6;

     padding: 8px 18px;
     border-radius: 50px;

     font-size: 13px;
     font-weight: 700;
 }

 .section-head h2 {
     margin-top: 16px;
     font-size: 34px;
     font-weight: 800;
     color: #16385d;
 }

 /* cards */

 .service-card {
     position: relative;

     background: rgba(255, 255, 255, .92);
     backdrop-filter: blur(12px);

     border-radius: 30px;

     padding: 38px 20px;

     text-align: center;
     text-decoration: none;

     display: block;

     overflow: hidden;

     transition: .35s;

     border: 1px solid rgba(255, 255, 255, .7);

     box-shadow:
         0 10px 30px rgba(15, 76, 129, .05);
 }

 /* hover glow */

 .service-card::before {
     content: "";

     position: absolute;
     width: 180px;
     height: 180px;

     background:
         radial-gradient(circle,
             rgba(29, 155, 240, .14),
             transparent 70%);

     top: -80px;
     right: -80px;

     transition: .4s;
 }

 /* subtle shape */

 .service-shape {
     position: absolute;

     width: 90px;
     height: 90px;

     border-radius: 24px;

     background:
         linear-gradient(135deg,
             rgba(29, 155, 240, .05),
             rgba(15, 76, 129, .02));

     top: -25px;
     left: -25px;

     transform: rotate(25deg);
 }

 /* icon */

 .service-icon {
     width: 82px;
     height: 82px;

     margin: auto auto 22px;

     border-radius: 28px;

     background:
         linear-gradient(135deg,
             #f4fbff,
             #edf6fd);

     display: flex;
     align-items: center;
     justify-content: center;

     position: relative;
     z-index: 2;

     transition: .35s;

     box-shadow:
         0 10px 25px rgba(29, 155, 240, .10);
 }

 .service-icon i {
     font-size: 30px;
     color: #1690e7;
 }

 /* text */

 .service-card h4 {
     font-size: 18px;
     font-weight: 800;
     color: #233044;

     margin-bottom: 10px;

     position: relative;
     z-index: 2;
 }

 .service-card span {
     color: #7b8794;
     font-size: 13px;

     position: relative;
     z-index: 2;
 }

 /* hover */

 .service-card:hover {
     transform: translateY(-10px);
     box-shadow:
         0 22px 45px rgba(15, 76, 129, .12);
 }

 .service-card:hover::before {
     transform: scale(1.3);
 }

 .service-card:hover .service-icon {
     background:
         linear-gradient(135deg,
             #1d9bf0,
             #0f4c81);

     transform: rotate(-6deg);
 }

 .service-card:hover .service-icon i {
     color: #fff;
 }

 /* active */

 .active-service {
     background:
         linear-gradient(135deg,
             #1d9bf0,
             #0f4c81);

     box-shadow:
         0 18px 45px rgba(29, 155, 240, .25);
 }

 .active-service h4,
 .active-service span {
     color: #fff;
 }

 .active-service .service-icon {
     background: rgba(255, 255, 255, .16);
     backdrop-filter: blur(10px);
 }

 .active-service .service-icon i {
     color: #fff;
 }

 /* mobile */

 @media(max-width:768px) {

     .section-head h2 {
         font-size: 26px;
     }

     .service-card {
         padding: 30px 14px;
         border-radius: 24px;
     }

     .service-icon {
         width: 70px;
         height: 70px;
     }

     .service-icon i {
         font-size: 24px;
     }

     .service-card h4 {
         font-size: 15px;
     }

 }


 /* =========================================
   استایل‌های سازمانی کارت خبر (نسخه کامل و نهایی)
========================================= */

 /* ساختار اصلی و بدنه خبر */
 .news-card {
     background: #ffffff;
     border-radius: 16px;
     box-shadow: 0 4px 24px rgba(0, 0, 0, 0.03);
     /* سایه بسیار نرم سازمانی */
     padding: 2.5rem;
     margin-bottom: 2rem;
     border: 1px solid rgba(0, 0, 0, 0.04);
 }

 /* نوار متادیتا (دسته، تاریخ، بازدید، زمان مطالعه) */
 .news-header-meta {
     display: flex;
     justify-content: space-between;
     align-items: center;
     border-bottom: 1px dashed #cbd5e1;
     /* خط زیرین نقطه‌چین ملایم */
     padding-bottom: 1.25rem;
     margin-bottom: 2rem;
 }

 .news-header-meta .d-flex {
     gap: 0.75rem !important;
 }

 .meta-item {
     display: flex;
     align-items: center;
     gap: 0.4rem;
     background: #ffffff;
     padding: 0.35rem 0.9rem;
     border-radius: 50px;
     /* طراحی کپسولی */
     font-size: 0.85rem;
     color: #475569;
     border: 1px solid #e2e8f0;
     box-shadow: 0 2px 4px rgba(0, 0, 0, 0.02);
     /* سایه بسیار ظریف */
     transition: all 0.3s ease;
 }

 .meta-item:hover {
     background: #f8fafc;
     color: #0284c7;
     /* آبی سازمانی */
     border-color: #bae6fd;
     transform: translateY(-1px);
 }

 .meta-item i {
     color: #0d6efd;
     font-size: 1.1rem;
 }

 /* دکمه چاپ (کپسولی همراه با متن) */
 .print-style {
     background: #ffffff;
     color: #475569;
     border-radius: 50px;
     padding: 0.35rem 1rem;
     display: flex;
     align-items: center;
     gap: 0.5rem;
     border: 1px solid #e2e8f0 !important;
     font-size: 0.85rem;
     text-decoration: none;
     box-shadow: 0 2px 4px rgba(0, 0, 0, 0.02);
     transition: all 0.3s ease;
 }

 /* افزودن کلمه چاپ به دکمه برای زمان‌هایی که آیکون لود نمی‌شود */
 .print-style::after {
     content: "چاپ";
     font-weight: 500;
 }

 .print-style:hover {
     background: #f0f9ff;
     color: #0284c7;
     border-color: #bae6fd !important;
 }

 /* عناوین اصلی خبر */
 .news-head .text-secondary {
     color: #0284c7 !important;
     /* رنگ تأکیدی */
     font-size: 0.95rem;
     font-weight: 600;
     margin-bottom: 0.5rem;
 }

 .news-title {
     color: #0f172a;
     font-size: 1.6rem;
     font-weight: 800;
     line-height: 1.6;
     margin-bottom: 1.75rem;
     text-shadow: 0 1px 1px rgba(0, 0, 0, 0.01);
     /* عمق دادن به متن */
 }

 /* لید یا خلاصه خبر (باکس با گرادیان ملایم و نقل‌قول) */
 .news-lead {
     background: linear-gradient(90deg, #f8fafc 0%, #f0f9ff 100%);
     border-right: 4px solid #0ea5e9;
     padding: 1.5rem;
     border-radius: 12px 0 0 12px;
     color: #334155;
     font-size: 1.05rem;
     font-weight: 600;
     line-height: 2;
     margin-bottom: 2.5rem;
     box-shadow: 0 4px 15px rgba(14, 165, 233, 0.05);
     position: relative;
 }

 /* آیکون نقل‌قول پس‌زمینه لید */
 .news-lead::before {
     content: '"';
     position: absolute;
     right: 15px;
     top: -10px;
     font-size: 4rem;
     color: #bae6fd;
     opacity: 0.3;
     font-family: serif;
     line-height: 1;
 }

 /* تصویر اصلی خبر */
 .news-main-image {
     margin-bottom: 2.5rem;
 }

 .news-main-image img {
     border-radius: 16px;
     box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
     max-height: 500px;
     object-fit: cover;
     width: 100%;
 }

 /* بدنه اصلی متن */
 .news-long {
     color: #334155;
     font-size: 1rem;
     line-height: 2.2;
     /* فاصله خطوط استاندارد برای متون طولانی */
     text-align: justify;
 }

 .news-long p {
     margin-bottom: 1.25rem;
 }

 /* =========================================
   بخش شناسه و لینک کوتاه (فوتر خبر)
========================================= */
 .modern-meta-container {
     background: #f8fafc;
     border: 1px solid #e2e8f0;
     border-radius: 16px;
     padding: 1.25rem 1.5rem;
     margin-top: 3rem;
 }

 .meta-box-item {
     display: flex;
     align-items: center;
     gap: 1rem;
 }

 .meta-icon-wrapper {
     background: #e0f2fe;
     width: 48px;
     height: 48px;
     border-radius: 12px;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .meta-icon-wrapper i {
     color: #0284c7;
 }

 .meta-content {
     line-height: 1.2;
 }

 .meta-label {
     font-size: 0.8rem;
     color: #64748b;
     margin-bottom: 0.2rem;
 }

 .meta-number {
     font-size: 1.1rem;
     font-weight: 700;
     color: #0f172a;
 }

 /* باکس لینک کوتاه */
 .modern-input-group {
     display: flex;
     background: #ffffff;
     border: 1px solid #cbd5e1;
     border-radius: 8px;
     overflow: hidden;
     flex-grow: 1;
     max-width: 450px;
     box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.02);
 }

 .modern-input {
     border: none;
     padding: 0.6rem 1rem;
     font-size: 0.9rem;
     color: #475569;
     width: 100%;
     outline: none;
     text-align: left;
     direction: ltr;
     /* برای نمایش صحیح لینک انگلیسی */
     background: transparent;
 }

 .copy-btn-modern {
     background: #f1f5f9;
     border: none;
     border-right: 1px solid #cbd5e1;
     padding: 0.6rem 1.25rem;
     color: #475569;
     cursor: pointer;
     transition: all 0.2s;
     display: flex;
     align-items: center;
     gap: 0.5rem;
     font-weight: 600;
 }

 .copy-btn-modern:hover {
     background: #0284c7;
     color: #ffffff;
 }

 /* برچسب‌ها (Tags) */
 .news-tags {
     display: flex;
     flex-wrap: wrap;
     align-items: center;
     gap: 0.5rem;
 }

 .news-tag {
     background: #ffffff;
     color: #475569 !important;
     border: 1px solid #e2e8f0 !important;
     padding: 0.4rem 0.8rem;
     border-radius: 6px;
     font-weight: 500;
     transition: all 0.2s;
 }

 .news-tag:hover {
     background: #e0f2fe;
     border-color: #bae6fd !important;
     color: #0284c7 !important;
 }

 /* ریسپانسیو برای موبایل */
 @media (max-width: 768px) {
     .news-card {
         padding: 1.5rem;
     }

     .news-header-meta {
         flex-direction: column;
         align-items: flex-start;
         gap: 1rem;
     }

     .modern-input-group {
         max-width: 100%;
     }
 }




 /* title */

 .title-icon {
     width: 65px;
     height: 65px;
     border-radius: 20px;
     background: linear-gradient(135deg, #0f4c81, #1da1f2);
     display: flex;
     align-items: center;
     justify-content: center;
     color: #fff;
     font-size: 24px;
     margin-left: 15px;
     box-shadow: 0 10px 25px rgba(29, 161, 242, .25);
 }

 .section-subtitle {
     font-size: 13px;
     color: #3b82f6;
     font-weight: 700;
 }

 .section-title {
     font-size: 24px;
     font-weight: 900;
     color: #0f172a;
 }

 /* tabs */

 .news-tabs {
     background: rgba(255, 255, 255, .7);
     backdrop-filter: blur(10px);
     padding: 4px;
     border-radius: 12px;
     box-shadow: 0 8px 24px rgba(15, 23, 42, .05);
     gap: 4px;
     border: 1px solid rgba(255, 255, 255, .7);
 }

 .news-tab {
     border: none;
     background: transparent;
     padding: 10px 18px;
     border-radius: 10px;
     font-weight: 700;
     font-size: 14px;
     color: #64748b;
     transition: all .3s ease;
     min-width: 95px;
 }

 .news-tab:hover {
     color: #2563eb;
     background: rgba(37, 99, 235, .05);
 }

 .news-tab.active {
     background: linear-gradient(135deg, #2563eb, #38bdf8);
     color: #fff;
     box-shadow: 0 8px 20px rgba(37, 99, 235, .18);
 }

 /* =========================================
   HEADER SPACING FIX
========================================= */

 .news-topbar {
     margin-bottom: 35px !important;
 }


 .section-subtitle {
     font-size: 12px;
 }

 /* =========================================
   NAVIGATION BUTTONS
========================================= */

 .news-navigation {
     display: flex;
     gap: 10px;
 }

 .news-nav-btn {
     width: 48px;
     height: 48px;
     border: none;
     border-radius: 14px;
     background: #fff;
     color: #0f172a;
     font-size: 20px;
     transition: .3s;
     box-shadow: 0 8px 24px rgba(0, 0, 0, .06);
 }

 .news-nav-btn:hover {
     background: linear-gradient(135deg, #2563eb, #38bdf8);
     color: #fff;
     transform: translateY(-3px);
 }

 /* =========================================
   MOBILE
========================================= */

 @media(max-width:992px) {

     .news-tabs {
         width: 100%;
         overflow: auto;
         padding: 4px;
     }

     .news-tab {
         white-space: nowrap;
         min-width: auto;
         padding: 9px 16px;
         font-size: 13px;
     }

 }

 /* ---------------- Popular Tabs Widget ---------------- */

 .b5-popular-widget {
     direction: rtl;
     background: #fff;
     border: 1px solid #e5eaf0;
     border-radius: 16px;
     overflow: hidden;
     box-shadow: 0 10px 28px rgba(11, 46, 89, 0.08);
     transition: box-shadow 0.25s ease, transform 0.25s ease;
 }

 .b5-popular-widget:hover {
     box-shadow: 0 14px 34px rgba(11, 46, 89, 0.12);
 }

 /* Tabs Header */
 .b5-popular-widget .nav-tabs {
     border: 0;
     background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
     padding: 8px 8px 0;
     gap: 6px;
 }

 .b5-popular-widget .nav-tabs .nav-item {
     margin: 0;
 }

 .b5-popular-widget .nav-tabs .nav-link {
     width: 100%;
     border: 0 !important;
     background: transparent;
     color: #64748b;
     font-size: 0.9rem;
     font-weight: 800;
     padding: 14px 10px;
     border-radius: 12px 12px 0 0 !important;
     position: relative;
     transition: all 0.25s ease;
     text-align: center !important;
     box-shadow: none;
 }

 .b5-popular-widget .nav-tabs .nav-link:hover {
     color: var(--primary-color);
     background: rgba(30, 96, 163, 0.06);
 }

 .b5-popular-widget .nav-tabs .nav-link.active {
     color: var(--primary-color) !important;
     background: #fff !important;
     box-shadow: 0 -4px 14px rgba(11, 46, 89, 0.06);
 }

 .b5-popular-widget .nav-tabs .nav-link.active::after {
     content: "";
     position: absolute;
     right: 18px;
     left: 18px;
     bottom: 0;
     height: 3px;
     border-radius: 10px 10px 0 0;
     background: linear-gradient(90deg,
             var(--accent-color),
             var(--primary-color));
 }

 /* Tab Content */
 .b5-popular-widget .tab-content {
     background: #fff;
     padding: 10px 0 6px;
 }

 .b5-popular-widget .tab-pane {
     animation: popularFadeUp 0.25s ease both;
 }

 @keyframes popularFadeUp {
     from {
         opacity: 0;
         transform: translateY(6px);
     }

     to {
         opacity: 1;
         transform: translateY(0);
     }
 }

 /* Remove CMS Design Empty Spaces if needed */
 .b5-popular-widget .design-container {
     min-height: unset;
 }

 .b5-popular-widget .widget-container {
     padding: 0;
 }

 /* Sidebar List */
 .b5-popular-widget .side-widget {
     position: relative;
     background: #fff;
 }

 .b5-popular-widget .sidebar-list {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .b5-popular-widget .sidebar-list li {
     margin: 0;
     padding: 0;
 }

 .b5-popular-widget .sidebar-list li:not(:last-child) {
     border-bottom: 1px solid #eef2f6;
 }

 .b5-popular-widget .sidebar-list a {
     display: flex;
     align-items: center;
     position: relative;
     min-height: 58px;
     padding: 12px 18px 12px 14px;
     color: #334155;
     text-decoration: none;
     transition: all 0.25s ease;
     overflow: hidden;
 }

 .b5-popular-widget .sidebar-list a::before {
     content: "";
     width: 6px;
     height: 6px;
     background: var(--warm-highlight);
     border-radius: 50%;
     flex: 0 0 6px;
     margin-left: 10px;
     box-shadow: 0 0 0 4px rgba(243, 156, 18, 0.12);
     transition: all 0.25s ease;
 }

 .b5-popular-widget .sidebar-list a::after {
     content: "";
     position: absolute;
     right: 0;
     top: 12px;
     bottom: 12px;
     width: 3px;
     border-radius: 8px 0 0 8px;
     background: var(--primary-color);
     opacity: 0;
     transform: scaleY(0.4);
     transition: all 0.25s ease;
 }

 .b5-popular-widget .sidebar-list a:hover {
     background: linear-gradient(90deg,
             rgba(0, 168, 255, 0.04),
             rgba(11, 46, 89, 0.08));
     color: var(--primary-color);
     padding-right: 24px;
 }

 .b5-popular-widget .sidebar-list a:hover::before {
     background: var(--accent-color);
     box-shadow: 0 0 0 5px rgba(0, 168, 255, 0.14);
 }

 .b5-popular-widget .sidebar-list a:hover::after {
     opacity: 1;
     transform: scaleY(1);
 }

 /* Item Title */
 .b5-popular-widget .sidebar-list h5 {
     margin: 0;
     padding: 0;
     border: 0 !important;
     color: inherit;
     font-size: 0.92rem;
     font-weight: 700;
     line-height: 1.8;
     transition: color 0.25s ease;

     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
     text-overflow: ellipsis;
 }

 /* Optional Bottom Fade */
 .b5-popular-widget .shadow-white {
     display: none;
 }

 /* Sticky Wrapper */
 .make-it-sticky {
     position: sticky;
     top: 20px;
     align-self: flex-start;
 }

 /* Bootstrap Tooltip */
 .custom-tooltip {
     --bs-tooltip-bg: var(--primary-color);
     --bs-tooltip-color: #fff;
     --bs-tooltip-padding-x: 10px;
     --bs-tooltip-padding-y: 7px;
     --bs-tooltip-border-radius: 8px;
     --bs-tooltip-font-size: 0.78rem;
 }

 /* Editor Buttons - جلوگیری از خراب شدن ظاهر در حالت طراحی */
 .b5-popular-widget .design-actions {
     font-size: 12px;
 }

 /* Responsive */
 @media (max-width: 768px) {
     .make-it-sticky {
         position: relative;
         top: auto;
         z-index: 10;
         padding: 0;
     }

     .b5-popular-widget {
         border-radius: 14px;
     }

     .b5-popular-widget .nav-tabs .nav-link {
         font-size: 0.85rem;
         padding: 12px 8px;
     }

     .b5-popular-widget .sidebar-list a {
         min-height: 54px;
         padding: 11px 16px 11px 12px;
     }

     .b5-popular-widget .sidebar-list a:hover {
         padding-right: 20px;
     }

     .b5-popular-widget .sidebar-list h5 {
         font-size: 0.88rem;
     }

     #searchForm .input-group .input-group-text {
         position: absolute;
         right: 10px;
         top: 5px !important;
         z-index: 5;
     }
 }

 /* Sticky Wrapper */
 .make-it-sticky {
     position: sticky;
     top: 20px;
     align-self: flex-start;
 }

 /* =========================================
   SYSTEMS SECTION — ULTRA MODERN
========================================= */

 .systems-section {
     padding: 30px 0;
     background:
         linear-gradient(to bottom, #f8fbff, #eef5ff);
     position: relative;

 }

 /* spacing exactly like news section */
 .news-ultra-section {
     margin-bottom: 0;
     padding-bottom: 0;

 }

 .systems-section .container {
     max-width: 1320px;
 }

 /* =========================================
   HEADER
========================================= */

 .systems-header {
     margin-bottom: 38px;
 }

 .systems-title-wrap {
     gap: 16px;
 }

 .systems-icon {
     width: 65px;
     height: 65px;
     border-radius: 20px;
     background: linear-gradient(135deg, #2563eb, #38bdf8);
     display: flex;
     align-items: center;
     justify-content: center;
     color: #fff;
     font-size: 24px;
     box-shadow: 0 10px 25px rgba(29, 161, 242, .25);
 }

 .systems-title-text span {
     font-size: 13px;
     color: #3b82f6;
     font-weight: 700;
     display: block;
     margin-bottom: 3px;
 }

 .systems-title-text h2 {
     margin: 0;
     font-size: 24px;
     font-weight: 900;
     color: #0f172a;
 }

 /* =========================================
   WRAPPER
========================================= */

 .systems-wrapper {
     display: flex;
     gap: 28px;
     align-items: stretch;
 }

 .systems-content {
     width: 100%;
 }

 /* =========================================
   GRID
========================================= */

 .systems-grid {
     flex: 1;
     background: rgba(255, 255, 255, .72);
     backdrop-filter: blur(12px);

     border-radius: 34px;
     border: 1px solid rgba(255, 255, 255, .7);

     padding: 38px;

     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 24px;

     box-shadow:
         0 15px 40px rgba(15, 23, 42, .05);

     min-height: 100%;
 }

 /* =========================================
   SYSTEM ITEM
========================================= */

 .system-item {
     position: relative;

     background: #fbfdff;

     border: 1px solid #edf3ff;

     border-radius: 28px;

     min-height: 180px;

     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;

     text-decoration: none !important;



     transition:
         transform .45s cubic-bezier(.22, 1, .36, 1),
         box-shadow .45s cubic-bezier(.22, 1, .36, 1),
         border-color .45s ease,
         background .45s ease;
 }

 /* glow bg */

 .system-item::before {
     content: "";
     position: absolute;
     inset: 0;

     background:
         linear-gradient(135deg,
             rgba(37, 99, 235, .08),
             rgba(56, 189, 248, .04));

     opacity: 0;

     transition: .45s ease;
 }

 .system-item:hover::before {
     opacity: 1;
 }

 .system-item:hover {
     transform:
         translateY(-10px);

     border-color: #bfdbfe;

     box-shadow:
         0 20px 45px rgba(37, 99, 235, .12);
 }

 /* icon */

 .system-icon {
     width: 78px;
     height: 78px;

     border-radius: 24px;

     background: #eff6ff;
     border: 1px solid #dbeafe;

     display: flex;
     align-items: center;
     justify-content: center;

     margin-bottom: 18px;

     transition:
         all .55s cubic-bezier(.22, 1, .36, 1);
 }

 .system-icon img {
     width: 41px;
 }

 .system-icon i {
     font-size: 30px;
     color: #2563eb;

     transition:
         all .55s cubic-bezier(.22, 1, .36, 1);
 }

 .system-item:hover .system-icon {
     background:
         linear-gradient(135deg, #2563eb, #38bdf8);

     transform:
         rotate(6deg) scale(1.08);
 }

 .system-item:hover .system-icon i {
     color: #fff;
     transform: scale(1.08);
 }

 /* title */

 .system-item h5 {
     margin: 0;

     font-size: 15px;
     font-weight: 800;

     color: #0f172a;

     transition: .35s ease;
 }

 .system-item:hover h5 {
     color: #2563eb;
 }

 /* =========================================
   SIDEBAR
========================================= */

 .systems-sidebar {
     width: 340px;

     display: flex;
     flex-direction: column;

     gap: 18px;
 }

 /* equal height */
 .systems-grid,
 .systems-sidebar {
     min-height: 100%;
 }

 /* card */

 .systems-category {
     flex: 1;
     width: 100%;
     text-align: right;
     background: none;
     outline: none;
     background: rgba(255, 255, 255, .72);

     backdrop-filter: blur(10px);

     border: 1px solid rgba(219, 231, 255, .8);

     border-radius: 28px;

     padding: 12px 24px;

     display: flex;
     align-items: center;
     justify-content: space-between;

     transition:
         transform .45s cubic-bezier(.22, 1, .36, 1),
         box-shadow .45s cubic-bezier(.22, 1, .36, 1),
         border-color .45s ease,
         background .45s ease;

     cursor: pointer;

     position: relative;

 }

 /* bootstrap active */
 .systems-category.active,
 .systems-category.show {
     background: #f4f8ff;
     border-color: #93c5fd;

     box-shadow:
         0 16px 35px rgba(37, 99, 235, .10);
 }

 /* smooth fade bootstrap */
 .tab-pane {
     animation: fadeSystem .45s ease;
 }

 @keyframes fadeSystem {

     from {
         opacity: 0;
         transform: translateY(12px);
     }

     to {
         opacity: 1;
         transform: translateY(0);
     }

 }

 .systems-category::before {
     content: "";

     position: absolute;
     inset: 0;

     background:
         linear-gradient(135deg,
             rgba(37, 99, 235, .06),
             rgba(56, 189, 248, .02));

     opacity: 0;

     transition: .45s ease;
 }

 .systems-category:hover::before {
     opacity: 1;
 }

 .systems-category:hover {
     transform: translateY(-6px);

     border-color: #93c5fd;

     box-shadow:
         0 18px 40px rgba(37, 99, 235, .10);
 }

 .systems-category.active {
     background: #f4f8ff;
     border-color: #93c5fd;

     box-shadow:
         0 16px 35px rgba(37, 99, 235, .10);
 }

 /* icon */

 .systems-category i {
     font-size: 24px;
     color: #2563eb;

     transition: .4s ease;
 }

 .systems-category:hover i {
     transform: scale(1.1);
 }

 /* text */

 .systems-category h4 {
     margin: 0;

     font-size: 16px;
     font-weight: 800;

     color: #081028;
 }

 .systems-category p {
     margin: 5px 0 0;

     font-size: 11px;

     color: #7c879b;
 }

 /* =========================================
   RESPONSIVE
========================================= */

 @media(max-width:1200px) {

     .systems-wrapper {
         flex-direction: column;
     }

     .systems-sidebar {
         width: 100%;
     }

     .systems-grid {
         grid-template-columns: repeat(2, 1fr);
     }

 }

 @media(max-width:768px) {


     .systems-grid {
         grid-template-columns: 1fr;
         padding: 24px;
     }

     .systems-title-text h2 {
         font-size: 26px;
     }

     .systems-category {
         min-height: 110px;
     }

 }

 /* =========================================
EVENTS GALLERY MINIMAL
========================================= */

 .events-gallery-section {
     padding: 90px 0;
     background: #f4f7fb;
 }

 /* header */

 .events-gallery-header {
     margin-bottom: 38px;
 }

 .events-gallery-icon {
     width: 64px;
     height: 64px;

     border-radius: 20px;

     background: linear-gradient(135deg, #2563eb, #38bdf8);

     display: flex;
     align-items: center;
     justify-content: center;

     color: #fff;
     font-size: 24px;

     margin-left: 16px;

     box-shadow:
         0 12px 30px rgba(37, 99, 235, .18);
 }

 .events-gallery-title span {
     display: block;

     font-size: 13px;
     font-weight: 700;

     color: #2563eb;

     margin-bottom: 5px;
 }

 .events-gallery-title h2 {
     margin: 0;
     font-size: 24px;
     font-weight: 900;
     color: #0f172a;
 }

 /* card */

 .event-gallery-card {
     position: relative;

     border-radius: 28px;

     overflow: hidden;

     height: 368px;

     background: #fff;

     box-shadow:
         0 10px 35px rgba(15, 23, 42, .06);

     transition:
         transform .4s ease,
         box-shadow .4s ease;
 }

 .event-gallery-card:hover {
     transform: translateY(-8px);

     box-shadow:
         0 20px 50px rgba(37, 99, 235, .14);
 }

 .event-gallery-card img {
     width: 100%;
     height: 100%;

     object-fit: cover;

     transition: 1s ease;
 }

 .event-gallery-card:hover img {
     transform: scale(1.05);
 }

 /* overlay */

 .event-gallery-overlay {
     position: absolute;
     inset: 0;

     background:
         linear-gradient(to top,
             rgba(15, 23, 42, .55),
             rgba(15, 23, 42, .08));

     opacity: 0;

     display: flex;
     align-items: center;
     justify-content: center;

     transition: .35s ease;
 }

 .event-gallery-card:hover .event-gallery-overlay {
     opacity: 1;
 }

 /* button */

 .event-gallery-btn {
     width: 64px;
     height: 64px;

     border: none;

     border-radius: 20px;

     background: rgba(255, 255, 255, .18);

     backdrop-filter: blur(10px);

     color: #fff;

     font-size: 22px;

     transition: .35s ease;
 }

 .event-gallery-btn:hover {
     background: #fff;

     color: #2563eb;

     transform: scale(1.08);
 }

 /* =========================================
MODAL
========================================= */

 .event-modal-content {
     position: relative;

     background: transparent;

     border: none;
 }

 .event-modal-content img {
     width: 100%;

     border-radius: 28px;
 }

 /* close */

 .event-modal-close {
     position: absolute;

     top: 20px;
     left: 20px;

     width: 52px;
     height: 52px;

     border: none;

     border-radius: 18px;

     background: rgba(15, 23, 42, .55);

     backdrop-filter: blur(12px);

     color: #fff;

     font-size: 20px;

     z-index: 20;

     transition: .3s ease;
 }

 .event-modal-close:hover {
     background: #fff;

     color: #0f172a;

     transform: rotate(90deg);
 }

 /* modal backdrop */

 .modal-content {
     box-shadow: none;
 }

 .modal-backdrop.show {
     opacity: .88;
 }

 /* responsive */

 @media(max-width:992px) {

     .event-gallery-card {
         height: 420px;
     }

     .events-gallery-title h2 {
         font-size: 28px;
     }

 }

 @media(max-width:768px) {

        .events-gallery-section {
        padding: 20px 0;
    }

     .event-gallery-card {
         height: 340px;

         border-radius: 22px;
     }

     .events-gallery-icon {
         width: 56px;
         height: 56px;

         border-radius: 18px;

         font-size: 20px;
     }

     .events-gallery-title h2 {
         font-size: 24px;
     }

 }

 /* =========================
   HEALTH OVERVIEW
========================= */

 .health-overview {
     padding: 90px 0;
 }

 .overview-box {
     background: #fff;
     border-radius: 38px;
     padding: 60px;
     position: relative;


     box-shadow:
         0 10px 40px rgba(15, 76, 129, .05);
 }

 /* subtle bg */

 .overview-box::before {
     content: "";

     position: absolute;
     left: -120px;
     top: -120px;

     width: 320px;
     height: 320px;

     border-radius: 50%;

     background:
         radial-gradient(circle,
             rgba(29, 155, 240, .08),
             transparent 70%);
 }

 /* =========================
   CONTENT
========================= */

 .mini-label {
     display: inline-flex;
     align-items: center;
     gap: 8px;

     font-size: 13px;
     font-weight: 700;

     color: #1d9bf0;

     margin-bottom: 18px;
 }

 .overview-content h2 {
     font-size: 42px;
     font-weight: 900;
     line-height: 1.8;

     color: #163b63;

     margin-bottom: 20px;
 }

 .overview-content h2 span {
     color: #1d9bf0;
 }

 .overview-content p {
     font-size: 15px;
     line-height: 2.1;

     color: #6b7280;

     max-width: 420px;

     margin-bottom: 28px;
 }

 .overview-btn {
     display: inline-flex;
     align-items: center;
     justify-content: center;

     height: 48px;
     padding: 0 24px;

     border-radius: 14px;

     background:
         linear-gradient(135deg,
             #1d9bf0,
             #0f4c81);

     color: #fff;
     text-decoration: none;

     font-size: 14px;
     font-weight: 700;

     transition: .3s;
 }

 .overview-btn:hover {
     transform: translateY(-3px);
     color: #fff;
 }

 /* =========================
   LAYOUT
========================= */

 .overview-layout {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 30px;
 }

 /* =========================
   MAP
========================= */

 .map-box {
     width: 420px;
     height: 420px;

     border-radius: 50%;

     background: #f8fbff;

     border: 1px dashed rgba(29, 155, 240, .25);

     display: flex;
     align-items: center;
     justify-content: center;

     position: relative;
 }

 .map-circle {
     position: absolute;

     width: 320px;
     height: 320px;

     border-radius: 50%;

     border: 1px dashed rgba(29, 155, 240, .15);
 }

 .map-box img {
     width: 314px;
     position: relative;
     z-index: 2;
 }

 .map-badge {
     position: absolute;

     top: 70px;
     right: 70px;

     background: #fff;

     height: 42px;
     padding: 0 16px;

     border-radius: 14px;

     display: flex;
     align-items: center;
     gap: 10px;

     font-size: 13px;
     font-weight: 700;

     box-shadow:
         0 10px 25px rgba(15, 76, 129, .06);
 }

 .map-badge span {
     width: 10px;
     height: 10px;

     border-radius: 50%;

     background: #22c55e;
 }

 /* =========================
   STATS
========================= */

 .stats-column {
     display: flex;
     flex-direction: column;
     gap: 18px;
 }

 .mini-card {
     width: 210px;

     background: #f8fbff;

     border-radius: 24px;

     padding: 28px;

     transition: .3s;
 }

 .mini-card i {
     width: 54px;
     height: 54px;

     border-radius: 16px;

     background: rgba(29, 155, 240, .08);

     display: flex;
     align-items: center;
     justify-content: center;

     color: #1d9bf0;

     font-size: 22px;

     margin-bottom: 22px;
 }

 .mini-card strong {
     display: block;

     font-size: 25px;
     font-weight: 900;

     color: #163b63;

     margin-bottom: 8px;
 }

 .mini-card span {
     font-size: 14px;
     font-weight: 600;

     color: #64748b;
 }

 .mini-card:hover {
     transform: translateY(-6px);
 }

 .mini-card.active {
     background:
         linear-gradient(135deg,
             #1d9bf0,
             #0f4c81);
 }

 .mini-card.active i {
     background: rgba(255, 255, 255, .14);
     color: #fff;
 }

 .mini-card.active strong,
 .mini-card.active span {
     color: #fff;
 }

 /* =========================
   MOBILE
========================= */

 @media(max-width:992px) {

     .overview-box {
         padding: 35px;
     }

     .overview-layout {
         flex-direction: column;
         margin-top: 50px;
     }

     .map-box {
         width: 320px;
         height: 320px;
     }

     .map-circle {
         width: 240px;
         height: 240px;
     }

     .map-box img {
         width: 180px;
     }

 }

 @media(max-width:768px) {

     .overview-content h2 {
         font-size: 30px;
     }

     .mini-card {
         width: 100%;
     }

     .stats-column {
         width: 100%;
     }

 }

 .journal-showcase {
     position: relative;
     padding: 30px 0;

 }

 /* background */
 .journal-showcase::before {
     content: "";
     position: absolute;
     top: -150px;
     right: -120px;
     width: 500px;
     height: 500px;
     border-radius: 50%;
     background:
         radial-gradient(circle,
             rgba(59, 130, 246, .08),
             transparent 70%);
 }

 .journal-showcase::after {
     content: "";
     position: absolute;
     inset: 0;
     background-image:
         linear-gradient(rgba(59, 130, 246, .03) 1px, transparent 1px),
         linear-gradient(90deg, rgba(59, 130, 246, .03) 1px, transparent 1px);
     background-size: 34px 34px;
     mask-image: linear-gradient(to bottom, rgba(0, 0, 0, .2), transparent);
     pointer-events: none;
 }

 /* header */
 .journal-head {
     margin-bottom: 42px;
     position: relative;
     z-index: 2;
 }

 .journal-title-wrap {
     gap: 16px;
 }

 .journal-icon {
     width: 54px;
     height: 54px;
     border-radius: 18px;
     background: linear-gradient(135deg, #2563eb, #3b82f6);
     display: flex;
     align-items: center;
     justify-content: center;
     color: #fff;
     font-size: 20px;
     box-shadow: 0 10px 30px rgba(37, 99, 235, .18);
 }

 .journal-mini {
     font-size: 11px;
     color: #7b8aa0;
     display: block;
     margin-bottom: 6px;
 }

 .journal-title {
     margin: 0;
     font-size: 24px;
     font-weight: 800;
     color: #0f172a;
 }

 .journal-archive-btn {
     height: 42px;
     padding: 0 18px;
     border-radius: 14px;
     background: rgba(255, 255, 255, .65);
     border: 1px solid rgba(37, 99, 235, .12);
     display: inline-flex;
     align-items: center;
     justify-content: center;
     font-size: 12px;
     color: #2563eb;
     text-decoration: none;
     transition: .2s ease;
     backdrop-filter: blur(10px);
 }

 .journal-archive-btn:hover {
     background: #2563eb;
     color: #fff;
 }

 /* journals */
 /* کانتینر اصلی */
 .journal-grid {
     display: flex;
     flex-wrap: wrap;
     gap: 28px;
     /* فاصله بین کارت‌ها کمی بیشتر */
     justify-content: flex-start;
     padding: 20px 0;
 }

 /* کارت بزرگ‌تر و لوکس */
 .journal-card {
     display: block;
     width: 230px;
     /* افزایش پهنا */
     background: #ffffff;
     border: 1px solid #e2e8f0;
     border-radius: 16px;
     /* گوشه‌های کمی گردتر برای تناسب با سایز بزرگ */
     padding: 16px;
     /* پدینگ داخلی بیشتر */
     text-decoration: none !important;
     transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
 }

 /* افکت هاور با تأثیر عمیق‌تر */
 .journal-card:hover {
     border-color: #cbd5e1;
     box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12);
     transform: translateY(-8px);
 }

 /* کاور مجله - بزرگتر */
 .journal-card .journal-cover {
     width: 100%;
     aspect-ratio: 3 / 4;
     border-radius: 10px;
     overflow: hidden;
     background-color: #f1f5f9;
     margin-bottom: 16px;
 }

 .journal-card .journal-cover img {
     width: 100%;
     height: 100%;
     object-fit: cover;
 }

 /* عنوان مجله - خواناتر */
 .journal-card .journal-info h3 {
     margin: 0;
     font-size: 1rem;
     /* فونت کمی بزرگتر */
     font-weight: 700;
     color: #0f172a;
     text-align: right;
     line-height: 1.5;
     /* جلوگیری از شکستن نامنظم متن */
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
 }


 /* articles */
 .articles-modern-list {
     display: flex;
     flex-direction: column;
     gap: 14px;
     position: relative;
     z-index: 2;
 }

 .article-modern-item {
     position: relative;
     min-height: 108px;
     border-radius: 24px;
     padding: 22px 26px;
     background: rgba(255, 255, 255, .55);
     border: 1px solid rgba(255, 255, 255, .75);
     backdrop-filter: blur(14px);
     text-decoration: none;
     display: flex;
     align-items: center;
     justify-content: space-between;

     transition: .25s ease;
 }

 .article-modern-item:hover {
     transform: translateX(-4px);
     border-color: rgba(37, 99, 235, .15);
     box-shadow: 0 18px 40px rgba(15, 23, 42, .05);
 }

 .article-line {
     position: absolute;
     right: 0;
     top: 24px;
     bottom: 24px;
     width: 4px;
     border-radius: 30px;
     background: linear-gradient(to bottom, #2563eb, #60a5fa);
 }

 .article-content {
     padding-right: 18px;
 }

 .article-tag {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     height: 26px;
     padding: 0 12px;
     border-radius: 30px;
     background: rgba(37, 99, 235, .08);
     color: #2563eb;
     font-size: 10px;
     font-weight: 700;
     margin-bottom: 12px;
 }

 .article-content h3 {
     margin: 0;
     font-size: 16px;
     line-height: 2;
     color: #0f172a;
     font-weight: 500;
     max-width: 88%;
 }

 .article-arrow {
     width: 44px;
     height: 44px;
     border-radius: 14px;
     background: rgba(37, 99, 235, .06);
     display: flex;
     align-items: center;
     justify-content: center;
     color: #2563eb;
     font-size: 20px;
     transition: .2s ease;
     flex-shrink: 0;
 }

 .article-modern-item:hover .article-arrow {
     background: #2563eb;
     color: #fff;
 }

 /* responsive */
 @media(max-width:992px) {

     .journal-grid {
         margin-bottom: 20px;
     }

     .journal-title {
         font-size: 26px;
     }

     .article-content h3 {
         max-width: 100%;
         font-size: 14px;
         line-height: 1.9;
     }

 }

 @media(max-width:768px) {

     .journal-grid {
         grid-template-columns: 1fr;
     }

     .article-modern-item {
         padding: 18px;
         border-radius: 20px;
     }

     .journal-cover {
         height: 260px;
     }

 }

 .uni-glance-section {
     position: relative;
     padding: 30px 0;

 }

 /* background */
 .uni-glance-section::before {
     content: "";
     position: absolute;
     top: -180px;
     left: -180px;
     width: 500px;
     height: 500px;
     border-radius: 50%;
     background:
         radial-gradient(circle,
             rgba(37, 99, 235, .07),
             transparent 70%);
 }

 .uni-glance-section::after {
     content: "";
     position: absolute;
     inset: 0;
     background-image:
         linear-gradient(rgba(37, 99, 235, .03) 1px, transparent 1px),
         linear-gradient(90deg, rgba(37, 99, 235, .03) 1px, transparent 1px);
     background-size: 34px 34px;
     mask-image: linear-gradient(to bottom, rgba(0, 0, 0, .18), transparent);
     pointer-events: none;
 }

 /* header */
 .uni-glance-head {
     margin-bottom: 34px;
     position: relative;
     z-index: 2;
     gap: 16px;
 }

 .uni-mini-title {
     display: block;
     font-size: 11px;
     color: #7b8aa0;
     margin-bottom: 6px;
 }

 .uni-main-title {
     margin: 0;
     font-size: 24px;
     font-weight: 800;
     color: #0f172a;
 }

 .uni-head-icon {
     width: 52px;
     height: 52px;
     border-radius: 18px;
     background: linear-gradient(135deg, #2563eb, #3b82f6);
     display: flex;
     align-items: center;
     justify-content: center;
     color: #fff;
     font-size: 20px;
     box-shadow: 0 10px 25px rgba(37, 99, 235, .16);
 }

 /* tabs */
 .uni-modern-tabs {
     gap: 14px;
     margin-bottom: 34px;
     position: relative;
     z-index: 2;
 }

 .uni-modern-tabs .nav-link {
     height: 54px;
     padding: 0 22px;
     border-radius: 18px;
     border: 1px solid rgba(37, 99, 235, .12);
     background: rgba(255, 255, 255, .65);
     backdrop-filter: blur(10px);
     color: #64748b;
     font-size: 13px;
     font-weight: 600;
     display: flex;
     align-items: center;
     gap: 10px;
     transition: .2s ease;
 }

 .uni-modern-tabs .nav-link i {
     font-size: 17px;
 }

 .uni-modern-tabs .nav-link:hover {
     border-color: rgba(37, 99, 235, .25);
     color: #2563eb;
 }

 .uni-modern-tabs .nav-link.active {
     background: linear-gradient(135deg, #2563eb, #3b82f6);
     border-color: transparent;
     color: #fff !important;
     box-shadow: 0 10px 24px rgba(37, 99, 235, .16);
 }

 /* image */
 .uni-image-card {
     position: relative;
     height: 100%;
     min-height: 470px;
     border-radius: 34px;

 }

 .uni-image-card img {
     width: 100%;
     height: 100%;
     object-fit: cover;
 }

 .uni-image-overlay {
     position: absolute;
     inset: 0;
     background:
         linear-gradient(to top,
             rgba(15, 23, 42, .35),
             transparent 45%);
 }

 .uni-image-badge {
     position: absolute;
     right: 24px;
     bottom: 24px;
     height: 46px;
     padding: 0 18px;
     border-radius: 16px;
     background: rgba(255, 255, 255, .92);
     display: inline-flex;
     align-items: center;
     gap: 10px;
     color: #0f172a;
     font-size: 12px;
     font-weight: 700;
     backdrop-filter: blur(10px);
 }

 .uni-image-badge i {
     color: #2563eb;
 }

 /* services */
 .uni-services-box {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 14px;
     margin-bottom: 18px;
 }

 .uni-service-item {
     height: 150px;
     border-radius: 26px;
     background: rgba(255, 255, 255, .7);
     border: 1px solid rgba(255, 255, 255, .7);
     backdrop-filter: blur(12px);
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     text-decoration: none;
     transition: .2s ease;
     padding: 15px;
 }

 .uni-service-item:hover {
     transform: translateY(-4px);
     border-color: rgba(37, 99, 235, .18);
     box-shadow: 0 15px 35px rgba(15, 23, 42, .05);
 }

 .uni-service-icon {
     width: 56px;
     height: 56px;
     border-radius: 18px;
     background: rgba(37, 99, 235, .08);
     display: flex;
     align-items: center;
     justify-content: center;
     margin-bottom: 16px;
     color: #2563eb;
     font-size: 24px;
 }

 .uni-service-item span {
     font-size: 13px;
     font-weight: 600;
     color: #0f172a;
     text-align: center;
     line-height: 1.8;
 }

 /* stats */
 .uni-stats-grid {
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     gap: 14px;
 }

 .uni-stat-card {
     height: 150px;
     border-radius: 26px;
     background: rgba(255, 255, 255, .68);
     border: 1px solid rgba(255, 255, 255, .75);
     backdrop-filter: blur(12px);
     padding: 24px;
     display: flex;
     flex-direction: column;
     justify-content: center;
     transition: .2s ease;
     position: relative;

 }

 .uni-stat-card::before {
     content: "";
     position: absolute;
     top: -40px;
     left: -40px;
     width: 100px;
     height: 100px;
     border-radius: 50%;
     background:
         radial-gradient(circle,
             rgba(37, 99, 235, .09),
             transparent 70%);
 }

 .uni-stat-card:hover {
     transform: translateY(-4px);
     border-color: rgba(37, 99, 235, .18);
     box-shadow: 0 15px 35px rgba(15, 23, 42, .05);
 }

 .uni-stat-card h3 {
     margin: 0 0 8px;
     font-size: 22px;
     font-weight: 800;
     color: #2563eb;
 }

 .uni-stat-card span {
     font-size: 13px;
     color: #64748b;
     font-weight: 600;
 }

 /* responsive */
 @media(max-width:992px) {

     .uni-services-box {
         grid-template-columns: repeat(2, 1fr);
     }

     .uni-image-card {
         min-height: 380px;
         margin-bottom: 20px;
     }

 }

 @media(max-width:768px) {

     .uni-modern-tabs {
         gap: 10px;
     }

     .uni-modern-tabs .nav-link {
         width: 100%;
         justify-content: center;
     }

     .uni-services-box,
     .uni-stats-grid {
         grid-template-columns: 1fr;
     }

     .uni-main-title {
         font-size: 26px;
     }

     .uni-image-card {
         min-height: 300px;
     }

 }

 /* =========================================
SECTION
========================================= */

 /* =========================================
   MULTIMEDIA SECTION
========================================= */

 .media-ultra-section {
     position: relative;
     background:
         linear-gradient(to bottom, #f8fbff, #eef5ff);
 }

 /* =========================================
   TOPBAR
========================================= */

 .media-topbar {
     margin-bottom: 40px;
 }

 /* =========================================
   TITLE
========================================= */

 .section-title-wrap {
     display: flex;
     align-items: center;
 }

 .title-icon {
     width: 68px;
     height: 68px;
     border-radius: 22px;
     background:
         linear-gradient(135deg, #0f4c81, #1da1f2);
     display: flex;
     align-items: center;
     justify-content: center;
     color: #fff;
     font-size: 26px;
     margin-left: 16px;
     box-shadow: 0 15px 35px rgba(37, 99, 235, .18);
 }

 .section-subtitle {
     font-size: 13px;
     font-weight: 700;
     color: #3b82f6;
     display: block;
     margin-bottom: 4px;
 }

 .section-title {
     font-size: 34px;
     font-weight: 900;
     color: #0f172a;
     line-height: 1.3;
 }

 /* =========================================
   TABS
========================================= */

 .media-tabs {
     background: rgba(255, 255, 255, .7);
     backdrop-filter: blur(12px);
     border-radius: 16px;
     padding: 5px;
     box-shadow: 0 10px 35px rgba(15, 23, 42, .05);
     border: 1px solid rgba(255, 255, 255, .7);
     gap: 5px;
 }

 .media-tabs .nav-link {
     border: none;
     background: transparent;
     color: #64748b;
     font-size: 14px;
     font-weight: 800;
     border-radius: 12px;
     padding: 11px 24px;
     transition: .35s;
     min-width: 95px;
 }

 .media-tabs .nav-link:hover {
     background: rgba(37, 99, 235, .06);
     color: #2563eb;
 }

 .media-tabs .nav-link.active {
     background:
         linear-gradient(135deg, #2563eb, #38bdf8);
     color: #fff;
     box-shadow: 0 10px 25px rgba(37, 99, 235, .2);
 }

 /* =========================================
   ARCHIVE BUTTON
========================================= */

 .archive-btn {
     display: inline-flex;
     align-items: center;
     gap: 10px;
     padding: 13px 22px;
     border-radius: 16px;
     text-decoration: none;
     background: #fff;
     color: #0f172a;
     font-weight: 800;
     transition: .35s;
     box-shadow: 0 10px 30px rgba(0, 0, 0, .06);
     border: 1px solid rgba(37, 99, 235, .08);
 }

 .archive-btn i {
     transition: .35s;
 }

 .archive-btn:hover {
     background:
         linear-gradient(135deg, #2563eb, #38bdf8);
     color: #fff;
     transform: translateY(-3px);
     box-shadow: 0 18px 35px rgba(37, 99, 235, .18);
 }

 .archive-btn:hover i {
     transform: translateX(-5px);
 }

 /* =========================================
   NAVIGATION (Arrows)
========================================= */
 .media-navigation {
     display: flex;
     gap: 12px;
 }

 .media-nav-btn {
     width: 48px;
     height: 48px;
     border: 1px solid rgba(15, 23, 42, 0.05);
     border-radius: 14px;
     background: #fff;
     color: #0f172a;
     font-size: 20px;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: all 0.3s ease;
     box-shadow: 0 8px 20px rgba(0, 0, 0, 0.04);
     cursor: pointer;
 }

 .media-nav-btn:hover {
     background: linear-gradient(135deg, #2563eb, #38bdf8);
     color: #fff;
     transform: translateY(-2px);
     box-shadow: 0 10px 25px rgba(37, 99, 235, 0.2);
     border-color: transparent;
 }

 /* =========================================
   OWL CAROUSEL FIX (هم‌ارتفاع شدن کارت‌ها)
========================================= */
 .news-carousel .owl-stage {
     display: flex;
 }

 .news-carousel .item {
     display: flex;
     flex: 1 0 auto;
     height: 100%;
 }




 /* =========================================
   IMAGE (ارتفاع متناسب و پوشش کامل)
========================================= */
 .news-image {
     height: 190px;
     width: 100%;
     flex-shrink: 0;
     overflow: hidden;
 }

 .news-image img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     transition: transform 0.4s ease;
 }

 .news-card:hover .news-image img {
     transform: scale(1.03);
 }

 .news-overlay {
     display: none;
     /* حذف لایه تیره روی عکس */
 }

 /* =========================================
   CONTENT BODY (تنظیم فاصله‌های داخلی)
========================================= */
 .news-content {
     padding: 16px 20px;
     display: flex;
     flex-direction: column;
     flex-grow: 1;
 }

 /* =========================================
   META / DATE (انتقال تاریخ به سمت چپ)
========================================= */
 .news-meta {
     display: flex;
     justify-content: flex-end;
     /* در حالت RTL این دستور تاریخ را به سمت چپ می‌برد */
     color: #94a3b8;
     font-size: 12px;
     margin-bottom: 12px;
 }

 .news-meta i {
     display: none;
     /* حذف آیکون ساعت مطابق تصویر دوم */
 }

 /* =========================================
   TITLE (عنوان خبر)
========================================= */
 .news-title {
     font-size: 15px;
     font-weight: 800;
     color: #1e293b;
     line-height: 1.7;
     margin: 0 0 20px 0;
     text-align: right;
 }

 /* =========================================
   DESCRIPTION (مخفی کردن برای رسیدن به استایل مینیمال)
========================================= */
 .news-desc {
     display: none !important;
 }


 /* =========================================
   OWL CAROUSEL EQUAL HEIGHT FIX
   (برای یکسان‌سازی ارتفاع کارت‌ها در اسلایدر)
========================================= */
 .media-slider .owl-stage {
     display: flex;
 }

 .media-slider .owl-item {
     display: flex;
     flex: 1 0 auto;
 }

 /* =========================================
   CARD ( .media-card )
========================================= */
 .media-card {
     background: rgba(255, 255, 255, 0.95);
     backdrop-filter: blur(10px);
     -webkit-backdrop-filter: blur(10px);
     border-radius: 20px;
     overflow: hidden;
     position: relative;
     transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
     box-shadow: 0 8px 30px rgba(15, 23, 42, 0.05);
     border: 1px solid rgba(226, 232, 240, 0.8);
     width: 100%;

     /* تنظیمات Flex برای یکسان‌سازی ارتفاع */
     display: flex;
     flex-direction: column;
     height: 100%;
 }

 .media-card:hover {
     transform: translateY(-6px);
     box-shadow: 0 15px 40px rgba(37, 99, 235, 0.12);
 }

 /* حذف خط زیر تمام لینک‌ها */
 .media-card a,
 .media-card a:hover {
     text-decoration: none !important;
 }

 /* =========================================
   IMAGE & OVERLAY ( .media-image )
========================================= */
 .media-image {
     position: relative;
     height: 220px;
     overflow: hidden;
     flex-shrink: 0;
 }

 .media-image a {
     display: block;
     height: 100%;
 }

 .media-image img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     /* جلوگیری از کشیدگی و دفرمه شدن عکس */
     transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
 }

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

 .media-overlay {
     position: absolute;
     inset: 0;
     background: linear-gradient(to top, rgba(15, 23, 42, 0.5), transparent 60%);
     pointer-events: none;
     z-index: 1;
 }

 /* =========================================
   BADGES & BUTTONS ON IMAGE
========================================= */
 .media-category {
     position: absolute;
     top: 15px;
     right: 15px;
     z-index: 3;
     background: linear-gradient(135deg, #3b82f6, #0ea5e9);
     color: #fff;
     padding: 6px 14px;
     border-radius: 30px;
     font-size: 13px;
     font-weight: 700;
     box-shadow: 0 4px 10px rgba(59, 130, 246, 0.3);
     display: flex;
     align-items: center;
     gap: 6px;
 }

 .play-btn {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     z-index: 3;
     background: rgba(255, 255, 255, 0.25);
     backdrop-filter: blur(4px);
     color: #fff;
     width: 54px;
     height: 54px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 22px;
     transition: all 0.3s ease;
 }

 .play-btn:hover {
     background: #3b82f6;
     transform: translate(-50%, -50%) scale(1.1);
 }

 /* =========================================
   CONTENT BODY ( .media-content )
========================================= */
 .media-content {
     padding: 20px;
     background-color: #fff;

     /* پر کردن فضای باقی‌مانده کارت */
     display: flex;
     flex-direction: column;
     flex-grow: 1;
 }

 /* =========================================
   META ( .media-meta )
========================================= */
 .media-meta {
     display: flex;
     align-items: center;
     color: #94a3b8;
     font-size: 13px;
     margin-bottom: 12px;
 }

 .media-meta i {
     margin-left: 6px;
 }

 /* =========================================
   TITLE ( .news-title )
========================================= */
 .news-title {
     font-size: 16px;
     font-weight: 800;
     line-height: 1.7;
     margin: 0 0 20px 0;

     /* محدودسازی به ۲ خط (جلوگیری از به‌هم‌ریختگی ارتفاع) */
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
     text-overflow: ellipsis;
 }

 .news-title a {
     color: #1e293b;
     transition: color 0.3s ease;
 }

 .news-title a:hover {
     color: #2563eb;
 }


 /* =========================================
   OWL CAROUSEL FIX (هم‌ارتفاع شدن کارت‌ها)
========================================= */
 .news-carousel .owl-stage {
     display: flex;
 }

 .news-carousel .item {
     display: flex;
     flex: 1 0 auto;
     height: 100%;
 }

 /* =========================================
   MAIN CARD (کارت سفید و یکپارچه)
========================================= */
 .news-card {
     padding: 0;
     background: #ffffff;
     border-radius: 16px;
     overflow: hidden;
     box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04);
     /* سایه بسیار ملایم */
     border: 1px solid #f8fafc;
     width: 100%;
     height: 100%;
     display: flex;
     flex-direction: column;
     direction: rtl;
     transition: transform 0.3s ease, box-shadow 0.3s ease;
 }

 .news-card:hover {
     transform: translateY(-4px);
     box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
 }

 .news-card a {
     text-decoration: none !important;
 }

 /* =========================================
   IMAGE (ارتفاع متناسب و پوشش کامل)
========================================= */
 .news-image {
     height: 190px;
     width: 100%;
     flex-shrink: 0;
     overflow: hidden;
 }

 .news-image img {
     width: 100%;
     height: 100%;
     object-fit: none;
     transition: transform 0.4s ease;
 }

 .news-card:hover .news-image img {
     transform: scale(1.03);
 }

 .news-overlay {
     display: none;
     /* حذف لایه تیره روی عکس */
 }

 /* =========================================
   CONTENT BODY (تنظیم فاصله‌های داخلی)
========================================= */
 .news-content {
     padding: 16px 20px;
     display: flex;
     flex-direction: column;
     flex-grow: 1;
 }

 /* =========================================
   META / DATE (انتقال تاریخ به سمت چپ)
========================================= */
 .news-meta {
     display: flex;
     justify-content: flex-end;
     /* در حالت RTL این دستور تاریخ را به سمت چپ می‌برد */
     color: #94a3b8;
     font-size: 12px;
     margin-bottom: 12px;
 }

 .news-meta i {
     display: none;
     /* حذف آیکون ساعت مطابق تصویر دوم */
 }

 /* =========================================
   TITLE (عنوان خبر)
========================================= */
 .news-title {
     font-size: 15px;
     font-weight: 800;
     color: #1e293b;
     line-height: 1.7;
     margin: 0 0 20px 0;
     text-align: right;
 }

 /* =========================================
   DESCRIPTION (مخفی کردن برای رسیدن به استایل مینیمال)
========================================= */
 .news-desc {
     display: none !important;
 }

 /* =========================================
   ACTION BUTTON (دکمه آبی روشن در سمت راست پایین)
========================================= */

 .news-box {
     margin-top: auto;
     display: flex;
     align-items: center;

 }

 .news-btn {
     margin-top: auto;
     align-self: flex-start;
     background: #e0f2fe;
     color: #2563eb !important;
     /* رنگ متن آبی */
     padding: 8px 16px;
     border-radius: 10px;
     font-size: 13px;
     font-weight: 700;
     display: inline-flex;
     align-items: center;
     border: none;
     transition: background 0.2s ease;
 }

 .news-btn i {
     margin-right: 8px;
     transition: transform 0.2s ease;
 }

 .news-btn:hover {
     background: #bae6fd;
 }

 .news-btn:hover i {
     transform: translateX(-4px);
 }

 /* =========================================
   TITLE
========================================= */

 .news-title {
     font-size: 18px;
     line-height: 1.9;
     font-weight: 900;
     color: #0f172a;
     margin-bottom: 14px;

     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
 }

 /* =========================================
   DESC
========================================= */

 .news-desc {
     color: #64748b;
     line-height: 2;
     font-size: 14px;
     margin-bottom: 22px;

     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
 }



 /* =========================================
   VIDEO PLAY BUTTON
========================================= */

 .play-btn {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     z-index: 3;

     width: 72px;
     height: 72px;
     border-radius: 50%;
     background: #fff;

     display: flex;
     align-items: center;
     justify-content: center;

     color: #2563eb;
     font-size: 24px;

     box-shadow: 0 10px 30px rgba(0, 0, 0, .12);
 }

 /* =========================================
   AUDIO CARD
========================================= */

 .audio-card {
     padding: 30px;
 }

 .audio-icon {
     width: 82px;
     height: 82px;
     border-radius: 24px;

     background:
         linear-gradient(135deg, #2563eb, #38bdf8);

     display: flex;
     align-items: center;
     justify-content: center;

     color: #fff;
     font-size: 30px;

     margin-bottom: 22px;

     box-shadow: 0 15px 35px rgba(37, 99, 235, .2);
 }

 /* =========================================
   RESPONSIVE
========================================= */

 @media(max-width:992px) {

     .media-topbar {
         gap: 20px;
     }

     .section-title {
         font-size: 26px;
     }

     .media-tabs {
         width: 100%;
         overflow: auto;
         flex-wrap: nowrap;
     }

     .media-tabs .nav-link {
         white-space: nowrap;
         min-width: auto;
     }

     .media-navigation {
         width: 100%;
         justify-content: center;
     }

     .archive-btn {
         flex: 1;
         justify-content: center;
     }

     .media-image {
         height: 220px;
     }

     .news-title {
         font-size: 18px;
     }

 }

 /* events */
 .events-panel {
     background: #ffffff;
     border-radius: 12px;
     padding: 20px;
     box-shadow: 0 6px 15px rgba(0, 0, 0, 0.06);
     border-top: 3px solid var(--accent-color);
     transition: all 0.3s ease;
 }


 .events-header {
     border-bottom: 2px solid var(--bg-body);
     padding-bottom: 15px;
     margin-bottom: 10px;
     display: flex;
     justify-content: space-between;
     align-items: center;
     color: var(--primary-color);
 }

 .events-header span {
     color: var(--primary-color);
     letter-spacing: -0.2px;
 }


 .events-list {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .events-list li {
     padding: 15px 0;
     border-bottom: 1px dashed #e2e8f0;
 }

 .events-list li:last-child {
     border-bottom: none;
 }


 .event-link {
     display: block;
     color: var(--secondary-color);
     font-size: 14px;
     line-height: 1.6;
     text-decoration: none;
     transition: 0.3s ease;
     margin-bottom: 8px;
 }

 .event-link:hover {
     color: var(--accent-color);
     transform: translateX(-5px);

 }


 .event-date {
     display: flex;
     align-items: center;
     font-size: 12px;
     color: #94a3b8;
 }

 .event-date i {
     margin-left: 6px;
     color: var(--warm-highlight);

     font-size: 13px;
 }

 /* =========================================
   VIRTUAL TOUR
========================================= */

 .virtual-tour-section {
     position: relative;
     overflow: hidden;
 }

 /* =========================================
   TITLE
========================================= */

 .tour-title-wrap {
     display: flex;
     align-items: center;
 }

 .tour-title-icon {
     width: 58px;
     height: 58px;
     border-radius: 18px;
     background:
         linear-gradient(135deg, #0f4c81, #1da1f2);

     display: flex;
     align-items: center;
     justify-content: center;

     color: #fff;
     font-size: 22px;

     margin-left: 14px;

     box-shadow: 0 12px 30px rgba(37, 99, 235, .15);
 }

 .tour-subtitle {
     display: block;
     font-size: 12px;
     color: #3b82f6;
     font-weight: 700;
     margin-bottom: 3px;
 }

 .tour-title {
     font-size: 24px;
     font-weight: 900;
     color: #0f172a;
 }

 /* =========================================
   CARD
========================================= */

 .tour-card {
     position: relative;

     height: 82px;

     background:
         rgba(255, 255, 255, .72);

     backdrop-filter: blur(10px);

     border: 1px solid rgba(37, 99, 235, .12);

     border-radius: 22px;

     padding: 0 24px;

     display: flex;
     align-items: center;
     justify-content: space-between;

     text-decoration: none;

     transition: .35s;

     overflow: hidden;

     box-shadow: 0 8px 25px rgba(15, 23, 42, .04);
 }

 .tour-card::before {
     content: "";
     position: absolute;
     inset: 0;
     background:
         linear-gradient(135deg,
             rgba(37, 99, 235, .05),
             transparent);

     opacity: 0;
     transition: .35s;
 }

 .tour-card:hover {
     transform: translateY(-4px);
     border-color: rgba(37, 99, 235, .2);
     box-shadow: 0 18px 35px rgba(37, 99, 235, .10);
 }

 .tour-card:hover::before {
     opacity: 1;
 }

 /* =========================================
   RIGHT SIDE
========================================= */

 .tour-card-right {
     display: flex;
     align-items: center;
     gap: 16px;

     position: relative;
     z-index: 2;
 }

 .tour-card-right span {
     font-size: 17px;
     font-weight: 700;
     color: #0f172a;
 }

 /* =========================================
   ICON
========================================= */

 .tour-card-icon {
     width: 44px;
     height: 44px;

     border-radius: 14px;

     background:
         linear-gradient(135deg, #eff6ff, #dbeafe);

     display: flex;
     align-items: center;
     justify-content: center;

     color: #2563eb;
     font-size: 18px;

     transition: .35s;
 }

 .tour-card:hover .tour-card-icon {
     background:
         linear-gradient(135deg, #2563eb, #38bdf8);

     color: #fff;

     transform: rotate(-6deg);
 }

 /* =========================================
   ARROW
========================================= */

 .tour-arrow {
     width: 38px;
     height: 38px;

     border-radius: 12px;

     background: #f8fbff;

     display: flex;
     align-items: center;
     justify-content: center;

     color: #2563eb;

     font-size: 18px;

     transition: .35s;

     position: relative;
     z-index: 2;
 }

 .tour-card:hover .tour-arrow {
     background: #2563eb;
     color: #fff;
     transform: translateX(-4px);
 }

 /* =========================================
   RESPONSIVE
========================================= */

 @media(max-width:992px) {

     .tour-title {
         font-size: 24px;
     }

     .tour-card {
         height: auto;
         min-height: 76px;
         padding: 18px;
     }

     .tour-card-right span {
         font-size: 15px;
         line-height: 1.8;
     }

 }

 /*=========================================
PROFILE SYSTEM SECTION
=========================================*/

 .profile-system-section {
     background:
         linear-gradient(to bottom, #f8fbff, #eef5ff);
     position: relative;

 }

 /* title */


 .title-icon {
     width: 62px;
     height: 62px;
     border-radius: 18px;
     background: linear-gradient(135deg, #0f4c81, #1da1f2);
     display: flex;
     align-items: center;
     justify-content: center;
     color: #fff;
     font-size: 23px;
     box-shadow: 0 12px 28px rgba(37, 99, 235, .18);
 }

 .section-subtitle {
     font-size: 13px;
     color: #3b82f6;
     font-weight: 700;
     display: block;
     margin-bottom: 6px;
 }

 .section-title {
     font-size: 24px;
     font-weight: 900;
     color: #0f172a;
 }

 /* cards */

 .profile-link-card {
     height: 74px;
     background: rgba(255, 255, 255, .72);
     backdrop-filter: blur(12px);
     border-radius: 22px;
     border: 1px solid rgba(59, 130, 246, .14);

     display: flex;
     align-items: center;
     justify-content: space-between;

     padding: 0 24px;
     text-decoration: none;

     transition: all .35s ease;

     color: #0f172a;

     box-shadow:
         0 10px 30px rgba(15, 23, 42, .04);
 }

 .profile-link-card span {
     font-size: 19px;
     font-weight: 700;
     line-height: 1.8;
 }

 .profile-link-card i {
     width: 34px;
     height: 34px;
     border-radius: 10px;

     display: flex;
     align-items: center;
     justify-content: center;

     background: #eff6ff;
     color: #2563eb;

     font-size: 17px;

     transition: all .35s ease;
 }

 /* hover */

 .profile-link-card:hover {
     transform: translateY(-4px);
     border-color: rgba(37, 99, 235, .25);

     box-shadow:
         0 18px 40px rgba(37, 99, 235, .10);
 }

 .profile-link-card:hover i {
     background: linear-gradient(135deg, #2563eb, #38bdf8);
     color: #fff;

     transform: translateX(-3px);
 }

 /* responsive */

 @media(max-width:992px) {

     .section-title {
         font-size: 26px;
     }

     .profile-link-card {
         height: 68px;
         padding: 0 18px;
     }

     .profile-link-card span {
         font-size: 16px;
     }

 }

 @media(max-width:768px) {

     .profile-system-header {
         margin-bottom: 25px !important;
     }

     .title-icon {
         width: 54px;
         height: 54px;
         font-size: 20px;
     }

     .section-title {
         font-size: 24px;
     }

     .profile-link-card {
         border-radius: 18px;
     }

 }

 .footer-modern {
     padding: 70px 0 0;
     background:
         linear-gradient(135deg, #021b33, #03294d 60%, #063763);
     position: relative;
     overflow: hidden;
 }

 /* bg */

 .footer-modern::before {
     content: "";
     position: absolute;
     width: 550px;
     height: 550px;
     border-radius: 50%;
     background:
         radial-gradient(circle,
             rgba(33, 150, 243, .10),
             transparent 70%);
     top: -250px;
     left: -180px;
 }

 .footer-box {
     position: relative;
     z-index: 2;
 }

 /* brand */

 .footer-brand {
     display: flex;
     align-items: center;
     gap: 16px;
     margin-bottom: 22px;
 }

 .footer-logo {
     width: 100%;
     height: 100%;
     border-radius: 24px;
     display: flex;
     align-items: center;
     color: #fff;
     font-size: 28px;
 }

 .footer-logo img {
     width: 179px;
 }

 .footer-mini {
     color: #6bbcff;
     font-size: 13px;
     display: block;
     margin-bottom: 5px;
 }

 .footer-brand h3 {
     color: #fff;
     font-size: 34px;
     font-weight: 800;
     margin: 0;
 }

 .footer-desc {
     color: rgba(255, 255, 255, .70);
     line-height: 2.2;
     font-size: 14px;
     margin-bottom: 28px;
     max-width: 360px;
 }

 /* titles */

 .footer-title {
     color: #fff;
     font-size: 18px;
     font-weight: 700;
     margin-bottom: 28px;
     position: relative;
     padding-bottom: 14px;
 }

 .footer-title::after {
     content: "";
     position: absolute;
     right: 0;
     bottom: 0;
     width: 50px;
     height: 3px;
     border-radius: 10px;
     background:
         linear-gradient(to left, #1da1f2, #60a5fa);
 }

 /* links */

 .footer-links {
     list-style: none;
     margin: 0;
     padding: 0;
 }

 .footer-links li {
     margin-bottom: 16px;
 }

 .footer-links a {
     color: rgba(255, 255, 255, .74);
     text-decoration: none;
     transition: .25s;
     display: flex;
     align-items: center;
     gap: 10px;
     font-size: 14px;
 }

 .footer-links a i {
     color: #60a5fa;
     font-size: 12px;
 }

 .footer-links a:hover {
     color: #fff;
     transform: translateX(-4px);
 }

 /* contact */

 .contact-list {
     display: flex;
     flex-direction: column;
     gap: 16px;
 }

 .contact-item {
     display: flex;
     align-items: center;
     gap: 14px;
     color: rgba(255, 255, 255, .78);
     font-size: 14px;
 }

 .contact-icon {
     width: 46px;
     height: 46px;
     border-radius: 16px;
     background: rgba(255, 255, 255, .06);
     border: 1px solid rgba(255, 255, 255, .05);
     display: flex;
     align-items: center;
     justify-content: center;
     color: #2bb0ff;
     flex-shrink: 0;
 }

 /* social */

 .footer-social {
     display: flex;
     gap: 12px;
 }

 .footer-social a {
     width: 46px;
     height: 46px;
     border-radius: 16px;
     display: flex;
     align-items: center;
     justify-content: center;
     text-decoration: none;
     background: rgba(255, 255, 255, .06);
     border: 1px solid rgba(255, 255, 255, .05);
     color: #fff;
     transition: .25s;
 }

 .footer-social a:hover {
     background: #1da1f2;
     transform: translateY(-5px);
 }

 /* stats */

 /* =========================
   Footer Stats (v2) - Final
   ========================= */

 .footer-stats--v2 {
     margin-top: 14px;
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 14px;
     direction: rtl;
 }

 /* Title */
 .footer-stats__title {
     margin: 0;
     color: rgba(255, 255, 255, .92);
     font-size: .98rem;
     font-weight: 900;
     padding-bottom: 10px;
     position: relative;
     text-align: center;
     width: 100%;
     letter-spacing: -.2px;
 }

 .footer-stats__title::after {
     content: "";
     position: absolute;
     left: 50%;
     bottom: 0;
     transform: translateX(-50%);
     width: 46px;
     height: 3px;
     border-radius: 999px;
     background: linear-gradient(90deg, rgba(0, 180, 255, .0), rgba(0, 180, 255, .95), rgba(0, 180, 255, .0));
 }

 /* Base Card */
 .footer-stats--v2 .stat-box {
     position: relative;
     width: 240px;
     max-width: 100%;
     border-radius: 18px;
     padding: 16px 18px;
     text-align: center;

     border: 1px solid rgba(255, 255, 255, .10);
     box-shadow: 0 18px 40px rgba(0, 0, 0, .22);
     overflow: hidden;
     isolation: isolate;
     /* برای کنترل لایه‌ها */
 }

 /* subtle top shine */
 .footer-stats--v2 .stat-box::before {
     content: "";
     position: absolute;
     inset: -2px;
     border-radius: inherit;
     background: linear-gradient(135deg, rgba(255, 255, 255, .18), transparent 55%);
     opacity: .22;
     pointer-events: none;
     z-index: 0;
 }

 /* Card label */
 .footer-stats--v2 .stat-box__label {
     display: block;
     position: relative;
     z-index: 1;

     color: rgba(255, 255, 255, .88);
     font-size: .92rem;
     font-weight: 800;

     padding-bottom: 12px;
     margin-bottom: 12px;
     border-bottom: 1px solid rgba(255, 255, 255, .16);
 }

 /* ================
   Dark card (Today)
   ================ */
 .footer-stats--v2 .stat-box--dark {
     background: rgba(255, 255, 255, .04);
     backdrop-filter: blur(10px);
     -webkit-backdrop-filter: blur(10px);
     box-shadow: 0 14px 30px rgba(0, 0, 0, .18);
 }

 /* today value (single number) */
 .footer-stats--v2 .stat-box--dark .stat-box__value {
     display: block;
     position: relative;
     z-index: 1;

     color: #fff;
     font-size: 2.1rem;
     font-weight: 950;
     line-height: 1.05;

     font-variant-numeric: tabular-nums;
     letter-spacing: .2px;
 }

 /* ======================
   Primary card (All visits)
   ====================== */
 .footer-stats--v2 .stat-box--primary {
     background:
         radial-gradient(140px 90px at 20% 20%, rgba(255, 255, 255, .18), transparent 60%),
         linear-gradient(145deg, #1f93ff 0%, #2b6fff 55%, #2a63ff 100%);
     border: 1px solid rgba(255, 255, 255, .14);
     box-shadow: 0 22px 55px rgba(23, 132, 255, .18);
 }

 /* primary value (multi-line raw text from visit-status) */
 .footer-stats--v2 .stat-box--primary .stat-box__value {
     display: block;
     position: relative;
     z-index: 1;

     color: rgba(255, 255, 255, .94);
     font-size: .93rem;
     /* برای چند خط خواناتر */
     font-weight: 700;
     line-height: 2.05;
     text-align: center;

     font-variant-numeric: tabular-nums;
     text-rendering: geometricPrecision;
 }

 /* Normalize visit-status output (DO NOT flex it) */
 .footer-stats--v2 .stat-box__value visit-status,
 .footer-stats--v2 .stat-box__value visit-status * {
     color: inherit !important;
     font: inherit !important;
     font-size: inherit !important;
     font-weight: inherit !important;
     line-height: inherit !important;
     text-align: inherit !important;

     background: transparent !important;
     border: 0 !important;
     margin: 0 !important;
     padding: 0 !important;

     display: inline !important;
     /* مهم: نذار داخلی‌ها block/flex بشن و چینش خراب شه */
 }

 /* Improve <br> spacing if exists */
 .footer-stats--v2 .stat-box__value br {
     display: block;
     content: "";
     margin: 2px 0;
 }

 /* Hover (desktop only) */
 @media (hover: hover) {
     .footer-stats--v2 .stat-box {
         transition: transform .22s ease, box-shadow .22s ease, filter .22s ease;
     }

     .footer-stats--v2 .stat-box:hover {
         transform: translateY(-2px);
         box-shadow: 0 22px 60px rgba(0, 0, 0, .28);
         filter: saturate(1.05);
     }
 }

 /* Small screens */
 @media (max-width: 360px) {
     .footer-stats--v2 .stat-box {
         width: 220px;
     }
 }

 /* bottom */

 .footer-bottom {
     margin-top: 60px;
     padding: 26px 0;
     border-top: 1px solid rgba(255, 255, 255, .08);
     display: flex;
     align-items: center;
     justify-content: space-between;
     flex-wrap: wrap;
     gap: 15px;
     color: rgba(255, 255, 255, .65);
     font-size: 14px;
 }

 .footer-copy span {
     color: #29a9ff;
     font-weight: 700;
 }

 /* mobile */

 @media(max-width:992px) {

     .footer-modern {
         padding-top: 50px;
     }

     .footer-brand h3 {
         font-size: 28px;
     }

     .footer-bottom {
         text-align: center;
         justify-content: center;
     }

 }


 /* category  */
 /* Container Wrapper */
 .widget-newsstyle {
     margin-bottom: 30px;
     padding: 10px 0;
     position: relative;
 }

 /* Title Styling */
 .widget-titleNews {
     font-size: 1.5rem;
     font-weight: 800;
     color: var(--primary-color);
     position: relative;
     padding-right: 20px;
     /* فضای خالی برای خط کنار عنوان */
     margin: 0;
     display: inline-block;
 }

 /* افزودن یک خط رنگی ضخیم در کنار عنوان (نشانگر برند) */
 .widget-titleNews::before {
     content: '';
     position: absolute;
     right: 0;
     top: 5px;
     bottom: 5px;
     width: 6px;
     background: var(--accent-color);
     /* آبی نئونی */
     border-radius: 4px;
 }



 /* افکت هاور برای تعاملی تر شدن */
 .widget-newsstyle:hover .widget-titleNews::after {
     width: 100px;
     /* افزایش طول خط زیرین هنگام هاور */
 }

 /* کارت اصلی */
 .article-card {
     background: #ffffff;
     border-radius: 16px;
     overflow: hidden;
     box-shadow: 0 10px 25px rgba(11, 46, 89, 0.04);
     /* سایه هماهنگ با رنگ سرمه ای */
     transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
     height: 100%;
     display: flex;
     flex-direction: column;
     border: 1px solid rgba(11, 46, 89, 0.06);
     position: relative;
 }

 .article-card:hover {
     transform: translateY(-6px);
     border-color: rgba(0, 168, 255, 0.4);
     /* هایلایت حاشیه با آبی نئونی */
     box-shadow: 0 15px 35px rgba(11, 46, 89, 0.08);
 }

 /* بخش تصویر */
 .card-img-wrapper {
     position: relative;
     height: 220px;
     overflow: hidden;
 }

 .card-img-wrapper img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     transition: transform 0.5s ease;
 }

 .article-card:hover .card-img-wrapper img {
     transform: scale(1.06);
 }

 /* بج دسته‌بندی با رنگ گرم برای جلب توجه */
 .category-badge {
     position: absolute;
     top: 15px;
     right: 15px;
     background: var(--warm-highlight);
     color: #ffffff;
     padding: 6px 14px;
     border-radius: 30px;
     font-size: 0.75rem;
     font-weight: bold;
     z-index: 2;
     box-shadow: 0 4px 10px rgba(243, 156, 18, 0.3);
 }

 /* بدنه کارت */
 .card-body {
     padding: 24px;
     display: flex;
     flex-direction: column;
     flex-grow: 1;
 }

 /* اطلاعات متادیتا */
 .meta-info {
     display: flex;
     gap: 15px;
     margin-bottom: 12px;
     font-size: 0.8rem;
     color: var(--text-muted);
 }

 .meta-info span {
     display: flex;
     align-items: center;
     gap: 6px;
 }

 .meta-info i {
     color: var(--secondary-color);
     /* استفاده از آبی متوسط برای آیکون‌ها */
 }

 /* عنوان خبر */
 .card-title {
     font-size: 1.15rem;
     font-weight: 800;
     line-height: 1.5;
     margin-bottom: 12px;
 }

 .card-title a {
     color: var(--primary-color);
     /* سرمه‌ای عمیق برای عنوان */
     text-decoration: none;
     transition: color 0.2s ease-in-out;
 }

 .card-title a:hover {
     color: var(--accent-color);
     /* تغییر رنگ به آبی روشن در حالت هاور */
 }

 /* خلاصه متن */
 .card-text {
     font-size: 0.9rem;
     color: var(--text-muted);
     line-height: 1.8;
     margin-bottom: 20px;
     display: -webkit-box;
     -webkit-line-clamp: 3;
     -webkit-box-orient: vertical;
     overflow: hidden;
     text-align: justify;
 }

 /* دکمه ادامه مطلب با رفتار پویا */
 .read-more-btn {
     margin-top: auto;
     align-self: flex-start;
     color: var(--secondary-color);
     font-weight: 700;
     font-size: 0.85rem;
     text-decoration: none;
     display: inline-flex;
     align-items: center;
     gap: 8px;
     transition: all 0.3s ease;
 }

 .read-more-btn i {
     font-size: 0.8rem;
     background: rgba(30, 96, 163, 0.08);
     /* پس‌زمینه محو از آبی متوسط */
     color: var(--secondary-color);
     padding: 6px;
     border-radius: 50%;
     transition: all 0.3s ease;
 }

 .read-more-btn:hover {
     color: var(--accent-color);
     /* تبدیل به آبی روشن */
 }

 .read-more-btn:hover i {
     transform: translateX(-4px);
     background: var(--accent-color);
     color: #ffffff;
     box-shadow: 0 0 8px rgba(0, 168, 255, 0.4);
 }


 /* ===== Search Box Modern Style ===== */

 .search-box {
     position: relative;
     max-width: 500px;
     margin: 0 auto;
 }

 .search-box input[type="text"] {
     width: 100%;
     height: 54px;
     border-radius: 50px;
     border: 1px solid rgba(11, 46, 89, 0.1);
     padding: 0 60px 0 20px;
     font-size: 0.95rem;
     background: #ffffff;
     color: var(--primary-color);
     transition: all 0.3s ease;
     box-shadow: 0 5px 15px rgba(11, 46, 89, 0.04);
 }

 .search-box input[type="text"]::placeholder {
     color: #94a3b8;
     font-weight: 400;
 }

 .search-box input[type="text"]:focus {
     outline: none;
     border-color: var(--accent-color);
     box-shadow: 0 0 0 4px rgba(0, 168, 255, 0.12);
 }

 /* Search Button */
 .btn-search-style {
     position: absolute;
     top: 50%;
     left: 6px;
     transform: translateY(-50%);
     width: 42px;
     height: 42px;
     border-radius: 50%;
     border: none;
     background: linear-gradient(135deg,
             var(--secondary-color),
             var(--accent-color));
     color: #fff;
     display: flex;
     align-items: center;
     justify-content: center;
     cursor: pointer;
     transition: all 0.3s ease;
     box-shadow: 0 4px 10px rgba(0, 168, 255, 0.25);
 }

 .btn-search-style i {
     font-size: 0.9rem;
 }

 /* Hover Effect */
 .btn-search-style:hover {
     transform: translateY(-50%) scale(1.05);
     box-shadow: 0 6px 18px rgba(0, 168, 255, 0.35);
 }

 /* Active Click */
 .btn-search-style:active {
     transform: translateY(-50%) scale(0.95);
 }

 /* Responsive */
 @media (max-width: 576px) {
     .search-box input[type="text"] {
         height: 48px;
         font-size: 0.9rem;
     }

     .btn-search-style {
         width: 38px;
         height: 38px;
     }
 }

 /* -------------- modern-paging ---------------- */

 .pagination {
     background: #fff;
     padding: 10px 16px;
     border-radius: 50px;
     border: 1px solid #e3ecf4;
     display: flex;
     gap: 6px;
     align-items: center;
     box-shadow: 0 6px 18px rgba(11, 46, 89, 0.06);
     width: fit-content;
     margin: 32px auto;
 }

 .pagination .page-item {
     margin: 0;
     list-style: none;
 }

 .pagination .page-item .page-link {
     border: none;
     background: #f1f5f9;
     color: #0b2e59;
     width: 38px;
     height: 38px;
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: 50% !important;
     font-size: 14px;
     font-weight: 600;
     transition: all 0.25s ease;
     box-shadow: inset 0 0 0 1px transparent;
 }

 /* حالت فعال (صفحه جاری) */
 .pagination .page-item.active .page-link {
     background-color: #0b2e59;
     color: #fff !important;
     transform: scale(1.12);
     box-shadow: 0 6px 14px rgba(11, 46, 89, 0.35);
 }

 /* هاور */
 .pagination .page-item .page-link:hover:not(.disabled) {
     background-color: #1e60a3;
     color: #fff !important;
     transform: translateY(-2px);
     box-shadow: 0 5px 12px rgba(30, 96, 163, 0.3);
 }

 /* دکمه‌های قبلی / بعدی (اولین و آخرین آیتم) */
 .pagination .page-item:first-child .page-link,
 .pagination .page-item:last-child .page-link {
     width: auto;
     min-width: 72px;
     height: 38px;
     padding: 0 18px;
     border-radius: 20px !important;
     background: #e7f3fc;
     color: #1e60a3;
     font-weight: 600;
     letter-spacing: 0.3px;
 }

 .pagination .page-item:first-child .page-link:hover:not(.disabled),
 .pagination .page-item:last-child .page-link:hover:not(.disabled) {
     background: #00a8ff;
     color: #fff !important;
     transform: translateY(-2px);
     box-shadow: 0 5px 12px rgba(0, 168, 255, 0.35);
 }

 /* حالت غیرفعال (disabled) */
 .pagination .page-item.disabled .page-link,
 .pagination .page-item.disabled span.page-link {
     background: transparent;
     color: #a3b1c2;
     cursor: not-allowed;
     box-shadow: none;
     transform: none;
     pointer-events: none;
 }

 /* نقاط (...) */
 .pagination .page-item.disabled .page-link {
     background: transparent !important;
 }

 /* ریسپانسیو */
 @media (max-width: 576px) {
     .pagination {
         padding: 8px 10px;
         gap: 3px;
     }

     .pagination .page-item .page-link {
         width: 34px;
         height: 34px;
         font-size: 13px;
     }

     .pagination .page-item:first-child .page-link,
     .pagination .page-item:last-child .page-link {
         min-width: 56px;
         padding: 0 12px;
         font-size: 13px;
     }
 }

 /* -------------- modern-paging ---------------- */

 .pagination {
     background: #fff;
     padding: 10px 16px;
     border-radius: 50px;
     border: 1px solid #e3ecf4;
     display: flex;
     gap: 6px;
     align-items: center;
     box-shadow: 0 6px 18px rgba(11, 46, 89, 0.06);
     width: fit-content;
     margin: 32px auto;
 }

 .pagination .page-item {
     margin: 0;
     list-style: none;
 }

 .pagination .page-item .page-link {
     border: none;
     background: #f1f5f9;
     color: #0b2e59;
     width: 38px;
     height: 38px;
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: 50% !important;
     font-size: 14px;
     font-weight: 600;
     transition: all 0.25s ease;
     box-shadow: inset 0 0 0 1px transparent;
 }

 /* حالت فعال (صفحه جاری) */
 .pagination .page-item.active .page-link {
     background-color: #0b2e59;
     color: #fff !important;
     transform: scale(1.12);
     box-shadow: 0 6px 14px rgba(11, 46, 89, 0.35);
 }

 /* هاور */
 .pagination .page-item .page-link:hover:not(.disabled) {
     background-color: #1e60a3;
     color: #fff !important;
     transform: translateY(-2px);
     box-shadow: 0 5px 12px rgba(30, 96, 163, 0.3);
 }

 /* دکمه‌های قبلی / بعدی (اولین و آخرین آیتم) */
 .pagination .page-item:first-child .page-link,
 .pagination .page-item:last-child .page-link {
     width: auto;
     min-width: 72px;
     height: 38px;
     padding: 0 18px;
     border-radius: 20px !important;
     background: #e7f3fc;
     color: #1e60a3;
     font-weight: 600;
     letter-spacing: 0.3px;
 }

 .pagination .page-item:first-child .page-link:hover:not(.disabled),
 .pagination .page-item:last-child .page-link:hover:not(.disabled) {
     background: #00a8ff;
     color: #fff !important;
     transform: translateY(-2px);
     box-shadow: 0 5px 12px rgba(0, 168, 255, 0.35);
 }

 /* حالت غیرفعال (disabled) */
 .pagination .page-item.disabled .page-link,
 .pagination .page-item.disabled span.page-link {
     background: transparent;
     color: #a3b1c2;
     cursor: not-allowed;
     box-shadow: none;
     transform: none;
     pointer-events: none;
 }

 /* نقاط (...) */
 .pagination .page-item.disabled .page-link {
     background: transparent !important;
 }

 /* ریسپانسیو */
 @media (max-width: 576px) {
     .pagination {
         padding: 8px 10px;
         gap: 3px;
     }

     .pagination .page-item .page-link {
         width: 34px;
         height: 34px;
         font-size: 13px;
     }

     .pagination .page-item:first-child .page-link,
     .pagination .page-item:last-child .page-link {
         min-width: 56px;
         padding: 0 12px;
         font-size: 13px;
     }
 }

 /* -------------- /modern-paging ---------------- */
 .archive.tab-archive {
     display: flex;
     justify-content: flex-end;
     margin-top: 20px;
 }

 .archive.tab-archive a {
     display: inline-flex;
     align-items: center;
     gap: 10px;

     padding: 10px 18px;
     border-radius: 14px;

     background: #ffffff;

     color: #2563eb;
     font-weight: 600;
     font-size: 14px;

     text-decoration: none;

     border: 1px solid rgba(37, 99, 235, 0.15);

     box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06);

     transition: all 0.25s ease;

     position: relative;
     overflow: hidden;
 }

 /* آیکن‌ها */
 .archive.tab-archive a i {
     font-size: 14px;
     transition: all 0.3s ease;
 }

 /* hover */
 .archive.tab-archive a:hover {
     background: linear-gradient(135deg, #2563eb, #1e40af);
     color: #fff;
     transform: translateY(-2px);
     box-shadow: 0 12px 28px rgba(37, 99, 235, 0.25);
 }

 /* حرکت آیکن چپ */
 .archive.tab-archive a:hover i.fa-angle-left {
     transform: translateX(-4px);
 }

 /* افکت شاین */
 .archive.tab-archive a::before {
     content: "";
     position: absolute;
     top: 0;
     left: -100%;
     width: 100%;
     height: 100%;
     background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.35), transparent);
     transition: all 0.5s ease;
 }

 .archive.tab-archive a:hover::before {
     left: 100%;
 }

 .page-breadcrumb-wrap {
     margin: 14px 0 18px;
     padding: 10px 18px;
     background: rgba(255, 255, 255, 0.72);
     border: 1px solid rgba(34, 190, 131, 0.10);
     border-radius: 14px;
     backdrop-filter: blur(6px);
     -webkit-backdrop-filter: blur(6px);
     box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
     overflow-x: auto;
 }

 .page-breadcrumb {
     display: flex;
     align-items: center;
     flex-wrap: nowrap;
     gap: 0;
     margin: 0;
     padding: 0;
     list-style: none;
     white-space: nowrap;
     direction: rtl;
 }

 .page-breadcrumb .breadcrumb-item {
     display: inline-flex;
     align-items: center;
     position: relative;
     font-size: 14px;
     font-weight: 500;
     line-height: 1.9;
     color: #6b7280;
 }

 .page-breadcrumb .breadcrumb-item+.breadcrumb-item {
     padding-right: 18px;
     margin-right: 12px;
 }

 .page-breadcrumb .breadcrumb-item+.breadcrumb-item::before {
     content: "/";
     position: absolute;
     right: 0;
     top: 50%;
     transform: translateY(-50%);
     color: #b8c2cc;
     font-size: 12px;
     font-weight: 400;
 }

 .page-breadcrumb .breadcrumb-item a {
     color: #1b53ad;
     text-decoration: none;
     transition: color .25s ease, opacity .25s ease;
 }

 .page-breadcrumb .breadcrumb-item a:hover {
     color: #0f9f6e;
     opacity: 1;
 }

 .page-breadcrumb .breadcrumb-item.home a {
     color: #1b53ad;
     font-weight: 700;
 }

 .page-breadcrumb .breadcrumb-item.active {
     color: #374151;
     font-weight: 700;
 }

 .page-breadcrumb .breadcrumb-item.active span {
     display: inline-block;
     max-width: 520px;
     overflow: hidden;
     text-overflow: ellipsis;
     vertical-align: middle;
 }

 @media (max-width: 768px) {
     .page-breadcrumb-wrap {
         margin: 10px 0 14px;
         padding: 8px 12px;
         border-radius: 12px;
     }

     .page-breadcrumb .breadcrumb-item {
         font-size: 13px;
     }

     .page-breadcrumb .breadcrumb-item+.breadcrumb-item {
         padding-right: 14px;
         margin-right: 8px;
     }

     .page-breadcrumb .breadcrumb-item.active span {
         max-width: 240px;
     }
 }


 /* EN-LAYOUT*/
 .en-layout .section-subtitle {
     margin-left: 23px;
 }

 .en-layout .news-nav-btn.next-btn {
     position: absolute;
     right: 14%;
 }

 .en-layout .news-box {
     margin-top: auto;
     display: flex;
     align-items: center;
     justify-content: end;

 }

 .en-layout .news-btn {
     display: flex;
     flex-direction: row-reverse;
     gap: 2px;
 }

 .en-layout .news-btn i {
     transform: rotate(180deg);
 }

 .en-layout .news-title {
     text-align: left;
 }

 .en-layout .media-ultra-section .archive-btn i {
     transform: rotate(180deg);
 }

 .en-layout .media-ultra-section .archive-btn i {
     transform: rotate(180deg);
 }

 .en-layout .media-ultra-section .archive-btn {
     margin-right: 84px;
 }

 .en-layout .media-navigation .media-nav-btn.next-btn {
     position: absolute;
        right: 6%;
 }
  .en-layout .footer-title::after{
    left: 0px !important;
  }
  .comment-form-card .col-md-6 {
  display: block !important;
}