   html,
   body {
       -webkit-font-smoothing: antialiased;
       -moz-osx-font-smoothing: grayscale;
   }
   
   * {
       margin: 0;
       padding: 0;
       box-sizing: border-box;
   }
   
   @font-face {
       font-family: 'Yekan';
       src: url('../fonts/Yekan.woff2');
       /* IE9 Compat Modes */
       font-weight: normal;
       font-style: normal;
       text-rendering: optimizeLegibility;
       font-display: auto;
   }
   
   body {
       font-family: 'Yekan';
       font-size: 18px;
       color: #1a2a3a;
       /* متن قابل خواندن باشه */
       line-height: 1.8;
       background-color: #f5f5f5;
       background-image: url(../image/photo-1482977036925-e8fcaa643657.png);
   }
   
   a {
       text-decoration: none;
       color: inherit;
   }
   
   li {
       list-style: none;
   }
   
   header {
       background-color: #1a2a3a;
       box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
       padding: 0;
       position: sticky;
       top: 0;
       z-index: 100;
       display: flex;
       justify-content: center;
   }
   
   h1 {
       text-align: center;
   }
   
   h2 {
       color: #1a2a3a;
       margin: 2rem 0;
       font-size: 35px;
       text-align: center;
       border-bottom: 3px solid #1a2a3a;
       display: inline-block;
   }
   
   .member h2 {
       font-size: 22px;
   }
   
   .image {
       text-align: center;
       margin: 1rem 0;
   }
   
   .image img {
       max-width: 60px;
       height: auto;
       display: flex;
       justify-content: space-between;
   }
   
   .language-switcher-icons {
       position: absolute;
       top: 5px;
       right: 15px;
       z-index: 9999;
       display: flex;
       gap: 10px;
   }
   
   .language-switcher-icons a img {
       width: 26px;
       height: auto;
       border-radius: 4px;
       transition: transform 0.3s ease;
   }
   
   .language-switcher-icons a:hover img {
       transform: scale(1.2);
       cursor: pointer;
   }
   
   .dropdown {
       position: relative;
       display: inline-block;
       margin-top: 3px;
   }
   
   .drop-btn {
       background-color: transparent;
       color: inherit;
       padding: 0.5rem 1rem;
       font-size: inherit;
       font-family: inherit;
       border: none;
       cursor: pointer;
       display: flex;
       align-items: center;
       gap: 5px;
   }
   
   .drop-btn:hover {
       color: #4a90e2;
   }
   
   .dropdown-content {
       display: none;
       position: absolute;
       background-color: #f9f9f9;
       min-width: 250px;
       box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
       z-index: 1;
       border-radius: 5px;
       right: 0;
       text-align: center;
       font-size: 14px;
   }
   
   .dropdown-content a {
       color: #333;
       padding: 12px 16px;
       text-decoration: none;
       display: block;
       transition: background-color 0.3s;
   }
   
   .dropdown-content a:hover {
       color: white;
   }
   
   .dropdown:hover .dropdown-content {
       display: block;
   }
   
   .dropdown-content.services-menu {
       min-width: 420px;
       max-width: 760px;
       padding: 12px;
   }

   
   .services-inner {
       display: grid;
       grid-template-columns: 1.4fr 1fr;
       gap: 12px;
       align-items: start;
       direction: ltr;
       
   }

   .services-desc {
       grid-column: 1;
       direction: rtl;
       /* متن توضیحات راست‌چین بمونه */
   }
   
   .services-list {
       grid-column: 2;
       direction: rtl;
       /* عنوان‌های آیتم‌ها راست‌چین بمونه */
       text-align: right;
   }
   /* لیست سرویس‌ها */
   
   .services-list {
       padding: 0;
       margin: 0;
       list-style: none;
       display: flex;
       flex-direction: column;
       gap: 8px;
   }
   
   .service-link {
       display: block;
       padding: 10px 12px;
       border-radius: 8px;
       text-decoration: none;
       text-align: center;
       color: #0f172a;
       font-weight: 700;
       background: linear-gradient(180deg, #fff, #fbfdff);
       border: 1px solid rgba(15, 23, 42, 0.04);
       transition: box-shadow .12s, transform .08s, background .12s;
   }
   
   .service-link:hover,
   .service-link:focus {
       transform: translateY(-2px);
       background: linear-gradient(90deg, rgba(68, 114, 196, 0.06), rgba(255, 191, 0, 0.03));
       color: #0b3b6b;
       box-shadow: 0 6px 18px rgba(68, 114, 196, 0.08);
       outline: none;
   }
   /* جعبه‌ی توضیحات */
   
   .services-desc {
       min-height: 140px;
       padding: 14px;
       border-radius: 8px;
       background: linear-gradient(180deg, #ffffff, #f8fbff);
       border: 1px solid rgba(15, 23, 42, 0.03);
       color: #0f172a;
       font-size: 14px;
       box-sizing: border-box;
   }
   /* مخفی/نمایش توضیحات */
   
   .desc-block {
       display: none;
   }
   
   .desc-block.active {
       display: block;
   }

   
   @media (max-width: 900px) {
       .dropdown-content.services-menu {
           min-width: auto;
           max-width: calc(100% - 32px);
           margin: 0 8px;
       }
       .services-inner {
           grid-template-columns: 1fr;
           direction: rtl;
       }
       /* موبایل rtl برگردد طبیعی */
       .services-list {
           order: 1;
           grid-column: 1;
       }
       .services-desc {
           order: 2;
           grid-column: 1;
           margin-top: 8px;
       }
   }
   /* فوکوس واضح برای دسترسی */
   
   .drop-btn:focus,
   .service-link:focus {
       box-shadow: 0 0 0 4px rgba(68, 114, 196, 0.12);
       border-radius: 8px;
   }
   
   @media (max-width: 768px) {
       .navbar {
           display: none;
           flex-direction: column;
           gap: 1rem;
       }
   }
   
   .live-prices {
       width: 100%;
       background-image: url('../image/49.png');
       background-size: auto;
       padding: 80px 20px;
       text-align: center;
       position: relative;
       overflow: hidden;
   }
   
   .live-prices::before {
       content: "";
       position: absolute;
       top: -100px;
       right: -100px;
       width: 300px;
       height: 300px;
       background: radial-gradient(circle, rgba(68, 114, 196, 0.15) 0%, transparent 70%);
       border-radius: 50%;
       z-index: 0;
   }
   
   .live-prices .container {
       max-width: 1300px;
       margin: 0 auto;
       position: relative;
       z-index: 1;
   }
   
   .live-prices .section-title {
       font-size: 32px;
       font-weight: bold;
       color: #1a2a3a;
       margin-bottom: 15px;
   }
   
   .live-prices .section-subtitle {
       font-size: 16px;
       color: #444;
       margin-bottom: 50px;
   }
   
   .price-grid {
       display: grid;
       grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
       gap: 25px;
   }
   
   .price-card {
       background: #1a8f3c;
       border-radius: 18px;
       padding: 30px;
       box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
       transition: all 0.3s ease-in-out;
       opacity: 0;
       transform: translateY(20px);
       animation: fadeInUp 0.8s ease forwards;
   }
   
   .price-card:nth-child(2) {
       animation-delay: 0.2s;
   }
   
   .price-card:nth-child(3) {
       animation-delay: 0.4s;
   }
   
   .price-card:hover {
       transform: translateY(-8px);
       box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
   }
   
   .price-card .icon {
       font-size: 50px;
       margin-bottom: 15px;
   }
   
   .price-card h3 {
       font-size: 20px;
       margin-bottom: 12px;
       color: #333;
   }
   
   .price-card .price {
       font-size: 24px;
       font-weight: bold;
       color: #FF9500;
       margin-bottom: 12px;
       font-variant-numeric: tabular-nums;
   }
   
   .price-card .change {
       font-size: 15px;
       font-weight: bold;
       padding: 6px 14px;
       border-radius: 30px;
       display: inline-block;
       animation: pulse 1.3s infinite;
   }
   
   .price-card .change.up {
       background: #e6f9ec;
       color: #1a8f3c;
   }
   
   .price-card .change.down {
       background: #fdeaea;
       color: #d93025;
   }
   /* انیمیشن‌ها */
   
   @keyframes fadeInUp {
       to {
           opacity: 1;
           transform: translateY(0);
       }
   }
   
   @keyframes pulse {
       0%,
       100% {
           opacity: 1;
       }
       50% {
           opacity: 0.7;
       }
   }
   /* ریسپانسیو */
   
   @media (max-width: 768px) {
       .live-prices .section-title {
           font-size: 24px;
       }
       .price-card .price {
           font-size: 20px;
       }
   }
   
   
   .hero-parallax {
       position: relative;
       width: 100%;
       overflow: hidden;
       /* تعیین ارتفاع واضح — می‌تونی به 50vh یا 60vh تغییر بدی */
       min-height: 48vh;
       display: block;
       border-bottom: 5px solid #0f172a;
   }
   /* make picture fill the hero and act as stacking child */
   
   .hero-parallax>picture,
   .hero-parallax>img,
   .hero-parallax>picture>img {
       display: block;
       width: 100%;
       height: 100%;
       object-fit: cover;
       /* cover برای جلوگیری از نوار سفید */
   }
   /* target the actual image that will be transformed */
   
   .hero-parallax img.hero-img {
       will-change: transform;
       transform: translate3d(0, 0, 0);
       transition: transform 220ms linear;
       /* نرم شدن تغییرات (اختیاری) */
       backface-visibility: hidden;
   }
   /* overlay */
   
   .hero-parallax::before {
       content: "";
       position: absolute;
       inset: 0;
       background: rgba(0, 0, 0, 0.12);
       z-index: 1;
       pointer-events: none;
   }
   /* ensure picture sits above overlay */
   
   .hero-parallax>* {
       position: relative;
       z-index: 2;
   }
   /* mobile: کمتر حرکت، اما اجازه بده js تصمیم بگیره */
   
   @media (max-width: 768px) {
       .hero-parallax {
           min-height: 38vh;
       }
       /* حذف transform: none !important که ممکنه مانع JS شود */
       .hero-parallax img.hero-img {
           transition: none;
           /* اجازه بده JS خودش روی موبایل غیرفعال کنه اگر خواستی */
       }
   }
   
   /* ===== hero fixes (اضافه کن — جایگزین نکن) ===== */
.hero-parallax {
    position: relative;       /* لازم برای موقعیت‌دهی picture */
    width: 100%;
    min-height: 80vh;         /* همانی که گذاشتی — می‌تونی 50vh یا 60vh کنی */
    overflow: hidden;
    border-bottom: 5px solid #0f172a; /* همانی که داری */
    display: block;
}

/* Make the <picture> fill the hero exactly (absolute) */
.hero-parallax > picture,
.hero-parallax > picture > img,
.hero-parallax > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;    /* cover جلوگیری می‌کند از نوار سفید */
    object-position: center center;
    margin: 0;
}

/* اگر overlay یا محتوا روی هِرو داری، آن‌ها را بالا نگه دار */
.hero-parallax .hero-overlay,
.hero-parallax .hero-content {
    position: relative;
    z-index: 2;
}

/* موبایل: ارتفاع کمتر تا تصویر کشیده نشود */
@media (max-width: 768px) {
    .hero-parallax {
        min-height: 36vh; /* کمتر برای موبایل */
    }
    .hero-parallax > picture,
    .hero-parallax > picture > img,
    .hero-parallax > img {
        object-position: center top; /* در موبایل بهتر است top */
    }
}
   
   .image-2 {
       display: flex;
       justify-content: center;
       align-items: center;
       margin: 1rem auto;
   }
   
   .image-2 img {
       max-width: 110px;
       height: auto;
       margin: 1rem;
   }
   
   @media (max-width: 768px),
   (max-width:1265px) {
       .image img {
           display: none;
       }
   }
   
   .navbar-container {
       display: flex;
       align-items: center;
       padding: 0 1rem;
   }
   
   .navbar {
       display: flex;
       justify-content: space-between;
       gap: 2.5rem;
       padding: 1rem;
       flex-wrap: wrap;
       color: #fff;
   }
   
   .navbar a {
       padding: 0.5rem 0rem;
       transition: all 0.3s ease;
       font-weight: 500;
   }
   
   .navbar a:hover {
       color: #4a90e2;
   }
   
   .hamburger-btn {
       display: none;
       /* hidden on desktop */
       width: 48px;
       height: 42px;
       border-radius: 10px;
       background: transparent;
       border: 0;
       cursor: pointer;
       align-items: center;
       justify-content: center;
   }
   
   .hamburger-line {
       width: 22px;
       height: 2px;
       background: #fff;
       margin: 3px 0;
       border-radius: 2px;
       transition: all .22s ease;
   }
   /* Open/close styles */
   
   .hamburger-btn.open .hamburger-line:nth-child(1) {
       transform: translateY(7px) rotate(45deg);
       background: #fff;
   }
   
   .hamburger-btn.open .hamburger-line:nth-child(2) {
       opacity: 0;
       transform: scale(0);
   }
   
   .hamburger-btn.open .hamburger-line:nth-child(3) {
       transform: translateY(-7px) rotate(-45deg);
       background: #fff;
   }
   
   .hamburger-btn.open {
       background: var(--brand-blue);
       color: #fff;
       box-shadow: 0 10px 28px rgba(11, 61, 98, 0.12);
   }
   
   @media (max-width: 880px),
   (max-width: 1265px) {
       .navbar {
           display: none !important;
       }
       /* ensure desktop nav hidden */
       .hamburger-btn {
           display: flex;
           gap: 4px;
           align-items: center;
           justify-content: center;
       }
   }
   
   .mobile-overlay {
       position: fixed;
       inset: 0;
       background: var(--overlay-bg);
       display: none;
       z-index: 9999;
       align-items: flex-start;
       justify-content: flex-end;
   }
   
   .mobile-overlay[aria-hidden="false"] {
       display: flex;
   }
   
   .mobile-panel {
       width: 92%;
       max-width: 350px;
       height: 100vh;
       background: #fff;
       padding: 18px;
       box-shadow: -12px 0 40px rgba(0, 0, 0, 0.18);
       overflow: auto;
       border-top-left-radius: 12px;
       border-bottom-left-radius: 12px;
       transform: translateX(16px);
       transition: transform .28s cubic-bezier(.22, .9, .3, 1);
   }
   
   .mobile-overlay[aria-hidden="false"] .mobile-panel {
       transform: translateX(0);
   }
   
   .mobile-panel-header {
       display: flex;
       align-items: center;
       justify-content: space-between;
       gap: 8px;
       margin-bottom: 8px;
   }
   
   .panel-logo {
       max-height: 44px;
   }
   
   .mobile-close {
       background: transparent;
       border: 0;
       font-size: 24px;
       cursor: pointer;
       color: #303030;
   }
   
   .mobile-nav-list {
       list-style: none;
       padding: 0;
       margin: 0;
       display: flex;
       flex-direction: column;
       gap: 6px;
   }
   
   .mobile-nav-list li a,
   .mobile-nav-list li button {
       display: block;
       text-align: right;
       padding: 12px;
       border-radius: 8px;
       color: var(--nav-text);
       text-decoration: none;
       font-weight: 800;
   }
   
   .mobile-nav-list li a:hover,
   .mobile-nav-list li button:hover {
       background: rgba(10, 61, 98, 0.04);
       color: var(--brand-blue);
   }
   /* mobile dropdown styling (collapsible) */
   
   .mobile-nav-list .dropdown {
       display: block;
   }
   
   .mobile-nav-list .dropdown>button {
       width: 100%;
       background: transparent;
       border: 0;
       text-align: right;
       font-weight: 800;
   }
   
   .mobile-nav-list .dropdown .dropdown-content {
       display: none;
       padding-left: 10px;
       margin-top: 6px;
   }
   
   .mobile-nav-list .dropdown.open .dropdown-content {
       display: block;
   }
   /* ensure dropdown links styled mobile */
   
   .mobile-nav-list .dropdown .dropdown-content li a {
       padding: 8px 4px;
       display: block;
       font-weight: 600;
   }
   /* small tweaks */
   
   .mobile-panel {
       font-size: 15.6px;
   }
   /* mobile submenu */
   
   .mobile-parent-dropdown {
       width: 100%;
   }
   
   .mobile-subtoggle {
       font-family: 'Yekan';
       width: 100%;
       text-align: right;
       padding: 12px;
       background: transparent;
       border: 0;
       font-size: 16px;
       font-weight: 800;
       cursor: pointer;
       display: flex;
       justify-content: space-between;
       align-items: center;
       gap: 10px;
   }
   
   .mobile-subtoggle .caret {
       display: inline-block;
       transition: transform .25s ease;
   }
   
   .mobile-submenu {
       display: none;
       list-style: none;
       padding-right: 12px;
       margin: 6px 0 12px 0;
       border-right: 2px solid rgba(0, 0, 0, 0.03);
   }
   
   .mobile-submenu li a {
       display: block;
       padding: 10px 12px;
       text-decoration: none;
       color: #1a2a3a;
       font-weight: 600;
       border-radius: 8px;
   }
   
   .mobile-parent-dropdown.open>.mobile-submenu {
       display: block;
   }
   /* rotate caret on open */
   
   .mobile-parent-dropdown.open>.mobile-subtoggle .caret {
       transform: rotate(180deg);
   }
   /* small visual for nested links hover */
   
   .mobile-submenu li a:hover {
       background: rgba(68, 114, 196, 0.06);
       color: var(--tohfeh-brand-blue);
   }
   
   @media (max-width: 880px) {
       .navbar {
           display: none;
       }
       /* hide desktop nav */
       .hamburger-btn {
           display: flex;
       }
   }
   
   main {
       max-width: 1300px;
       margin: 2rem auto;
       padding: 0 1rem;
   }
   
   .first {
       display: flex;
       flex-wrap: wrap;
       gap: 2rem;
       margin-bottom: 3rem;
       align-items: center;
   }
   
   .about {
       flex: 1;
       min-width: 300px;
   }
   
   .about h1 {
       color: #1a2a3a;
       margin-bottom: 1rem;
       font-size: 1.8rem;
   }
   
   .about p {
       text-align: justify;
       color: #555;
   }
   
   .image-about {
       flex: 1;
       min-width: 300px;
   }
   
   .image-about img {
       width: 100%;
       border-radius: 8px;
       box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
   }
   
   .second {
       background-color: #fff;
       padding: 2rem;
       border-radius: 8px;
       box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
       margin-bottom: 3rem;
   }
   
   .second h2 {
       color: #2c3e50;
       margin-bottom: 1rem;
       font-size: 1.5rem;
   }
   
   .second p {
       margin-bottom: 1.5rem;
       color: #555;
       text-align: justify;
   }
   
   .second button {
       font-family: 'Yekan';
       background: linear-gradient(135deg, #1e76fa, #1a2a3a);
       transition: all 1s ease;
       color: white;
       border: none;
       padding: 0.5rem 1.5rem;
       border-radius: 4px;
       cursor: pointer;
   }
   
   .second button:hover {
       background: linear-gradient(135deg, #1a2a3a, #1e76fa);
   }
   
   h3 {
       font-size: 2rem;
       color: #2c3e50;
       margin-bottom: 1.5rem;
       text-align: center;
   }
   
   footer {
       background-color: #2c3e50;
       color: #fff;
       padding-top: 3%;
   }
   
   .copyright {
       background-color: #1a2a3a;
       color: #fff;
       text-align: center;
       padding: 1rem 0;
       margin-top: 2rem;
       font-size: 0.9rem;
   }
   
   .copyright p {
       margin: 0;
   }
   
   .footer-container {
       max-width: 1500px;
       margin: 0 auto;
       padding: 0 1rem;
       display: flex;
       flex-wrap: wrap;
       gap: 2rem;
       font-size: 16px;
   }
   
   .right-footer {
       margin-top: 3%;
       flex: 2;
       min-width: 300px;
   }
   
   .left-footer {
       margin-right: 5%;
       margin-top: 3%;
       flex: 1;
       min-width: 300px;
       display: flex;
       justify-content: space-between;
   }
   
   .right,
   .left {
       flex: 1;
       text-align: center;
       padding-top: 20px;
   }
   
   .right a,
   .left a {
       display: block;
       margin-bottom: 2rem;
       color: #bdc3c7;
       transition: color 0.3s;
       font-size: 14px;
   }
   
   .right a:hover,
   .left a:hover {
       color: #4a90e2;
   }
   
   .outro {
       display: flex;
       margin-bottom: 1.5rem;
   }
   
   .outro img {
       max-width: 125px;
       margin-bottom: 1rem;
   }
   
   @media (max-width: 1050px) {
    .outro img {
           display: none;
       }
   }
   
   .outro p {
       text-align: justify;
       padding: 20px;
       color: #ecf0f1;
       font-size: 16px;
   }
   
   .map p {
       margin-bottom: 1.5rem;
       color: #bdc3c7;
   }
   
   .info {
       display: flex;
       flex-wrap: wrap;
       gap: 2.5rem;
   }
   
   .info-tel {
       display: flex;
       flex-wrap: wrap;
       flex-direction: column;
   }
   
   .info a {
       color: #bdc3c7;
       transition: color 0.3s;
   }
   
   .info a:hover {
       color: #4a90e2;
   }
   
   .info i {
       color: #4a90e2;
   }
   
   .footer-social-icons img {
       margin: 5px;
       transition: color 0.3s;
       color: #bdc3c7;
   }
   
   .namad {
       padding: 30px 0;
       display: flex;
       gap: 3rem;
       justify-content: center;
   }
   
   .namad img {
       width: 100px;
       height: 100px;
       background-color: #fff;
       border-radius: 15px;
   }
   
   .news-section {
       padding: 80px 20px;
       background: #f9fafc;
       border-radius: 12px;
       font-family: 'Yekan';
   }
   /* هدر */
   
   .news-header {
       display: flex;
       justify-content: space-between;
       align-items: center;
       margin-bottom: 40px;
   }
   
   .article-body h1 {
       padding: 30px;
   }
   
   .news-header h2 {
       font-size: 30px;
       font-weight: bold;
       color: #222;
       border-right: 5px solid #4472C4;
       padding-right: 12px;
   }
   
   .news-header .all-news {
       color: #FFBF00;
       font-weight: 600;
       text-decoration: none;
       transition: 0.3s;
   }
   
   .news-header .all-news:hover {
       color: #d49e00;
   }
   /* خبر ویژه */
   
   .overlay h3 {
       color: #f5f5f5;
   }
   
   .featured-news {
       position: relative;
       border-radius: 16px;
       overflow: hidden;
       margin-bottom: 40px;
       box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
   }
   
   .featured-news img {
       width: 100%;
       height: 420px;
       object-fit: cover;
       display: block;
   }
   
   .featured-news .overlay {
       position: absolute;
       bottom: 0;
       right: 0;
       left: 0;
       padding: 30px;
       background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
       color: #fff;
   }
   
   .featured-news h3 {
       font-size: 24px;
       margin-bottom: 10px;
   }
   
   .featured-news p {
       font-size: 16px;
       margin-bottom: 12px;
       line-height: 1.7;
   }
   
   .featured-news .read-more {
       color: #FFBF00;
       font-weight: bold;
       text-decoration: none;
       transition: 0.3s;
   }
   
   .featured-news .read-more:hover {
       color: #ffd84d;
   }
   /* لیست اخبار */
   
   .news-list {
       display: flex;
       flex-direction: column;
       gap: 20px;
   }
   
   .news-item {
       display: flex;
       gap: 20px;
       background: #fff;
       border-radius: 12px;
       overflow: hidden;
       box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
       transition: transform 0.3s;
   }
   
   .news-item:hover {
       transform: translateY(-6px);
   }
   
   .news-item img {
       width: 220px;
       object-fit: cover;
   }
   
   .news-item .text {
       padding: 20px;
   }
   
   .news-item h3 {
       font-size: 18px;
       margin-bottom: 8px;
       color: #222;
   }
   
   .news-item p {
       font-size: 14px;
       color: #555;
       margin-bottom: 10px;
   }
   
   .news-item .read-more {
       font-size: 14px;
       font-weight: bold;
       color: #4472C4;
       text-decoration: none;
   }
   
   .news-item .read-more:hover {
       color: #274c8a;
   }
   /* ریسپانسیو */
   
   @media (max-width: 768px) {
       .news-item {
           flex-direction: column;
       }
       .news-item img {
           width: 100%;
           height: 200px;
       }
   }
   
   .portal {
       background-color: #1a2a3a;
       border-radius: 8px;
       border: #1a2a3a 1px solid;
       display: flex;
       justify-content: space-around;
       color: #eee;
       padding: 2rem;
       margin: 2rem 0;
       flex-wrap: wrap;
   }
   
   .portal-2 {
       background-color: #1a2a3a;
       border-radius: 8px;
       border: #1a2a3a 1px solid;
       display: flex;
       justify-content: space-around;
       color: #eee;
       padding: 2rem;
       margin: 2rem 0;
       flex-wrap: wrap;
   }
   
   .portal-sections {
       text-align: center;
       border: #ebdc16 2px solid;
       border-radius: 8px;
       width: 30%;
       padding: 1.5rem;
       margin: 0.5rem;
       transition: all 0.3s ease;
   }
   
   .portal-sections:hover {
       background-color: #ebdc16;
       color: #333;
       transform: translateY(-5px);
   }
   
   .portal i {
       font-size: 2.5rem;
       margin-bottom: 1rem;
       display: block;
   }
   
   .portal p {
       margin: 0;
       font-size: 1.1rem;
   }
   
   @media (max-width: 768px) {
       .portal-sections {
           width: 45%;
       }
   }
   
   @media (max-width: 480px) {
       .portal-sections {
           width: 100%;
       }
   }
   
   @media (max-width: 768px) {
       .navbar {
           position: fixed;
           top: 80px;
           right: -100%;
           width: 80%;
           height: calc(100vh - 80px);
           background-color: #1a2a3a;
           flex-direction: column;
           align-items: center;
           justify-content: flex-start;
           padding-top: 2rem;
           gap: 1.5rem;
           transition: right 0.3s ease;
           box-shadow: -5px 0 15px rgba(0, 0, 0, 0.1);
           z-index: 99;
       }
       .navbar.active {
           right: 0;
       }
       .first {
           flex-direction: column-reverse;
       }
       .left-footer {
           flex-direction: column;
       }
       .outro img {
           display: none;
       }
   }
   
   @media (max-width: 480px) {
       .maghaleh {
           width: 100%;
       }
       .slider {
           max-height: 213px;
       }
       .slider-controls button {
           width: 25px;
           height: 25px;
       }
       .dot {
           width: 8px;
           height: 8px;
       }
       .outro img {
           display: none;
       }
   }
   /* tenders-main.css
   مستقل از استایل‌های هدر/فوتر؛ همه کلاس‌ها با پیش‌وند tohfeh-
   رنگ‌ها: #4472C4 (آبی)، سفید، #1a2a3a (تیره)
*/
   
    :root {
       --tohfeh-blue: #4472C4;
       --tohfeh-dark: #1a2a3a;
       --tohfeh-white: #ffffff;
       --tohfeh-muted: #6b7785;
       --tohfeh-radius: 12px;
       --tohfeh-gap: 18px;
       --tohfeh-max: 1200px;
       --tohfeh-font: "Yekan", "Segoe UI", Roboto, Tahoma, Arial, sans-serif;
   }
   /* محلی: جلوگیری از اثر روی header/footer با گزینشگر root خاص */
   /* دسترسی */
   
   .visually-hidden {
       position: absolute !important;
       height: 1px;
       width: 1px;
       overflow: hidden;
       clip: rect(1px, 1px, 1px, 1px);
       white-space: nowrap;
   }
   /* کانتینر مرکزی */
   
   .tohfeh-container {
       max-width: var(--tohfeh-max);
       margin: 0 auto;
       padding: 0 16px;
   }
   /* بخش اصلی */
   
   .tohfeh-main {
       font-family: var(--tohfeh-font);
       color: var(--tohfeh-dark);
       background: transparent;
       padding: 28px 0 60px;
   }
   /* HERO */
   
   .tohfeh-hero {
       padding: 18px 0 8px;
   }
   
   .tohfeh-h1 {
       font-size: 2rem;
       margin: 0 0 6px;
       color: var(--tohfeh-dark);
       letter-spacing: 0.2px;
   }
   
   .tohfeh-lead {
       color: var(--tohfeh-muted);
       margin: 0;
       font-size: 0.98rem;
   }
   /* CONTROLS */
   
   .tohfeh-controls {
       margin-top: 14px;
       margin-bottom: 20px;
   }
   
   .tohfeh-form {
       background: var(--tohfeh-white);
       padding: 14px;
       border-radius: var(--tohfeh-radius);
       box-shadow: 0 6px 20px rgba(26, 42, 58, 0.06);
       border: 1px solid rgba(26, 42, 58, 0.04);
   }
   
   .tohfeh-form-grid {
       display: grid;
       grid-template-columns: repeat(4, 1fr);
       gap: 12px;
       align-items: end;
   }
   /* فیلدها */
   
   .tohfeh-field {
       display: flex;
       flex-direction: column;
       gap: 6px;
   }
   
   .tohfeh-field-label {
       font-size: 0.82rem;
       color: var(--tohfeh-muted);
   }
   
   .tohfeh-input,
   .tohfeh-select {
       padding: 10px 12px;
       border-radius: 8px;
       border: 1px solid rgba(26, 42, 58, 0.08);
       font-size: 0.95rem;
       outline: none;
       background: #fff;
       color: var(--tohfeh-dark);
   }
   
   .tohfeh-input::placeholder {
       color: #9aa3ad;
   }
   /* دکمه‌ها */
   
   .tohfeh-actions {
       display: flex;
       gap: 10px;
       justify-content: flex-end;
   }
   
   .tohfeh-btn-primary,
   .tohfeh-btn-ghost {
       padding: 10px 14px;
       border-radius: 8px;
       font-weight: 700;
       cursor: pointer;
       font-size: 0.95rem;
       border: none;
   }
   
   .tohfeh-btn-primary {
       background: var(--tohfeh-blue);
       color: var(--tohfeh-white);
   }
   
   .tohfeh-btn-ghost {
       background: transparent;
       color: var(--tohfeh-dark);
       border: 1px solid rgba(26, 42, 58, 0.06);
   }
   /* LIST / CARDS */
   
   .tohfeh-list {
       margin-top: 22px;
   }
   
   .tohfeh-section-title {
       font-size: 1.05rem;
       color: var(--tohfeh-dark);
       margin-bottom: 12px;
   }
   /* گراید کارت‌ها */
   
   .tohfeh-cards {
       display: grid;
       grid-template-columns: repeat(3, 1fr);
       gap: var(--tohfeh-gap);
   }
   /* کارت تکی */
   
   .tohfeh-card {
       background: var(--tohfeh-white);
       border-radius: 12px;
       padding: 16px;
       display: flex;
       flex-direction: column;
       gap: 12px;
       box-shadow: 0 8px 20px rgba(26, 42, 58, 0.05);
       border: 1px solid rgba(26, 42, 58, 0.04);
       min-height: 170px;
   }
   
   .tohfeh-card-head {
       display: flex;
       justify-content: space-between;
       align-items: center;
       gap: 10px;
   }
   
   .tohfeh-badge {
       display: inline-block;
       padding: 6px 10px;
       border-radius: 999px;
       background: rgba(68, 114, 196, 0.12);
       color: var(--tohfeh-blue);
       font-weight: 700;
       font-size: 0.78rem;
   }
   
   .tohfeh-badge--muted {
       background: rgba(26, 42, 58, 0.06);
       color: var(--tohfeh-dark);
   }
   
   .tohfeh-deadline {
       font-size: 0.83rem;
       color: var(--tohfeh-muted);
   }
   
   .tohfeh-card-title {
       font-size: 1rem;
       margin: 0;
       color: var(--tohfeh-dark);
   }
   
   .tohfeh-card-desc {
       margin: 0;
       color: var(--tohfeh-muted);
       font-size: 0.92rem;
       line-height: 1.5;
   }
   /* متادیتا */
   
   .tohfeh-meta {
       list-style: none;
       padding: 0;
       margin: 0;
       display: flex;
       gap: 8px;
       flex-wrap: wrap;
       color: var(--tohfeh-muted);
       font-size: 0.88rem;
   }
   
   .tohfeh-meta li {
       background: rgba(26, 42, 58, 0.03);
       padding: 6px 8px;
       border-radius: 6px;
   }
   /* اکشن‌های کارت */
   
   .tohfeh-card-actions {
       margin-top: auto;
       display: flex;
       gap: 14px;
       align-items: center;
   }
   
   .tohfeh-link {
       color: var(--tohfeh-blue);
       font-weight: 700;
       text-decoration: none;
       font-size: 0.92rem;
       display: inline-block;
   }
   /* TABLE VIEW */
   
   .tohfeh-tableview {
       margin-top: 26px;
   }
   
   .tohfeh-table-wrap {
       overflow-x: auto;
       border-radius: 8px;
   }
   
   .tohfeh-table {
       width: 100%;
       border-collapse: collapse;
       min-width: 720px;
       background: var(--tohfeh-white);
   }
   
   .tohfeh-table thead th {
       text-align: left;
       padding: 12px 14px;
       font-size: 0.9rem;
       color: var(--tohfeh-dark);
       border-bottom: 1px solid rgba(26, 42, 58, 0.06);
   }
   
   .tohfeh-table tbody td {
       padding: 12px 14px;
       border-bottom: 1px solid rgba(26, 42, 58, 0.04);
       color: var(--tohfeh-muted);
       font-size: 0.92rem;
   }
   
   .tohfeh-table-link {
       color: var(--tohfeh-blue);
       font-weight: 700;
       text-decoration: none;
   }
   /* PAGINATION */
   
   .tohfeh-pagination {
       margin-top: 22px;
       display: flex;
       justify-content: center;
   }
   
   .tohfeh-pages {
       list-style: none;
       display: flex;
       gap: 8px;
       padding: 0;
       margin: 0;
       align-items: center;
   }
   
   .tohfeh-page {
       display: inline-block;
       padding: 8px 12px;
       border-radius: 8px;
       text-decoration: none;
       color: var(--tohfeh-dark);
       border: 1px solid rgba(26, 42, 58, 0.04);
   }
   
   .tohfeh-page--current {
       background: var(--tohfeh-blue);
       color: var(--tohfeh-white);
       border-color: var(--tohfeh-blue);
   }
   /* ریسپانسیو */
   
   @media (max-width: 1024px) {
       .tohfeh-cards {
           grid-template-columns: repeat(2, 1fr);
       }
       .tohfeh-form-grid {
           grid-template-columns: repeat(2, 1fr);
       }
   }
   
   @media (max-width: 640px) {
       .tohfeh-cards {
           grid-template-columns: 1fr;
       }
       .tohfeh-form-grid {
           grid-template-columns: 1fr;
       }
       .tohfeh-actions {
           justify-content: flex-start;
       }
       .tohfeh-h1 {
           font-size: 1.4rem;
       }
       .tohfeh-table {
           min-width: 600px;
       }
   }
   /* موبایل - جدول کارت‌نما */
   
   @media (max-width: 480px) {
       .tohfeh-table thead {
           display: none;
       }
       .tohfeh-table,
       .tohfeh-table tbody,
       .tohfeh-table tr,
       .tohfeh-table td {
           display: block;
           width: 100%;
       }
       .tohfeh-table tr {
           margin-bottom: 12px;
           border-bottom: 1px solid rgba(26, 42, 58, 0.04);
       }
       .tohfeh-table td {
           text-align: right;
           padding-left: 50%;
           position: relative;
       }
       .tohfeh-table td::before {
           content: attr(data-label);
           position: absolute;
           left: 12px;
           width: 45%;
           padding-right: 8px;
           font-weight: 700;
           color: var(--tohfeh-dark);
           text-align: left;
       }
   }
   /* کوچک‌سازی برخی سایزها برای طرح اداری رسمی */
   
   .tohfeh-h1 {
       font-weight: 700;
   }
   
   .tohfeh-section-title {
       font-weight: 700;
   }
   /* focus states for accessibility */
   
   .tohfeh-input:focus,
   .tohfeh-select:focus,
   .tohfeh-link:focus,
   .tohfeh-page:focus {
       outline: 3px solid rgba(68, 114, 196, 0.15);
       outline-offset: 2px;
   }
   /* چاپ */
   
   @media print {
       .tohfeh-form,
       .tohfeh-pagination,
       .tohfeh-card-actions {
           display: none !important;
       }
       .tohfeh-card {
           border: 1px solid #ccc;
           box-shadow: none;
       }
   }
   
   .ta2-job-apply {
       width: 100%;
       padding: 48px 18px;
       display: flex;
       justify-content: center;
       background: transparent;
       box-sizing: border-box;
       overflow-x: hidden;

   }

   
   .ta2-container {
       max-width: 720px;
       width: 100%;
       box-sizing: border-box;
   }
   /* عنوان فرم */
   
   #ta2-job-title {
       text-align: center;
       margin-bottom: 16px;
       font-size: 26px;
       color: #1a2a3a;
   }
   /* فرم اصلی */
   
   .ta2-form {
       background: #fff;
       padding: 26px;
       border-radius: 12px;
       box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
       box-sizing: border-box;
       overflow: visible;
   }
   /* ردیف‌ها — فلکس با امکان شکستن */
   
   .ta2-row {
       display: flex;
       gap: 14px;
       flex-wrap: wrap;
       align-items: stretch;
       min-width: 0;
       /* بسیار مهم برای جلوگیری از overflow فرزندان فلکس */
   }
   
   .ta2-row button {
       font-family: 'Yekan';
   }
   /* اطمینان از اینکه فرزندان فلکس می‌توانند کوچک شوند */
   
   .ta2-row>* {
       min-width: 0;
   }
  
   .ta2-row > .ta2-field {
  flex: 1 1 240px;   /* همان چیزی که داشتی اما تاکید بر shrink */
  min-width: 0;      /* بسیار مهم برای جلوگیری از overflow */
  display: flex;
  flex-direction: column;
  justify-content: flex-start; /* جلوگیری از فاصله اضافی */
}
   
   .ta2-field {
       flex: 1 1 240px;
       position: relative;
       min-width: 0;
       /* مهم: اجازه‌ی shrink دادن */
   }
   
   .ta2-field input[type="text"],
   .ta2-field input[type="tel"] {
       width: 100%;
       padding: 12px 14px;
       border: 1.5px solid #d3d7db;
       border-radius: 8px;
       font-size: 15px;
       background: #fff;
       box-sizing: border-box;
   }
   /* لیبل شناور */
   
   
   /* وقتی تمرکز یا مقدار دارد لیبل بالا می‌رود */
   
   .ta2-field input:focus+label,
   .ta2-field input:valid+label {
       top: -10px;
       right: 8px;
       font-size: 12px;
       color: #1a2a3a;
   }
  
   .ta2-field input,
.ta2-field label {
  margin: 0;
  box-sizing: border-box;
}
   
   .ta2-file-uploader {
       width: 100%;
       position: relative;
       min-width: 0;
       /* مهم */
       box-sizing: border-box;
   }
   /* مخفی‌سازی امن برای input[type=file] (بدون left:-9999px) */
   
   .ta2-file-uploader input[type="file"] {
       position: absolute !important;
       width: 1px;
       height: 1px;
       padding: 0;
       margin: 0;
       overflow: hidden;
       clip: rect(0 0 0 0);
       clip-path: inset(50%);
       white-space: nowrap;
       border: 0;
       opacity: 0;
       left: 0;
       top: 0;
   }
   /* دکمهٔ قابل کلیک که native picker را باز می‌کند */
   
   .ta2-file-btn {
       display: inline-flex;
       align-items: center;
       gap: 8px;
       border: 1.5px dashed #9aa3ad;
       padding: 10px 14px;
       border-radius: 8px;
       cursor: pointer;
       background: transparent;
       font-weight: 700;
       user-select: none;
       box-sizing: border-box;
       min-width: 0;
       max-width: 100%;
       overflow: hidden;
       text-overflow: ellipsis;
       white-space: nowrap;
   }
   /* فوکوس واضح */
   
   .ta2-file-btn:focus {
       outline: 3px solid rgba(68, 114, 196, 0.12);
       outline-offset: 3px;
   }
   /* جعبهٔ اطلاعات فایل: محدود و قابل کوتاه شدن */
   
   .ta2-file-info {
       display: inline-flex;
       gap: 10px;
       align-items: center;
       margin-left: 12px;
       background: #f8f9fb;
       padding: 10px 12px;
       border-radius: 8px;
       border: 1px solid #eceff2;
       max-width: calc(100% - 10px);
       box-sizing: border-box;
       overflow: hidden;
       /* جلوگیری از بیرون زدن محتوا */
   }
   /* نام فایل — از طول زیاد جلوگیری کن و ellipsis بزن */
   
   .ta2-file-info strong#ta2-file-name {
       display: inline-block;
       max-width: 40ch;
       /* تعداد کاراکتر قابل نمایش قبل از ... */
       min-width: 0;
       white-space: nowrap;
       overflow: hidden;
       text-overflow: ellipsis;
       font-weight: 700;
       color: #1a2a3a;
   }
   /* سایز فایل */
   
   .ta2-file-size {
       color: #666;
       font-size: 13px;
       margin-right: 6px;
       flex-shrink: 0;
   }
   /* دکمه حذف فایل */
   
   .ta2-file-remove {
       background: transparent;
       border: 0;
       cursor: pointer;
       font-size: 16px;
       color: #b33;
       padding: 4px 6px;
   }
   /* hint & error */
   
   .ta2-file-hint {
       color: #666;
       font-size: 13px;
       margin-top: 8px;
   }
   
   .ta2-file-error {
       color: #b33;
       font-size: 13px;
       margin-top: 8px;
       min-height: 18px;
   }
   /* اکشن‌ها */
   
   .ta2-actions {
       display: flex;
       gap: 10px;
       justify-content: flex-end;
       margin-top: 8px;
       flex-wrap: wrap;
       box-sizing: border-box;
   }
   /* دکمه‌ها */
   
   .ta2-btn-submit {
       background: linear-gradient(135deg, #1a2a3a, #1e76fa);
       color: #fff;
       padding: 12px 16px;
       border-radius: 8px;
       border: 0;
       font-weight: 700;
       cursor: pointer;
       box-sizing: border-box;
   }
   
   .ta2-btn-ghost {
       background: transparent;
       border: 1px solid #d8dfe6;
       padding: 10px 14px;
       border-radius: 8px;
       cursor: pointer;
       box-sizing: border-box;
   }
   /* ========== واکنش‌پذیری ========= */
   
   @media (max-width: 640px) {
       .ta2-row {
           flex-direction: column;
       }
       .ta2-actions {
           justify-content: stretch;
           flex-direction: column-reverse;
       }
       .ta2-file-info {
           width: 100%;
           margin-left: 0;
           justify-content: space-between;
       }
       .ta2-file-btn {
           max-width: 100%;
           white-space: normal;
       }
       .ta2-file-info strong#ta2-file-name {
           max-width: 60ch;
       }
       
  .ta2-row > .ta2-field {
    flex: 1 1 100%;
  }
   }
 

   .ta2-field input:focus,
   .ta2-file-btn:focus,
   .ta2-btn-submit:focus,
   .ta2-btn-ghost:focus,
   .ta2-file-remove:focus {
       outline: 3px solid rgba(68, 114, 196, 0.12);
       outline-offset: 2px;
   }
   /* ========== چاپ ========= */
   
   @media print {
       .ta2-form,
       .ta2-actions,
       .ta2-file-remove {
           display: none !important;
       }
   }
   
   .prices-section {
       padding: 50px 20px;
       background: linear-gradient(135deg, #FFBF00 0%, #4472C4 100%);
       color: #fff;
       text-align: center;
   }
   
   .prices-section h2 {
       font-size: 28px;
       margin-bottom: 30px;
   }
   
   .cards-container {
       display: grid;
       grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
       gap: 20px;
   }
   
   .price-card {
       background: #fff;
       color: #333;
       border-radius: 15px;
       padding: 20px;
       box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
       transition: transform 0.3s, box-shadow 0.3s;
   }
   
   .price-card h3 {
       color: #4472C4;
       margin-bottom: 10px;
   }
   
   .price-card:hover {
       transform: translateY(-8px);
       box-shadow: 0 10px 20px rgba(0, 0, 0, 0.25);
   }
   /* ===== tohfeh request form (scoped) ===== */
   
   .tohfeh-req-section {
       padding: 24px 16px;
       direction: rtl;
   }
   
   .tohfeh-req-card {
       max-width: 820px;
       margin: 0 auto;
       background: #fff;
       border-radius: 12px;
       padding: 22px;
       box-shadow: 0 10px 30px rgba(10, 20, 30, 0.08);
       border: 1px solid rgba(26, 42, 58, 0.04);
       font-family: 'Yekan', sans-serif;
   }
   
   .tohfeh-req-card h2 {
       margin: 0 0 8px;
       color: #1a2a3a;
       font-size: 22px;
   }
   
   .tohfeh-req-desc {
       color: #6b7785;
       margin-bottom: 12px;
       font-size: 14px;
   }
   
   .tohfeh-req-status {
       min-height: 28px;
       margin-bottom: 8px;
       color: #1a2a3a;
       font-weight: 600;
   }
   /* grid */
   
   .tohfeh-req-grid {
       display: grid;
       grid-template-columns: repeat(2, 1fr);
       gap: 12px;
   }
   
   .tohfeh-req-field {
       display: flex;
       flex-direction: column;
       gap: 6px;
   }
   
   .tohfeh-req-field.full {
       grid-column: 1 / -1;
   }
   /* inputs */
   
   .tohfeh-req-field label {
       font-size: 14px;
       color: #333;
   }
   
   .tohfeh-req-field input[type="text"],
   .tohfeh-req-field input[type="tel"],
   .tohfeh-req-field input[type="email"],
   .tohfeh-req-field input[type="date"],
   .tohfeh-req-field textarea {
       padding: 10px 12px;
       border: 1.5px solid #e3e7ea;
       border-radius: 8px;
       background: #fff;
       font-size: 15px;
       color: #1a2a3a;
       outline: none;
       transition: box-shadow 0.15s, border-color 0.15s;
   }
   
   .tohfeh-req-field input:focus,
   .tohfeh-req-field textarea:focus {
       border-color: #4472C4;
       box-shadow: 0 6px 20px rgba(68, 114, 196, 0.06);
   }
   /* actions */
   
   .tohfeh-req-actions {
       margin-top: 14px;
       display: flex;
       gap: 12px;
       justify-content: flex-end;
       align-items: center;
   }
   
   .tohfeh-req-btn {
       background: linear-gradient(135deg, #1a2a3a, #1e76fa);
       color: #fff;
       padding: 10px 18px;
       border-radius: 10px;
       border: 0;
       font-weight: 700;
       cursor: pointer;
   }
   
   .tohfeh-req-btn[disabled] {
       opacity: 0.6;
       cursor: not-allowed;
   }
   
   .tohfeh-req-reset {
       background: transparent;
       border: 1px solid #e6ebef;
       padding: 9px 14px;
       border-radius: 10px;
       cursor: pointer;
   }
   /* note */
   
   .tohfeh-req-note {
       margin-top: 12px;
       color: #6b7785;
       font-size: 13px;
   }
   /* responsive */
   
   @media (max-width:860px) {
       .tohfeh-req-grid {
           grid-template-columns: 1fr;
       }
       .tohfeh-req-actions {
           justify-content: stretch;
           flex-direction: column-reverse;
       }
   }