/*بخش مستر و مربوط به هدر و فوتر */

/*پایان بخش مستر و هدر و فوتر */
.swiper {
      width: 100%;
      height: 100%;
    }

    .swiper-wrapper {
      width: 100%;
      height: 100%;
    }

    .swiper-slide {
      text-align: center;
      display: flex;
      justify-content: center;
      align-items: center;
      width: 100%;
      height: 100%;
    }

    .swiper-slide a {
      display: block;
      width: 100%;
      height: 100%;
    }

    .swiper-slide img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .custom-swiper-pagination {
      position: absolute;
      bottom: 10px;
      width: 100%;
      text-align: center;
      z-index: 10;
    }

    .custom-swiper-pagination .swiper-pagination-bullet {
      width: 10px;
      height: 10px;
      background: #666; /* رنگ نقاط غیرفعال */
      opacity: 0.7;
      margin: 0 5px;
	  transition: all .3s ease;
    }

    .custom-swiper-pagination .swiper-pagination-bullet-active {
      background: #fff; /* رنگ نقطه فعال */
      opacity: 1;
	  border-radius: 6px;
	  width: 25px;
    }

    .custom-autoplay-progress {
      position: absolute;
      left: 16px;
      bottom: 16px;
      z-index: 10;
      width: 48px;
      height: 48px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: bold;
      color: #fff;
    }

    .custom-autoplay-progress svg {
      --progress: 0;
      position: absolute;
      left: 0;
      top: 0px;
      z-index: 10;
      width: 100%;
      height: 100%;
      stroke-width: 4px;
      stroke: #fff;
      fill: none;
      stroke-dashoffset: calc(125.6px * (1 - var(--progress)));
      stroke-dasharray: 125.6;
      transform: rotate(-90deg);
    }
	.custom-autoplay-progress span {
		padding-top: 4px;
		}
		/*شهر ها در نسخه موبایل*/
		@media (max-width: 768px) {
			.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction{
			bottom: -3px !important;
			}
			.custom-swiper-pagination .swiper-pagination-bullet{
			width: 7px;
			height: 7px;
			}
			.custom-swiper-pagination .swiper-pagination-bullet-active{
			width: 15px;
			}
			.custom-autoplay-progress{
			width: 30px;
			left: 5px;
			bottom: -6px;
			}
			.custom-autoplay-progress span {
			font-size: 11px
			}
			.mz-carousel{
			display:none;
			}
			.mz-wrapper{
			display:none;}
		}
		
		.porbazdidtarin{
		padding: 0 20px 5px 13px;
		}
		.swiper-gallery {
            width: 100%;
            height: 100%;
        }

        .swiper-gallery .swiper-slide {
            display: flex;
            justify-content: center;
            align-items: center;
            background: #f0f0f0;
        }

        .swiper-gallery .swiper-slide a {
            display: block;
            width: 100%;
            height: 100%;
            cursor: pointer; /* نشانگر کلیک‌پذیری */
            outline: none; /* حذف هاله آبی مرورگر */
			background-color: white;
        }

        .swiper-gallery .swiper-slide a:focus,
        .swiper-gallery .swiper-slide a:active {
            outline: none; /* حذف هاله آبی موقع فوکوس یا کلیک */
        }

        .swiper-gallery .swiper-slide img {
            width: 100%;
            height: auto;
            object-fit: cover;
			border-radius: 30px;
        }

        /* استایل دکمه‌های ناوبری */
        .swiper-gallery .swiper-button-next,
        .swiper-gallery .swiper-button-prev {
            width: 60px; /* اندازه دکمه */
            height: 60px; /* اندازه دکمه */
            background-color: rgba(255, 255, 255, 0.596); /* سفید محو */
            border-radius: 50%; /* دایره‌ای کردن */
            color: #ffffff; /* رنگ آیکون */
            display: flex;
            align-items: center;
            justify-content: center;
            transition: background-color 0.3s; /* افکت نرم هنگام هاور */
            padding: 10px;
            text-shadow: 60px;
			margin-top: -85px !important;
			margin-right: 10px;
			margin-left: 10px !important;
        }

        /* آیکون‌های فلش */
        .swiper-gallery .swiper-button-next:after,
        .swiper-gallery .swiper-button-prev:after {
            font-size: 35px; /* اندازه آیکون */
            color: #ffffff; /* رنگ آیکون */
			text-shadow: 0 0 3px white;
			font-weight: bold;
        }

        /* افکت هاور برای دکمه‌ها */
        .swiper-gallery .swiper-button-next:hover,
        .swiper-gallery .swiper-button-prev:hover {
            background-color: rgba(255, 255, 255, 0.918); /* کمی پررنگ‌تر هنگام هاور */
        }

        /* استایل برای موبایل */
        @media (max-width: 640px) {
			.porbazdidtarin{
			padding: 0 0 0 0;
			}
            .swiper-gallery .swiper-slide {
                width: 100%; /* فقط یه اسلاید تو موبایل */
            }

            .swiper-gallery .swiper-button-next,
            .swiper-gallery .swiper-button-prev {
                width: 40px; /* کوچیک‌تر تو موبایل */
                height: 40px;
				font-weight: bold;
				margin-top: -55px !important;
            }

            .swiper-gallery .swiper-button-next:after,
            .swiper-gallery .swiper-button-prev:after {
                font-size: 23px; /* آیکون کوچیک‌تر تو موبایل */
            }
        }
		.swiper-rtl .swiper-button-next svg, .swiper-rtl .swiper-button-prev svg
 {	
	 display: none;
		}
		/*عکس-پیشنهادویژه*/
		
		.pishnahad-vije{
			padding: 0 20px 5px 13px;
		}
		.swiper-main {
            width: 100%;
            height: 100%;
            border-radius: 10px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
            overflow: hidden;
        }

        .swiper-main .swiper-slide {
            position: relative;
            width: 100%;
            height: 100%;
            background-color: #ccc; /* جلوگیری از سفید شدن */
        }
        .swiper-main .swiper-slide a {
            display: block;
            width: 100%;
            height: 100%;
        }
        .swiper-main .swiper-slide img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }
        .swiper-main .swiper-slide:hover {
            cursor: pointer;
        }
        .swiper-main-progress-bar {
            position: absolute;
            bottom: 0;
            right: 0;
            width: 100%;
            height: 3px;
            background-color: #ffffff;
        }
        .swiper-main-progress-bar-fill {
            height: 100%;
            background-color: #f97a00;
            width: 0;
            transition: none;
        }
        .swiper-slide-active .swiper-main-progress-bar-fill {
            transition: width 5s linear;
            width: 100%;
        }
        .textleft {
            text-align: left !important;
        }

        .py-20 {
            padding-top: 20px !important;
            padding-bottom: 20px !important;
        }

        .stylemyimage1254:hover {
            opacity: 0.9 !important;
        }
