/* =========================================================
   TOCHAL FIRE | ASAREH UI POLISH V1
   Scope: Shared visual fixes for current static HTML release

   هدف این فایل:
   - یکسان‌سازی ارتفاع هدر صفحات داخلی بر اساس صفحه محصولات
   - افزایش ارتفاع هدرها حدود ۱.۵ برابر نسبت به نسخه فشرده قبلی
   - اصلاح صفحات دارای هدر 430px ثابت، بدون دست‌کاری محتوای سالم
   - هماهنگ‌سازی Waiting جدید آساره در صفحات داخلی
   - آماده‌سازی استایل صفحه جزئیات بلاگ
   ========================================================= */

:root {
  --asareh-tochal-page-x: 5%;
  --asareh-tochal-hero-height: clamp(700px, 63vh, 720px);
  --asareh-tochal-hero-height-tablet: clamp(500px, 60vh, 620px);
  --asareh-tochal-hero-height-mobile: clamp(430px, 58vh, 520px);
  --asareh-tochal-ink: #18130f;
  --asareh-tochal-muted: rgba(24, 19, 15, .68);
  --asareh-tochal-gold: #d9a842;
  --asareh-tochal-soft-border: rgba(24, 19, 15, .10);
  --asareh-tochal-glass: rgba(255, 255, 255, .62);
}

/* =========================
   Shared Inner Header Height
   ========================= */

