/* =========================================================
   KiwiAI — Article Hero Attached UI/UX v4
   تصویر و باکس عنوان/تاریخ کاملاً چسبیده و زیبا
   ========================================================= */

#heroBox.kiwi-hero-attached{
  width:min(100%, 980px) !important;
  margin:18px auto 28px !important;
  border-radius:32px !important;
  overflow:hidden !important;
  background:#fff !important;
  border:1px solid rgba(18,88,51,.10) !important;
  box-shadow:0 18px 44px rgba(12,69,43,.12) !important;
  display:flex !important;
  flex-direction:column !important;
  position:relative !important;
}

#heroBox.kiwi-hero-attached .article-hero-img,
#heroBox.kiwi-hero-attached .article-hero-media,
#heroBox.kiwi-hero-attached .article-cover-wrap,
#heroBox.kiwi-hero-attached .hero-cover-wrap{
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  position:relative !important;
  overflow:hidden !important;
  background:#eef4ef !important;
  aspect-ratio:16 / 9 !important;
  min-height:420px !important;
  border-radius:0 !important;
}

#heroBox.kiwi-hero-attached img,
#heroBox.kiwi-hero-attached #articleImage{
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-width:100% !important;
  min-height:100% !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:center center !important;
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:#eef4ef !important;
}

#heroBox.kiwi-hero-attached .article-hero-info{
  width:100% !important;
  margin:0 !important;
  padding:24px 34px 26px !important;
  background:linear-gradient(180deg,#ffffff 0%, #f9fdf9 100%) !important;
  border-top:1px solid rgba(18,88,51,.10) !important;
  position:relative !important;
}

#heroBox.kiwi-hero-attached .article-hero-info::before{
  content:"" !important;
  position:absolute !important;
  top:0 !important;
  right:34px !important;
  width:94px !important;
  height:4px !important;
  border-radius:999px !important;
  background:linear-gradient(90deg,#2c8f58,#9de0b6) !important;
}

html[lang="en"] #heroBox.kiwi-hero-attached .article-hero-info::before,
body.kiwi-article-en #heroBox.kiwi-hero-attached .article-hero-info::before{
  right:auto !important;
  left:34px !important;
}

#heroBox.kiwi-hero-attached .article-hero-info .badge-category,
#heroBox.kiwi-hero-attached .article-hero-info #articleCategory,
#heroBox.kiwi-hero-attached .article-hero-info .article-category{
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
  padding:8px 14px !important;
  margin:0 0 12px !important;
  border-radius:999px !important;
  background:#eef9f1 !important;
  border:1px solid rgba(35,126,77,.14) !important;
  color:#17663b !important;
  font-size:.82rem !important;
  font-weight:800 !important;
  line-height:1.2 !important;
  text-decoration:none !important;
}

#heroBox.kiwi-hero-attached #articleTitle,
#heroBox.kiwi-hero-attached .article-title,
#heroBox.kiwi-hero-attached h1{
  margin:0 0 14px !important;
  padding:0 !important;
  color:#113a26 !important;
  font-size:clamp(1.7rem,3.0vw,3rem) !important;
  font-weight:900 !important;
  line-height:1.5 !important;
  text-align:right !important;
  letter-spacing:-.01em !important;
}

html[lang="en"] #heroBox.kiwi-hero-attached #articleTitle,
html[lang="en"] #heroBox.kiwi-hero-attached .article-title,
html[lang="en"] #heroBox.kiwi-hero-attached h1,
body.kiwi-article-en #heroBox.kiwi-hero-attached #articleTitle,
body.kiwi-article-en #heroBox.kiwi-hero-attached .article-title,
body.kiwi-article-en #heroBox.kiwi-hero-attached h1{
  text-align:left !important;
  line-height:1.4 !important;
}

#heroBox.kiwi-hero-attached .article-meta,
#heroBox.kiwi-hero-attached #articleMeta,
#heroBox.kiwi-hero-attached .post-meta{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:8px 16px !important;
  margin:0 !important;
  padding:0 !important;
  color:#6b7e72 !important;
  font-size:.92rem !important;
  font-weight:700 !important;
  line-height:1.8 !important;
  text-align:right !important;
}

#heroBox.kiwi-hero-attached .article-meta i,
#heroBox.kiwi-hero-attached #articleMeta i,
#heroBox.kiwi-hero-attached .post-meta i{
  color:#2f8f59 !important;
}