/* استایل بخش بنر ها */ 
			@media (max-width: 980px) {
    .myclass12545 .owl-nav {
        display: none !important;
    }
	.pishnahad-vije{
	 padding: 0 0 0 0			
	}
}
.gallery-section {
    font-family: 'Vazirmatn', sans-serif !important;
    padding: 0 ;
    position: relative ;
    margin: 0 ;
    box-sizing: border-box ;
    display: block ;
    width: 100% ;
    height: 372px ;
    overflow: visible;
}
.gallery-section .gallery-main-wrapper {
    position: relative ;
    z-index: 1 ;
    max-width: none ;
    margin: 0 ;
    height: 100% ;
    display: flex ;
    align-items: center !important;
    justify-content: center !important;
}
.gallery-section .gallery-grid {
    padding-top: 15px;
    display: grid !important;
    grid-template-columns: 898px 381px ;
    gap: 12px ;
    grid-auto-rows: min-content ;
    justify-content: start ;
    height: 372px ;
}
.gallery-section .main-image {
    grid-row: span 2 ;
    position: relative ;
    overflow: hidden ;
    border-radius: 25px ;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.2) ;
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1) ;
    cursor: pointer ;
}
.gallery-section .side-image {
    position: relative ;
    overflow: hidden ;
    border-radius: 20px ;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15) ;
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1) ;
    cursor: pointer ;
}

.gallery-section .image-placeholder {
    width: 100% ;
    height: 100% ;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) ;
    display: flex ;
    flex-direction: column ;
    align-items: center ;
    justify-content: center ;
    color: white ;
    font-size: 1.2rem ;
    font-weight: 500 ;
    position: relative ;
    min-height: 300px ;
}
.gallery-section .main-image .image-placeholder {
    height: 372px ;
    min-height: 372px ;
}

.gallery-section .side-image .image-placeholder {
    height: 180px ;
    min-height: 180px ;
}

.gallery-section .main-image {
    height: 372px ;
}

.gallery-section .side-image {
    height: 180px ;
}

.gallery-section .image-container:hover {
   /* transform: translateY(-10px) scale(1.02) ;
    box-shadow: 0 35px 70px rgba(0, 0, 0, 0.25) ;*/
}
.gallery-section .uploaded-image {
    width: 100% ;
    height: 100% ;
    object-fit: cover ;
    object-position: center ;
    transition: transform 0.6s ease ;
    display: block ;
}

.gallery-section .image-container:hover .uploaded-image {
   /* transform: scale(1.1) ;*/
}
/* Slideshow Styles */
.gallery-section .slideshow-container {
    position: relative ;
    width: 100% ;
    height: 100% ;
    overflow: hidden ;
}

.gallery-section .slides-wrapper {
    position: relative ;
    width: 100% ;
    height: 100% ;
}