html body[class] > .asareh-inner-hero.inner-hero-header.inner-hero-tochal {
  position: relative !important;
  min-height: var(--asareh-tochal-hero-height) !important;
  height: var(--asareh-tochal-hero-height) !important;
  max-height: none !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

html body[class] > .asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-hero-bg {
  height: 100% !important;
  background-size: cover !important;
  background-position: center center !important;
}

html body[class] > .asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-hero-overlay {
  background:
    linear-gradient(to bottom, rgba(0, 0, 0, .68), rgba(0, 0, 0, .26) 42%, rgba(0, 0, 0, .86)),
    linear-gradient(to left, rgba(0, 0, 0, .10), rgba(0, 0, 0, .62)) !important;
}

html body[class] > .asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-top-nav,
html body[class] .inner-page .container,
html body[class] .kd-footer-shell,
html body[class] .kd-footer .container {
  width: 90% !important;
  max-width: none !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

html body[class] > .asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-top-nav {
  padding-top: 20px !important;
  padding-bottom: 16px !important;
  border-top-width: 1px !important;
  border-top-color: rgba(255, 255, 255, .82) !important;
}

html body[class] > .asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-menu {
  gap: clamp(14px, 1.65vw, 24px) !important;
}

html body[class] > .asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-menu a {
  font-size: 12px !important;
  line-height: 1.8 !important;
}

html body[class] > .asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-hero-content {
  position: absolute !important;
  right: var(--asareh-tochal-page-x) !important;
  left: auto !important;
  top: auto !important;
  bottom: var(--asareh-tochal-page-x) !important;
  z-index: 6 !important;

  width: min(780px, 90vw) !important;
  max-width: 780px !important;
  min-height: 0 !important;
  height: auto !important;

  display: block !important;

  margin: 0 !important;
  padding: 0 !important;

  direction: rtl !important;
  text-align: right !important;

  justify-content: flex-start !important;
  align-items: flex-start !important;
  transform: none !important;
  pointer-events: none !important;
}

html body[class] > .asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-hero-content h1 {
  max-width: 780px !important;
  margin: 0 0 12px !important;
  padding: 0 !important;

  color: #ffffff !important;

  font-size: clamp(34px, 4.4vw, 62px) !important;
  line-height: 1.38 !important;
  font-weight: 950 !important;
  letter-spacing: -0.035em !important;

  text-align: right !important;
  direction: rtl !important;
  text-shadow: 0 12px 34px rgba(0, 0, 0, .52) !important;
}

html body[class] > .asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-hero-content p {
  max-width: 720px !important;
  margin: 0 !important;
  padding: 0 !important;

  color: rgba(255, 255, 255, .90) !important;

  font-size: 14px !important;
  line-height: 2.15 !important;
  font-weight: 650 !important;

  text-align: right !important;
  direction: rtl !important;
  text-shadow: 0 8px 26px rgba(0, 0, 0, .48) !important;
}

/* =========================
   Shared Page Breathing
   ========================= */

html body[class] .inner-hero-header + main,
html body[class] .inner-hero-header + .asareh-tochal-page {
  margin-top: 0 !important;
}

html body[class] .asareh-tochal-page,
html body[class] .inner-page {
  background: #ffffff !important;
}

html body[class] .asareh-tochal-page section:not(.page-bottom-video),
html body[class] .inner-page section:not(.page-bottom-video) {
  scroll-margin-top: 96px !important;
}

/* =========================
   Waiting Compatibility
   ========================= */

html body.asareh-blog-page .kd-preloader,
html body.asareh-blog-detail-page .kd-preloader,
html body.asareh-bale-page .kd-preloader {
  display: none !important;
}

/* =========================
   Blog Archive & Detail
   ========================= */

.asareh-blog-page,
.asareh-blog-detail-page,
.asareh-bale-page {
  background: #ffffff !important;
  color: var(--asareh-tochal-ink) !important;
  overflow-x: hidden !important;
}

.asareh-blog-page *,
.asareh-blog-detail-page *,
.asareh-bale-page * {
  box-sizing: border-box !important;
}

.asareh-blog-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 22px !important;
}

.asareh-blog-card {
  display: flex !important;
  flex-direction: column !important;
  min-height: 100% !important;
  overflow: hidden !important;
  border-radius: 30px !important;
  background: rgba(255, 255, 255, .72) !important;
  border: 1px solid rgba(24, 19, 15, .09) !important;
  box-shadow: 0 20px 58px rgba(24, 19, 15, .07) !important;
}

.asareh-blog-image {
  display: block !important;
  width: 100% !important;
  height: clamp(220px, 17vw, 300px) !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: rgba(24, 19, 15, .06) !important;
}

.asareh-blog-image img {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
  object-position: center center !important;
}

.asareh-blog-card small,
.asareh-blog-card h3,
.asareh-blog-card p,
.asareh-blog-card a {
  margin-right: 20px !important;
  margin-left: 20px !important;
}

.asareh-blog-card small {
  margin-top: 20px !important;
  color: var(--asareh-tochal-gold) !important;
  font-size: 11px !important;
  font-weight: 900 !important;
}

.asareh-blog-card h3 {
  margin-top: 8px !important;
  margin-bottom: 8px !important;
  font-size: 17px !important;
  line-height: 1.8 !important;
  font-weight: 950 !important;
}

.asareh-blog-card p {
  margin-top: 0 !important;
  margin-bottom: 18px !important;
  color: var(--asareh-tochal-muted) !important;
  font-size: 13px !important;
  line-height: 2.05 !important;
}

.asareh-blog-card a,
.asareh-blog-detail-back,
.asareh-bale-action {
  width: fit-content !important;
  min-height: 46px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-top: auto !important;
  margin-bottom: 20px !important;
  padding: 0 24px !important;
  border-radius: 999px !important;
  text-decoration: none !important;
  color: #1f170c !important;
  background: rgba(255, 255, 255, .58) !important;
  background-image: linear-gradient(135deg, rgba(255,255,255,.90), rgba(255,255,255,.38)) !important;
  border: 1px solid rgba(217, 168, 66, .28) !important;
  box-shadow: 0 18px 42px rgba(24, 19, 15, .08), inset 0 1px 0 rgba(255,255,255,.70) !important;
  backdrop-filter: blur(14px) saturate(130%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(130%) !important;
  font-size: 12.5px !important;
  font-weight: 950 !important;
}

.asareh-blog-detail-shell,
.asareh-bale-shell {
  width: 90% !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 76px 0 92px !important;
}

.asareh-blog-detail-intro,
.asareh-bale-card {
  display: grid !important;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr) !important;
  gap: 34px !important;
  align-items: center !important;
  padding: clamp(22px, 3vw, 42px) !important;
  border-radius: 38px !important;
  background: rgba(255, 255, 255, .74) !important;
  border: 1px solid var(--asareh-tochal-soft-border) !important;
  box-shadow: 0 28px 80px rgba(24, 19, 15, .08) !important;
}

.asareh-blog-detail-cover,
.asareh-bale-visual {
  width: 100% !important;
  min-height: clamp(320px, 30vw, 520px) !important;
  margin: 0 !important;
  border-radius: 32px !important;
  overflow: hidden !important;
  background: rgba(24, 19, 15, .06) !important;
}

.asareh-blog-detail-cover img,
.asareh-bale-visual img {
  width: 100% !important;
  height: 100% !important;
  min-height: inherit !important;
  display: block !important;
  object-fit: cover !important;
  object-position: center center !important;
}

.asareh-blog-detail-copy h2,
.asareh-bale-copy h2 {
  margin: 0 0 14px !important;
  color: var(--asareh-tochal-ink) !important;
  font-size: clamp(28px, 3.2vw, 48px) !important;
  line-height: 1.55 !important;
  font-weight: 950 !important;
  letter-spacing: -0.035em !important;
}

.asareh-blog-detail-copy p,
.asareh-bale-copy p {
  margin: 0 0 14px !important;
  color: var(--asareh-tochal-muted) !important;
  font-size: 14px !important;
  line-height: 2.25 !important;
  font-weight: 600 !important;
  text-align: justify !important;
}

.asareh-blog-detail-list {
  display: grid !important;
  gap: 28px !important;
  margin-top: 34px !important;
}

.asareh-blog-detail-article {
  display: grid !important;
  grid-template-columns: minmax(260px, .42fr) minmax(0, .58fr) !important;
  gap: 28px !important;
  align-items: stretch !important;
  padding: clamp(20px, 2.5vw, 34px) !important;
  border-radius: 34px !important;
  border: 1px solid var(--asareh-tochal-soft-border) !important;
  background: rgba(255, 255, 255, .78) !important;
  box-shadow: 0 22px 62px rgba(24, 19, 15, .065) !important;
}

.asareh-blog-detail-article figure {
  margin: 0 !important;
  min-height: 310px !important;
  border-radius: 28px !important;
  overflow: hidden !important;
  background: rgba(24, 19, 15, .06) !important;
}

.asareh-blog-detail-article figure img {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
  object-position: center center !important;
}

.asareh-blog-detail-article-content small {
  display: block !important;
  margin-bottom: 8px !important;
  color: var(--asareh-tochal-gold) !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  letter-spacing: .12em !important;
}

.asareh-blog-detail-article-content h3 {
  margin: 0 0 10px !important;
  color: var(--asareh-tochal-ink) !important;
  font-size: clamp(22px, 2.2vw, 34px) !important;
  line-height: 1.55 !important;
  font-weight: 950 !important;
}

.asareh-blog-detail-article-content p,
.asareh-blog-detail-article-content li {
  color: var(--asareh-tochal-muted) !important;
  font-size: 13.5px !important;
  line-height: 2.2 !important;
  font-weight: 600 !important;
  text-align: justify !important;
}

.asareh-blog-detail-article-content ul {
  margin: 14px 0 0 !important;
  padding-right: 20px !important;
}

@media (max-width: 980px) {
  html body[class] > .asareh-inner-hero.inner-hero-header.inner-hero-tochal {
    min-height: var(--asareh-tochal-hero-height-tablet) !important;
    height: var(--asareh-tochal-hero-height-tablet) !important;
  }

  html body[class] > .asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-hero-content {
    right: var(--asareh-tochal-page-x) !important;
    bottom: var(--asareh-tochal-page-x) !important;
    width: min(780px, 90vw) !important;
    max-width: 780px !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
  }

  .asareh-blog-grid,
  .asareh-blog-detail-intro,
  .asareh-blog-detail-article,
  .asareh-bale-card {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 640px) {
  html body[class] > .asareh-inner-hero.inner-hero-header.inner-hero-tochal {
    min-height: var(--asareh-tochal-hero-height-mobile) !important;
    height: var(--asareh-tochal-hero-height-mobile) !important;
  }

  html body[class] > .asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-top-nav,
  html body[class] > .asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-hero-content,
  html body[class] .inner-page .container,
  html body[class] .kd-footer-shell,
  html body[class] .kd-footer .container,
  .asareh-blog-detail-shell,
  .asareh-bale-shell {
    width: 90% !important;
  }

  html body[class] > .asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-hero-content h1 {
    font-size: clamp(28px, 8vw, 38px) !important;
    line-height: 1.5 !important;
  }

  html body[class] > .asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-hero-content p {
    font-size: 12.5px !important;
    line-height: 2 !important;
  }

  .asareh-blog-grid {
    grid-template-columns: 1fr !important;
  }

  .asareh-blog-detail-intro,
  .asareh-blog-detail-article,
  .asareh-bale-card {
    padding: 18px !important;
    border-radius: 28px !important;
  }
}

/* =========================================================
   TOCHAL FIRE | INNER PAGES MENU CENTER & SIZE FIX
   Scope: همه صفحات داخلی دارای inner-top-nav

   هدف:
   - وسط‌چین شدن منوی افقی بالای هدر
   - بزرگ‌تر شدن فونت منو حدود یک‌سوم
   - ثابت ماندن دکمه سه‌خطی سمت راست
   - عدم دخالت در سایدپنل، فوتر و محتوای صفحات
   ========================================================= */

@media (min-width: 769px) {
  html body[class]>.asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-top-nav {
    position: absolute !important;
    top: 0 !important;
    right: 5% !important;
    left: 5% !important;
    z-index: 80 !important;

    width: auto !important;
    max-width: none !important;
    height: 96px !important;

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

    margin: 0 !important;
    padding: 0 !important;

    border-top: 1px solid rgba(255, 255, 255, .50) !important;
    pointer-events: auto !important;
  }

  html body[class]>.asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-menu {
    width: auto !important;
    max-width: none !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;

    gap: clamp(24px, 2.25vw, 38px) !important;

    margin: 0 auto !important;
    padding: 0 !important;

    text-align: center !important;
  }

  html body[class]>.asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-menu a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #ffffff !important;

    font-size: 16px !important;
    font-weight: 900 !important;
    line-height: 1.8 !important;
    text-align: center !important;
    text-decoration: none !important;

    white-space: nowrap !important;

    text-shadow: 0 5px 18px rgba(0, 0, 0, .64) !important;
    pointer-events: auto !important;
  }

  html body[class]>.asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-menu a.active,
  html body[class]>.asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-menu a:hover {
    color: var(--asareh-tochal-gold) !important;
  }

  html body[class]>.asareh-inner-hero.inner-hero-header.inner-hero-tochal .menu-trigger,
  html body[class]>.asareh-inner-hero.inner-hero-header.inner-hero-tochal .asareh-inner-menu-trigger {
    position: absolute !important;
    top: 34px !important;
    right: 0 !important;
    left: auto !important;
    z-index: 90 !important;

    width: 34px !important;
    height: 25px !important;

    margin: 0 !important;
    padding: 0 !important;

    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;

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

    cursor: pointer !important;
    pointer-events: auto !important;
  }

  html body[class]>.asareh-inner-hero.inner-hero-header.inner-hero-tochal .menu-trigger span,
  html body[class]>.asareh-inner-hero.inner-hero-header.inner-hero-tochal .asareh-inner-menu-trigger span {
    display: block !important;
    width: 100% !important;
    height: 2px !important;

    border-radius: 999px !important;
    background: #ffffff !important;

    box-shadow: 0 3px 12px rgba(0, 0, 0, .70) !important;
  }
}

@media (max-width: 768px) {
  html body[class]>.asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-top-nav {
    height: 82px !important;
  }

  html body[class]>.asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-menu {
    display: none !important;
  }
}
/* =========================================================
   TOCHAL FIRE | INNER HERO NATURAL IMAGE FIX
   Scope: فقط هدر صفحات داخلی

   هدف:
   - حذف کامل فیلتر تیره‌کننده از عکس هدر
   - حذف کامل Overlay / Gradient تیره روی هدر
   - نمایش طبیعی و واضح تصویر هدر
   - بدون تغییر در ارتفاع هدر، منو، عنوان، متن و فوتر
   ========================================================= */

html body[class]>.asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-hero-bg {
  opacity: 1 !important;
  visibility: visible !important;

  filter: none !important;
  -webkit-filter: none !important;

  transform: none !important;
  mix-blend-mode: normal !important;

  background-color: transparent !important;
}

html body[class]>.asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-hero-overlay {
  display: none !important;

  opacity: 0 !important;
  visibility: hidden !important;

  background: none !important;
  background-image: none !important;

  filter: none !important;
  -webkit-filter: none !important;

  mix-blend-mode: normal !important;
  pointer-events: none !important;
}

html body[class]>.asareh-inner-hero.inner-hero-header.inner-hero-tochal::before,
html body[class]>.asareh-inner-hero.inner-hero-header.inner-hero-tochal::after {
  display: none !important;

  opacity: 0 !important;
  visibility: hidden !important;

  background: none !important;
  background-image: none !important;

  filter: none !important;
  -webkit-filter: none !important;

  mix-blend-mode: normal !important;
  pointer-events: none !important;
}

/* حفظ خوانایی متن بدون تیره کردن کل عکس */
html body[class]>.asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-hero-content h1,
html body[class]>.asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-hero-content p,
html body[class]>.asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-menu a,
html body[class]>.asareh-inner-hero.inner-hero-header.inner-hero-tochal .inner-brand {
  text-shadow: 0 6px 22px rgba(0, 0, 0, .42) !important;
}
/* =========================================================
   TOCHAL FIRE | BOTTOM VISUAL CUSTOMER REFERENCE CLEAN FIX
   Scope: همه صفحات داخلی دارای page-bottom-video

   منطق درست:
   - مرجع: صفحه مشتریان
   - تصویر/ویدئو عرض کل صفحه را پر کند
   - هیچ سفیدی از چپ و راست تصویر ایجاد نشود
   - تصویر Crop نشود
   - ارتفاع از خود تصویر/ویدئو بیاید، نه از قاب اجباری
   - دکمه نصف اندازه نسخه بزرگ قبلی شود
   - فوتر دست نخورد
   ========================================================= */

:root {
  --asareh-tochal-bottom-x: 5%;
  --asareh-tochal-bottom-y: 5%;
  --asareh-tochal-bottom-button-width: clamp(130px, 11vw, 190px);
}

html,
body {
  overflow-x: clip !important;
}

html body[class] .page-bottom-video {
  position: relative !important;
  isolation: isolate !important;

  width: 100vw !important;
  max-width: 100vw !important;

  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;

  display: block !important;

  margin-top: 0 !important;
  margin-bottom: 0 !important;
  margin-right: calc(50% - 50vw) !important;
  margin-left: calc(50% - 50vw) !important;

  padding: 0 !important;

  overflow: hidden !important;
  background: transparent !important;
}

html body[class] .page-bottom-video img.page-bottom-video-media,
html body[class] .page-bottom-video video.page-bottom-video-media,
html body[class] .page-bottom-video .page-bottom-video-media {
  position: relative !important;
  inset: auto !important;
  z-index: 1 !important;

  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;

  display: block !important;

  margin: 0 !important;
  padding: 0 !important;

  object-fit: initial !important;
  object-position: center center !important;

  opacity: 1 !important;
  visibility: visible !important;

  filter: none !important;
  -webkit-filter: none !important;

  transform: none !important;
  background: transparent !important;
}

html body[class] .page-bottom-video .page-bottom-video-overlay {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;

  display: block !important;

  width: 100% !important;
  height: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  background: transparent !important;
  background-image: none !important;

  opacity: 1 !important;
  visibility: visible !important;

  pointer-events: none !important;
}

html body[class] .page-bottom-video .page-bottom-video-content {
  position: absolute !important;
  inset: 0 !important;
  z-index: 3 !important;

  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 0 !important;

  display: block !important;

  margin: 0 !important;
  padding: 0 !important;

  color: #ffffff !important;
  direction: rtl !important;
  text-align: right !important;

  transform: none !important;
  pointer-events: none !important;
}

html body[class] .page-bottom-video .page-bottom-video-content p {
  position: absolute !important;
  top: var(--asareh-tochal-bottom-y) !important;
  right: var(--asareh-tochal-bottom-x) !important;
  left: var(--asareh-tochal-bottom-x) !important;
  z-index: 4 !important;

  display: block !important;

  margin: 0 !important;
  padding: 0 !important;

  color: #ffffff !important;

  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1.7 !important;
  letter-spacing: .14em !important;

  text-align: right !important;
  direction: ltr !important;

  text-shadow: 0 8px 26px rgba(0, 0, 0, .72) !important;
  pointer-events: none !important;
}

html body[class] .page-bottom-video .page-bottom-video-content h2 {
  position: absolute !important;
  top: calc(var(--asareh-tochal-bottom-y) + 34px) !important;
  right: var(--asareh-tochal-bottom-x) !important;
  left: var(--asareh-tochal-bottom-x) !important;
  z-index: 4 !important;

  width: auto !important;
  max-width: none !important;

  display: block !important;

  margin: 0 !important;
  padding: 0 !important;

  color: #ffffff !important;

  font-size: clamp(22px, 2.35vw, 36px) !important;
  font-weight: 950 !important;
  line-height: 1.65 !important;
  letter-spacing: -0.03em !important;

  text-align: right !important;
  direction: rtl !important;

  text-shadow: 0 10px 32px rgba(0, 0, 0, .76) !important;
  pointer-events: none !important;
}

html body[class] .page-bottom-video .page-bottom-video-content a {
  position: absolute !important;
  left: var(--asareh-tochal-bottom-x) !important;
  right: auto !important;
  bottom: var(--asareh-tochal-bottom-y) !important;
  top: auto !important;
  z-index: 5 !important;

  width: var(--asareh-tochal-bottom-button-width) !important;
  min-width: 0 !important;
  max-width: 190px !important;
  min-height: 44px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  margin: 0 !important;
  padding: 0 18px !important;

  color: rgba(255, 255, 255, .98) !important;
  text-decoration: none !important;

  font-size: 12.5px !important;
  font-weight: 950 !important;
  line-height: 1 !important;

  border-radius: 999px !important;

  background: rgba(255, 255, 255, .16) !important;
  background-image:
    linear-gradient(135deg, rgba(255, 255, 255, .30), rgba(255, 255, 255, .10)) !important;

  border: 1px solid rgba(255, 255, 255, .40) !important;

  box-shadow:
    0 14px 34px rgba(0, 0, 0, .24),
    inset 0 1px 0 rgba(255, 255, 255, .46) !important;

  backdrop-filter: blur(16px) saturate(135%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(135%) !important;

  text-shadow: 0 4px 18px rgba(0, 0, 0, .36) !important;

  transform: none !important;
  pointer-events: auto !important;
}

html body[class] .page-bottom-video .page-bottom-video-content a:hover {
  transform: translateY(-2px) !important;

  border-color: rgba(217, 168, 66, .46) !important;

  box-shadow:
    0 20px 46px rgba(0, 0, 0, .30),
    inset 0 1px 0 rgba(255, 255, 255, .56) !important;
}

html body[class] .page-bottom-video+.kd-footer {
  margin-top: 0 !important;
}

@media (max-width: 768px) {
  :root {
    --asareh-tochal-bottom-button-width: min(46vw, 170px);
  }

  html body[class] .page-bottom-video .page-bottom-video-content h2 {
    top: calc(var(--asareh-tochal-bottom-y) + 28px) !important;

    font-size: clamp(20px, 5.4vw, 30px) !important;
    line-height: 1.75 !important;
  }

  html body[class] .page-bottom-video .page-bottom-video-content a {
    width: var(--asareh-tochal-bottom-button-width) !important;
    max-width: 170px !important;
    min-height: 42px !important;

    font-size: 12px !important;
    padding: 0 14px !important;
  }
}