html[lang="en"] #heroBox.kiwi-hero-attached .article-meta,
html[lang="en"] #heroBox.kiwi-hero-attached #articleMeta,
html[lang="en"] #heroBox.kiwi-hero-attached .post-meta,
body.kiwi-article-en #heroBox.kiwi-hero-attached .article-meta,
body.kiwi-article-en #heroBox.kiwi-hero-attached #articleMeta,
body.kiwi-article-en #heroBox.kiwi-hero-attached .post-meta{
  text-align:left !important;
}

#heroBox.kiwi-hero-attached + *,
#heroBox.kiwi-hero-attached ~ #articleSummaryBox{
  margin-top:20px !important;
}

.kiwi-hide-after-hero-move{
  display:none !important;
}

@media (max-width:1199.98px){
  #heroBox.kiwi-hero-attached{
    width:min(100%, 940px) !important;
  }
}

@media (max-width:991.98px){
  #heroBox.kiwi-hero-attached{
    width:min(100%, 100%) !important;
    border-radius:26px !important;
    margin:12px auto 22px !important;
  }

  #heroBox.kiwi-hero-attached .article-hero-img,
  #heroBox.kiwi-hero-attached .article-hero-media,
  #heroBox.kiwi-hero-attached .article-cover-wrap,
  #heroBox.kiwi-hero-attached .hero-cover-wrap{
    min-height:360px !important;
  }

  #heroBox.kiwi-hero-attached .article-hero-info{
    padding:22px 24px 24px !important;
  }

  #heroBox.kiwi-hero-attached .article-hero-info::before{
    right:24px !important;
  }

  html[lang="en"] #heroBox.kiwi-hero-attached .article-hero-info::before,
  body.kiwi-article-en #heroBox.kiwi-hero-attached .article-hero-info::before{
    right:auto !important;
    left:24px !important;
  }
}

@media (max-width:767.98px){
  #heroBox.kiwi-hero-attached{
    border-radius:22px !important;
    margin:8px auto 18px !important;
    box-shadow:0 14px 32px rgba(12,69,43,.11) !important;
  }

  #heroBox.kiwi-hero-attached .article-hero-img,
  #heroBox.kiwi-hero-attached .article-hero-media,
  #heroBox.kiwi-hero-attached .article-cover-wrap,
  #heroBox.kiwi-hero-attached .hero-cover-wrap{
    aspect-ratio:16 / 10 !important;
    min-height:250px !important;
  }

  #heroBox.kiwi-hero-attached .article-hero-info{
    padding:18px 18px 20px !important;
  }

  #heroBox.kiwi-hero-attached .article-hero-info::before{
    right:18px !important;
    width:72px !important;
  }

  html[lang="en"] #heroBox.kiwi-hero-attached .article-hero-info::before,
  body.kiwi-article-en #heroBox.kiwi-hero-attached .article-hero-info::before{
    right:auto !important;
    left:18px !important;
  }

  #heroBox.kiwi-hero-attached #articleTitle,
  #heroBox.kiwi-hero-attached .article-title,
  #heroBox.kiwi-hero-attached h1{
    font-size:clamp(1.25rem,5.2vw,1.8rem) !important;
    line-height:1.7 !important;
    margin-bottom:10px !important;
  }

  html[lang="en"] #heroBox.kiwi-hero-attached #articleTitle,
  html[lang="en"] #heroBox.kiwi-hero-attached .article-title,
  html[lang="en"] #heroBox.kiwi-hero-attached h1,
  body.kiwi-article-en #heroBox.kiwi-hero-attached #articleTitle,
  body.kiwi-article-en #heroBox.kiwi-hero-attached .article-title,
  body.kiwi-article-en #heroBox.kiwi-hero-attached h1{
    line-height:1.45 !important;
  }

  #heroBox.kiwi-hero-attached .article-meta,
  #heroBox.kiwi-hero-attached #articleMeta,
  #heroBox.kiwi-hero-attached .post-meta{
    gap:6px 10px !important;
    font-size:.8rem !important;
  }

  #heroBox.kiwi-hero-attached .article-hero-info .badge-category,
  #heroBox.kiwi-hero-attached .article-hero-info #articleCategory,
  #heroBox.kiwi-hero-attached .article-hero-info .article-category{
    font-size:.72rem !important;
    padding:7px 12px !important;
    margin-bottom:9px !important;
  }
}