.gallery-section .slide {
    position: absolute ;
    top: 0 ;
    left: 0 ;
    width: 100% ;
    height: 100% ;
    opacity: 0 ;
    transform: translateX(100%) ;
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1) ;
}

.gallery-section .slide.active {
    opacity: 1 ;
    transform: translateX(0) ;
}

.gallery-section .slide.prev {
    transform: translateX(-100%) ;
}

.gallery-section .slideshow-controls {
    position: absolute ;
    top: 50% ;
    left: 0 ;
    right: 0 ;
    transform: translateY(-50%) ;
    display: flex ;
    justify-content: space-between ;
    padding: 0 20px ;
    opacity: 0 ;
    transition: opacity 0.3s ease ;
    z-index: 5 ;
}

.gallery-section .main-image:hover .slideshow-controls {
    opacity: 1 ;
}

.gallery-section .control-btn {
    width: 50px ;
    height: 50px ;
    background: rgba(255, 255, 255, 0.2) ;
    border: none ;
    border-radius: 50% ;
    color: white ;
    cursor: pointer ;
    transition: all 0.3s ease ;
    backdrop-filter: blur(10px) ;
    display: flex ;
    align-items: center ;
    justify-content: center ;
}

.gallery-section .control-btn:hover {
    background: rgba(255, 255, 255, 0.3) !important;
    transform: scale(1.1) !important;
}
/* Timer Display */
.gallery-section .gallery-timer-display {
    position: absolute ;
    top: 80% ;
    right: 90% ;
    background: rgba(0, 0, 0, 0.7) ;
    color: #ffa500 ;
    padding: 8px 16px ;
    border-radius: 20px ;
    font-size: 16px ;
    font-weight: 600 ;
    backdrop-filter: blur(10px) ;
    border: 2px solid rgba(255, 165, 0, 0.3) ;
    z-index: 4 ;
    min-width: 60px ;
    text-align: center ;
    box-shadow: 0 4px 15px rgba(255, 165, 0, 0.2) ;
}

.gallery-section .slide-indicators {
    position: absolute ;
    bottom: 20px ;
    left: 50% ;
    transform: translateX(-50%) ;
    display: flex ;
    gap: 10px ;
    z-index: 4 ;
}

.gallery-section .indicator {
    width: 12px ;
    height: 12px ;
    border-radius: 50% ;
    background: rgba(255, 255, 255, 0.4) ;
    cursor: pointer ;
    transition: all 0.3s ease ;
}

.gallery-section .indicator.active {
    background: white ;
    transform: scale(1.2) ;
}

.gallery-section .mobile-gallery {
    display: none ;
}

.gallery-section .mobile-slideshow {
    display: none ;
}
@media (min-width: 768px) {
	/*فاصله هتل های ایران*/
	.site-heading .text-right{
		padding-top: 30px !important;}}
	
@media (max-width: 768px) {
	/*فاصله هتل های ایران*/
	.site-heading .text-right{
	padding-top: 0px !important;}
	
    .gallery-section {
        height: 100%;
		margin-top: 105px;
    }
    
    .gallery-section .gallery-grid {
        grid-template-columns: 1fr ;
        gap: 15px ;
        max-width: 400px ;
        margin: 0 auto ;
        height: 100%;
		padding-top: 0px;
    }
    
    .gallery-section .gallery-main-wrapper {
        padding: 0 5px ;
        height: 100%;
    }
    
    .gallery-section .main-image {
        height: 100%;
		border-radius: 13px;
    }
    
    .gallery-section .mobile-slideshow {
        display: block ;
        order: 1 ;
        width: 340px ;
        height: 202px ;
        margin: 0 auto ;
        position: relative ;
        overflow: hidden ;
        
        box-shadow: 0 30px 60px rgba(0, 0, 0, 0.2) ;
        touch-action: pan-x ;
        user-select: none ;
        -webkit-user-select: none ;
        -webkit-touch-callout: none ;
    }
    
    .gallery-section .side-image {
        display: none ;
    }
    
    .gallery-section .main-image .image-placeholder {
        height: 372px ;
        min-height: 372px ;
    }
    
    .gallery-section .mobile-gallery {
        display: none;
        grid-template-columns: repeat(2, 1fr) ;
        gap: 12px ;
        margin-top: 20px ;
        order: 2 ;
    }
    
    .gallery-section .mobile-image {
        width: 100% ;
        height: 372px ;
        border-radius: 15px ;
        overflow: hidden ;
        box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15) ;
        transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1) ;
        cursor: pointer ;
        position: relative ;
    }
    
    .gallery-section .mobile-image .image-placeholder {
        height: 372px ;
        min-height: 372px ;
    }
    
    .gallery-section .mobile-slideshow .slideshow-controls {
        display: none !important;
    }
    
    .gallery-section .mobile-slideshow .slide-indicators {
        display: none !important;
    }
    
    .gallery-section .image-container:hover {
       /* transform: translateY(-5px) scale(1.01) ;*/
    }
}
/* استایل بخش شهر ها */
     :root {
    --mz-card-height: 210px; /* کاهش یافته از 372 */
    --mz-card-width: 310px;
    --mz-gap: 16px;
    --mz-orange: #ff8c00;
    --mz-radius: 14px;
    --mz-text: #1f2d55;
    font-family: "Vazirmatn", system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
  }
  *{box-sizing:border-box;}
  body {
    margin:0;
    /*padding:30px;*/
    background: #ffffff;
    direction: rtl;
    color: var(--mz-text);
  }
  .mz-wrapper {
    max-width: 1300px; /* تغییر به 1300 */
    margin:0 auto;
    position: relative;
  }
/* هدر اصلی */
.mz-header {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: nowrap; /* نذار خودش بیافته زیر هم */
  justify-content: space-between;
}

/* عنوان اجازه می‌ده کوتاه بشه ولی بره در دو خط اگر فضا نباشه بدون اینکه دکمه بیفته پایین */
.mz-header-title {
  margin: 0;
  font-size: 1.4rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1 1 0;
  min-width: 0; /* برای متن-برش‌خوردن داخل flex */
  white-space: normal;
   overflow: hidden;
  text-overflow: ellipsis;
}

/* لینک "همه شهرها" */
.mz-see-all {
  flex: none;
  white-space: nowrap;
}

/* موبایل کوچک: کمی تنظیم اندازه و فاصله */
@media (max-width: 768px) {
  .mz-header {
    flex-wrap: nowrap;
    gap: 8px;
  }
  .mz-header-title {
    font-size: 1.2rem;
  }
  .mz-see-all {
    padding: 8px 14px;
    font-size: .8rem;
  }
}

  .mz-see-all {
    background: var(--mz-orange);
    padding:10px 18px;
    border-radius:999px;
    color:#fff;
    font-weight:600;
    text-decoration:none;
    display:inline-flex;
    align-items:center;
    gap:6px;
    font-size:.9rem;
    box-shadow:0 14px 36px rgba(255,140,0,0.3);
    transition:filter .2s;
  }
  .mz-see-all:hover { filter:brightness(1.05); }

  .mz-carousel {
    position: relative;
    overflow:hidden;
    padding-bottom:4px;
  }
  .mz-track {
    display:flex;
    gap: var(--mz-gap);
    overflow-x:auto;
    scroll-behavior: smooth;
    padding:0 20px 5px 20px;
    -webkit-overflow-scrolling: touch;
  }
  .mz-track { scrollbar-width: none; }
  .mz-track::-webkit-scrollbar { display:none; }

  .mz-card {
    position: relative;
    flex:0 0 auto;
    width: var(--mz-card-width);
    height: var(--mz-card-height);
    border-radius: var(--mz-radius);
    overflow:hidden;
    background:#1f2433;
    cursor:pointer;
    transition: transform .25s ease, box-shadow .25s ease, border .25s;
    border:2px solid rgba(255,140,0,0);
    display:flex;
    flex-direction: column;
    justify-content: flex-end;
    min-width: var(--mz-card-width);
  }
  .mz-card:hover { transform: scale(1.03); box-shadow: 0 28px 64px -8px rgba(255,140,0,0.35); border-color: var(--mz-orange); }
  .mz-card img {
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    filter:brightness(1);
    transition: transform .35s ease;
    z-index:1;
  }
  .mz-card:hover img { transform: scale(1.08); }

  .mz-badge {
    position:absolute;
    top:12px;
    left:12px;
    background: rgba(255,140,0,0.95);
    padding:6px 14px;
    border-radius:8px;
    font-size:0.65rem;
    font-weight:700;
    color:#fff;
    display:inline-flex;
    gap:4px;
    backdrop-filter: blur(4px);
    z-index:4;
  }

  .mz-overlay {
    position:absolute;
    inset:0;
    background: linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,0.7) 100%);
    pointer-events:none;
    z-index:2;
  }
  .mz-info-box {
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    padding:10px 14px;
    display:flex;
    flex-direction: column;
    gap:4px;
    z-index:5;
  }
  .mz-title {
    margin:0;
    font-size:0.95rem;
    font-weight:700;
    color:#fff;
    white-space: nowrap;
    overflow:hidden;
    text-overflow: ellipsis;
  }
  .mz-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
    flex-wrap: nowrap;
    font-size:.7rem;
    color:#e5e5e5;
  }
  .mz-views {
    background: rgba(255,255,255,0.08);
    padding:4px 10px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    gap:4px;
    font-weight:500;
    font-size:.6rem;
	color : white;
  }

  .mz-btn-primary {
    position: relative;
    background: rgba(255,255,255,0.08);
    padding:6px 14px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,0.2);
    color:#fff;
    font-weight:600;
    font-size:.7rem;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:6px;
    transition: transform .2s, box-shadow .2s, backdrop-filter .2s;
    backdrop-filter: blur(6px);
    flex-shrink:0;
    z-index:6;
  }
  .mz-btn-primary:before {
    content:'';
    position:absolute;
    inset:0;
    background: linear-gradient(135deg,var(--mz-orange) 0%, rgba(255,140,0,0.4) 70%);
    mix-blend-mode: overlay;
    border-radius:999px;
    opacity:0.4;
    transition:opacity .2s;
  }
  .mz-btn-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 40px rgba(255,140,0,0.45);
  }

  .mz-detail {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.65);
    opacity: 0;
    transition: opacity .25s ease;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding:12px;
    z-index:7;
    pointer-events: none;
    border-radius: var(--mz-radius);
  }
  .mz-card:hover .mz-detail { opacity:1; pointer-events:auto; }
  .mz-detail.show-detail { opacity:1; pointer-events:auto; }

  .mz-features {
    display:flex;
    flex-wrap:wrap;
    gap:5px;
    margin-top:4px;
  }
  .mz-feature-pill {
    background: rgba(255,255,255,0.12);
    padding:5px 10px;
    border-radius:999px;
    font-size:.55rem;
    display:inline-block;
    color:#fff;
    position: relative;
    cursor:pointer;
    text-decoration:none;
    transition: transform .2s, background .2s;
  }
  .mz-feature-pill:hover { transform: translateY(-1px); background: rgba(255,255,255,0.18); }

  .mz-detail .mz-bottom {
    display:flex;
    justify-content: space-between;
    align-items:center;
    gap:6px;
    flex-wrap: wrap;
  }
  .mz-link-secondary {
    background:#fff;
    padding:7px 12px;
    border-radius:8px;
    font-size:.6rem;
    font-weight:600;
    color: var(--mz-orange);
    text-decoration:none;
    display:inline-flex;
    align-items:center;
    gap:6px;
    flex: none;
    box-shadow: 0 6px 20px rgba(31,45,85,0.15);
    transition: transform .2s;
  }
  .mz-link-secondary:hover { transform: translateY(-1px); }

  .mz-nav-btn {
    position: absolute;
    top:50%;
    transform: translateY(-50%);
    width:48px;
    height:48px;
    border-radius:50%;
    border:none;
    background: rgba(255,255,255,0.9);
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    box-shadow:0 22px 60px rgba(31,45,85,0.2);
    transition: transform .2s, box-shadow .2s;
    z-index:10;
  }
  .mz-nav-btn svg {
    width:18px;
    height:18px;
    stroke: var(--mz-orange);
    stroke-width:2;
    fill:none;
  }
  .mz-nav-btn:hover { transform: scale(1.07); box-shadow:0 26px 72px rgba(31,45,85,0.25); }
  .mz-nav-prev { left:4px; }
  .mz-nav-next { right:4px; }

  @media (max-width: 1024px){
    :root { --mz-card-width: 220px; }
  }
  @media (max-width: 768px){
    :root { --mz-card-width: 175px; --mz-card-height: 190px;}
    .mz-header { flex-direction: column; align-items:flex-start; }
    .mz-title { font-size:.9rem; }
  }
	
		@media (min-width: 992px) {
  #hero-img {
    width: 100% !important;     /* عرض کامل */
    height: auto !important;    /* ارتفاع متناسب */
    object-fit: contain !important;  /* بدون زوم و کشیدگی */
    margin-bottom: 50px !important;  /* فاصله از پایین */
  }
}
@media (max-width: 768px) {
  #hero-img {
    content: url("images/hm3.jpg");
  }
}
@media (max-width: 980px) {
		.navbar{
		display:none ;}
    .search-area .container {
        max-width: 95%;
		
		}
		.home-2 .hero-single {
         margin-top:0px!important;
		
    }
	}
    .mobile-search { display: none; }
    @media (max-width: 991px) {
        .desktop-search { display: none !important; }
        .mobile-search { display:block; /*width: 100%; margin: 12px auto; */}
    }

    .mobile-search .search-box {
        background:#fff;border-radius:12px;box-shadow:0 3px 10px rgba(0,0,0,0.15);overflow:hidden;
    }
    .mobile-search .search-item {
        display:flex;align-items:center;justify-content:space-between;padding:5px 16px;border-bottom:1px solid #ccc;
    }
    .mobile-search .search-item:last-child { border-bottom:none; }
    .mobile-search .search-label { color:#000;margin-left:10px;white-space:nowrap;font-size:15px; }
    /* استفاده از همان کلاس شما برای سرچ-input */
    .mobile-search .search-input { flex:1;border:none;outline:none;font-size:15px;background:transparent;text-align:right;padding-right:8px; }
    /* دکمه تاریخ — شبیه به input */
    .date-btn { background: #fafafa; border-radius:6px; /*padding:10px 12px;*/ color:#ccc; cursor:pointer; text-align:right; }
    .mobile-search .icon-btn { font-size:18px;color:#ff7a00 !important;cursor:pointer;margin-right:0px; }
    .mobile-search .search-btn { display:block;width:100%;padding:5px;text-align:center;background:#ff7a00;color:#fff;border:none;border-radius:0 0 12px 12px;font-weight:bold;font-size:20px; margin-top:0px; }
	
		.mobile-search { display: none; } /* نسخه موبایل */ @media(max-width: 991px) { .search-header{ display: none; }
	#desktop-search { 
		display: none; } /* نسخه لپ‌تاپ مخفی */
	.mobile-search { 
		display: block; /*width: 90%; margin: 20px auto;*/ }
	.search-item { 
		display: flex; align-items: center; justify-content: space-between; padding: 10px; border-bottom: 1px solid #ccc; } 
	.search-input {
		flex: 1; padding-right: 8px; font-size: 14px; border: none; outline: none; background: transparent; } 
	.search-btn { 
		width: 100%; padding: 12px; background: #ff7a00; color: #fff; border: none; border-radius: 8px; font-weight: bold; margin-top:10px; } .search-wrapper .search-box {
			padding: 0px !important; width: 100% !important; margin: 0px!important; } } 
						/* نسخه لپ‌تاپ */ @media(min-width: 992px)
						{ #desktop-search { display: block; } } 
/* پیش‌فرض مخفی */
.city-slider {
  display: none;
}

/* فقط برای موبایل */
@media (max-width: 768px) {
  .city-slider {
    display: block;
    width: 100%;
    padding: 5% 5% 1% 5%;
  }

  .swiper-slide {
    text-align: center;
  }

  .city-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none; /* لینک بدون خط */
  }

  .city-item img {
  width: 100%;
  aspect-ratio: 1 / 1;   /* همیشه مربع */
  border-radius: 20px;
  object-fit: cover;
  box-shadow: 0 4px 6px rgba(0,0,0,0.2);
  transition: transform 0.3s;
}


  .city-item img:hover {
    transform: scale(1.05);
  }

  .city-item span {
    margin-top: 8px;
    font-size: 14px;
    font-weight: bold;
    color: #333;
  }
}
 .MD_H1 {
    position: relative; /* برای کنترل بچه‌ها */
    direction: rtl;
  }

  /* نسخه دسکتاپ */
  .MD_H1-desktop {
    display: block;
    position: absolute;
    top: 100%;   /* دقیقا زیر خط سفید */
    left: 0;     /* سمت چپ */
   transform: translateY(-120px);
    color: #222;
    padding: 10px 20px;
    max-width: 500px;
    text-align: left;
	  margin-left: 80px;
	  pointer-events: none;
  }
  .MD_H1-desktop h1 {
    font-size: 3.0rem;
    margin: 10PX 0 8px;
    font-weight: bold;
    color: WHITE; /* نارنجی مثل هدر */
  }
  .MD_H1-desktop span {
    font-size: 1rem;
    line-height: 1.6;
    display: block;
    color: #444;
  }

  /* نسخه موبایل */
  .MD_H1-mobile {
    display: none;
    position: absolute;
    top: 100%;
    left: 1;
    transform: translateY(-218px);
    color: #222;
    padding: 18px 15px;
    max-width: 90%;
    text-align: left;
  }
  .MD_H1-mobile h1 {
    font-size: 0.7rem;
    margin: 0 0 6px;
    font-weight: bold;
    color: #f97a00;
	  pointer-events: none;
  }
  .MD_H1-mobile span {
    font-size: 0.9rem;
    line-height: 1.5;
    display: block;
    color: #444;
  }

  /* ریسپانسیو */
  @media (max-width: 768px) {
    .MD_H1-desktop {
      display: none;
    }
    .MD_H1-mobile {
      display: block;
    }
  }
.xaiCardCluster {
            display: flex;
            gap: 20px;
            flex-wrap: wrap;
            justify-content: center;
            max-width: 1280px;
			margin-top: 30px;
            margin-bottom: 5px;
            margin-right: 20px;
        }

        .xaiCardNode {
            position: relative;
            width: 300px;
            height: 120px;
            border-radius: 14px;
            z-index: 1111;
            overflow: hidden;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            box-shadow: -1px 1px 9px 0px #bebebe, -20px -20px 60px #ffffff;
        }

        .xaiCardBackdrop {
            position: absolute;
            top: 5px;
            left: 5px;
            width: 290px;
            height: 110px;
            z-index: 2;
            background: rgba(255, 255, 255, .95);
            backdrop-filter: blur(24px);
            border-radius: 10px;
            overflow: hidden;
            outline: 2px solid white;
        }

        .xaiCardOrb {
            position: absolute;
            z-index: 1;
            top: 50%;
            left: 50%;
            width: 80px;
            height: 80px;
            border-radius: 50%;
            background-color: #f97a00;
            opacity: 0;
            filter: blur(10px);
            transition: opacity 0.3s ease;
        }

        .xaiCardNode:hover .xaiCardOrb {
            opacity: 1;
            animation: xaiOrbPulse 3s infinite linear;
        }

        @keyframes xaiOrbPulse {
            0% {
                transform: translate(-50%, -50%) translate3d(-145px, -55px, 0);
            }
            25% {
                transform: translate(-50%, -50%) translate3d(145px, -55px, 0);
            }
            50% {
                transform: translate(-50%, -50%) translate3d(145px, 55px, 0);
            }
            75% {
                transform: translate(-50%, -50%) translate3d(-145px, 55px, 0);
            }
            100% {
                transform: translate(-50%, -50%) translate3d(-145px, -55px, 0);
            }
        }

        .xaiCardContent {
            display: flex;
            width: 290px;
            height: 110px;
            align-items: center;
            z-index: 3;
            flex-direction: row;
        }

        .xaiCardTextBlock {
            width: 75%;
            padding: 0 10px;
            color: #000;
            font-size: 12px;
            text-align: right;
        }

        .xaiCardTextBlock h3 {
            margin: 0 0 -2px;
            font-size: 17px;
            color: #000;
			pointer-events: none;
        }

        .xaiCardTextBlock p {
            margin: 0;
            font-size: 14px;
            line-height: 1.3;
            color: #000;
			pointer-events: none;
        }

        .xaiCardIconFrame {
            width: 25%;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .xaiCardIconFrame img {
            width: 60px;
            height: 60px;
            object-fit: cover;
            border-radius: 5px;
        }

        @media (max-width: 768px) {
            .xaiCardCluster {
                display: grid;
                grid-template-columns: repeat(2, 1fr);
                gap: 20px;
                justify-items: center;
				margin-right: 0px;
            }

            .xaiCardNode {
                width: 100%;
                max-width: 300px;
                height: 120px;
            }

            .xaiCardBackdrop {
                width: calc(100% - 10px);
                height: 110px;
            }

            .xaiCardContent {
                width: calc(100% - 10px);
                height: 110px;
            }

            .xaiCardOrb {
                width: 70px;
                height: 70px;
            }

            .xaiCardNode:hover .xaiCardOrb {
                animation: xaiOrbPulseMobile 3s infinite linear;
            }

            @keyframes xaiOrbPulseMobile {
                0% {
                    transform: translate(-50%, -50%) translate3d(calc(-100% + 5px), calc(-100% + 5px), 0);
                }
                25% {
                    transform: translate(-50%, -50%) translate3d(calc(100% - 5px), calc(-100% + 5px), 0);
                }
                50% {
                    transform: translate(-50%, -50%) translate3d(calc(100% - 5px), calc(100% - 5px), 0);
                }
                75% {
                    transform: translate(-50%, -50%) translate3d(calc(-100% + 5px), calc(100% - 5px), 0);
                }
                100% {
                    transform: translate(-50%, -50%) translate3d(calc(-100% + 5px), calc(-100% + 5px), 0);
                }
            }
        }

        @media (max-width: 480px) {
            .xaiCardNode {
                width: 100%;
                max-width: 250px;
                height: 85px;
            }

            .xaiCardBackdrop {
                width: calc(100% - 10px);
                height: 75px;
            }

            .xaiCardContent {
                width: calc(100% - 10px);
                height: 55px;
            }

            .xaiCardTextBlock {
                font-size: 11px;
				padding:0 3px
            }

            .xaiCardTextBlock h3 {
                font-size: 2.75vw;
				line-height: normal;
				margin: 0 0 3px;
            }

            .xaiCardTextBlock p {
                font-size: 9px;
            }

            .xaiCardIconFrame img {
                width: 45px;
                height: 35px;
            }

            .xaiCardOrb {
                width: 65px;
                height: 50px;
            }
        }
.content-section {
      width: 100%;
      max-width: 76.5rem;
      margin: 0 auto;
      color: #111;
    }

    .content-section a {
      display: inline-block;
      text-decoration: none;
    }

    .content-section .content-container {
      margin-top: 0px;
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      grid-template-rows: repeat(2, auto);
      gap: 2rem;
      padding: 0 1rem;
	  margin-left: 0px;
    }


    .content-section .content-container .content-item {
      display: flex;
      align-items: stretch;
      gap: 1rem;
    }

    .content-section .content-container .content-item .content-inner {
      position: relative;
      width: 60%;
      height: 12rem;
      background: #fff;
      border-radius: 1.25rem;
      border-bottom-left-radius: 0;
      overflow: hidden;
      order: 2;
      will-change: transform;
      backface-visibility: hidden;
    }

    .content-section .content-container .content-item .content-inner .box {
      width: 100%;
      height: 100%;
      background: #fff;
      border-radius: 1.25rem;
      overflow: hidden;
    }

    .content-section .content-container .content-item .content-inner .box .imgBox {
      position: absolute;
      inset: 0;
    }
			   .content-section .content-container .content-item .content-inner .box .imgBox a {
  display: block;
  width: 100%;
  height: 100%;
}

    .content-section .content-container .content-item .content-inner .box .imgBox img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      backface-visibility: hidden;
    }

    .content-section .content-container .content-item .content-inner .box .icon {
      position: absolute;
      bottom: -0.375rem;
      left: -0.375rem;
      width: 4rem;
      height: 4rem;
      background: #fff;
      border-top-right-radius: 50%;
      overflow: visible;
    }

    .content-section .content-container .content-item .content-inner .box .icon:hover .iconBox {
      transform: scale(1.1);
    }

    .content-section .content-container .content-item .content-inner .box .icon::before {
      position: absolute;
      content: "";
      bottom: 0.375rem;
      right: -1.25rem;
      background: transparent;
      width: 1.25rem;
      height: 1.25rem;
      border-bottom-left-radius: 1.25rem;
      box-shadow: -0.313rem 0.313rem 0 0.313rem #fff;
      z-index: 1;
    }

    .content-section .content-container .content-item .content-inner .box .icon::after {
      position: absolute;
      content: "";
      top: -1.25rem;
      left: 0.375rem;
      background: transparent;
      width: 1.25rem;
      height: 1.25rem;
      border-bottom-left-radius: 1.25rem;
      box-shadow: -0.313rem 0.313rem 0 0.313rem #fff;
      z-index: 1;
    }

    .content-section .content-container .content-item .content-inner .box .icon .iconBox {
      position: absolute;
      inset: 0.625rem;
      background: #f97a00;
      border-radius: 50%;
      display: flex;
      justify-content: center;
      align-items: center;
      transition: transform 0.3s;
      z-index: 2;
    }

    .content-section .content-container .content-item .content-inner .box .icon .iconBox span {
      color: #fff;
      font-size: 1rem;
    }

    .content-section .content-container .content-item .content-details {
      width: 60%;
      padding: 0.938rem 0.625rem;
      text-align: right;
      display: flex;
      flex-direction: column;
      justify-content: center;
      order: 1;
    }

    .content-section .content-container .content-item .content-details h3 {
      text-transform: capitalize;
    }

    .content-section .content-container .content-item .content-details p {
      margin: 0.625rem 0 1.25rem;
      color: #565656;
	  text-align: justify;
    }

    .content-section .content-container .content-item .content-details ul {
      margin: 0;
      padding: 0;
      list-style-type: none;
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 0.625rem;
      justify-content: flex-end;
      width: 100%;
    }

    .content-section .content-container .content-item .content-details ul a {
      text-transform: uppercase;
      background: var(--clr-tag);
      color: #f97a00;
      font-weight: 700;
      font-size: 0.8rem;
      padding: 0.375rem 0.625rem;
      border-radius: 0.188rem;
      margin-left: auto;
    }

    .dots {
      display: none;
      justify-content: center;
      gap: 0.5rem;
      margin-top: 1rem;
      padding: 0 1rem;
    }

    .dot {
      width: 12px;
      height: 12px;
      background: #ccc;
      border-radius: 50%;
      cursor: pointer;
      transition: background 0.3s, transform 0.3s;
    }

    .dot.active {
      background: #333;
      transform: scale(1.3);
    }

    @media (max-width: 768px) {
      .content-section {
        padding: 1rem 0;
        width: 100%;
      }

      .content-section .content-container {
        display: flex;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        gap: 1rem;
        padding: 0;
        margin: 0;
        scroll-behavior: smooth;
        width: 100%;
      }

      .content-section .content-container .content-item {
        flex: 0 0 calc(100% - 2rem);
        scroll-snap-align: center;
        min-width: calc(100% - 2rem);
        flex-direction: column;
        padding: 0 1rem;
        margin-right: 15px;
        margin-left: 15px;
      }

      .content-section .content-container .content-item .content-inner {
        width: 100%;
        height: 12rem;
        order: 1;
      }

      .content-section .content-container .content-item .content-details {
        width: 100%;
        order: 2;
      }

      .content-section .content-container::-webkit-scrollbar {
        display: none;
      }

      .content-section .content-container {
        -ms-overflow-style: none;
        scrollbar-width: none;
      }

      .dots {
        display: flex;
      }
    }
@media (min-width: 980px) {
    .city-slider {
        display: none !important;
	}}
