/* ============================================================
   KCThanhHoa V15 - Home Zone Editorial Header
   20/08/2026
   Thiết kế lại đầu chuyên mục: trái rõ - phải gọn, không căn giữa.
   ============================================================ */

.home-zone-rich-head{
  position:relative !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  align-items:end !important;
  gap:16px !important;
  min-height:0 !important;
  height:auto !important;
  margin:0 0 14px !important;
  padding:0 0 10px !important;
  border-bottom:1px solid rgba(39,91,157,.18) !important;
  overflow:visible !important;
}

.home-zone-rich-head::after{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  bottom:-1px !important;
  width:46px !important;
  height:2px !important;
  border-radius:999px !important;
  background:linear-gradient(90deg,#275b9d,#0f766e) !important;
}

.home-zone-rich-title-wrap{
  display:block !important;
  min-width:0 !important;
  width:auto !important;
  margin:0 !important;
  text-align:left !important;
}

.home-zone-rich-copy{
  min-width:0 !important;
  text-align:left !important;
}

.home-zone-rich-copy h2{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:8px !important;
  margin:0 !important;
  padding:0 !important;
  color:#173b67 !important;
  font-size:clamp(15px,1.15vw,18px) !important;
  font-weight:800 !important;
  line-height:1.3 !important;
  letter-spacing:.01em !important;
  text-transform:uppercase !important;
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
}

.home-zone-title-icon{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 auto !important;
  width:26px !important;
  height:26px !important;
  border-radius:8px !important;
  background:linear-gradient(135deg,rgba(39,91,157,.12),rgba(15,118,110,.10)) !important;
  color:#275b9d !important;
  font-size:12px !important;
}

.home-zone-rich-copy p{
  display:block !important;
  margin:5px 0 0 !important;
  color:#6b7280 !important;
  font-size:11.5px !important;
  line-height:1.45 !important;
  text-align:left !important;
}

.home-zone-rich-link{
  position:relative !important;
  inset:auto !important;
  align-self:end !important;
  justify-self:end !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;
  min-height:30px !important;
  margin:0 0 1px !important;
  padding:6px 10px !important;
  border:1px solid rgba(39,91,157,.22) !important;
  border-radius:999px !important;
  background:#fff !important;
  color:#275b9d !important;
  font-size:10.5px !important;
  font-weight:800 !important;
  line-height:1 !important;
  letter-spacing:.02em !important;
  box-shadow:none !important;
  white-space:nowrap !important;
  text-decoration:none !important;
  transform:none !important;
  transition:background .2s ease,color .2s ease,border-color .2s ease,transform .2s ease !important;
}

.home-zone-rich-link::after{
  content:"→" !important;
  font-size:11px !important;
  line-height:1 !important;
}

.home-zone-rich-link:hover,
.home-zone-rich-link:focus{
  background:#275b9d !important;
  color:#fff !important;
  border-color:#275b9d !important;
  transform:translateY(-1px) !important;
}

/* Mobile/tablet: vẫn bám trái, không căn giữa. */
@media (max-width:768px){
  .home-zone-rich-head{
    grid-template-columns:minmax(0,1fr) auto !important;
    align-items:end !important;
    gap:10px !important;
    margin-bottom:10px !important;
    padding-bottom:8px !important;
    text-align:left !important;
  }

  .home-zone-rich-copy h2{
    font-size:14px !important;
    line-height:1.28 !important;
    -webkit-line-clamp:2 !important;
    -webkit-box-orient:vertical !important;
    display:-webkit-box !important;
    overflow:hidden !important;
  }

  .home-zone-rich-copy p{
    display:none !important;
  }

  .home-zone-rich-link{
    justify-self:end !important;
    align-self:end !important;
    min-height:28px !important;
    padding:5px 8px !important;
    font-size:10px !important;
  }
}

/* Điện thoại hẹp: action xuống dưới nhưng vẫn bám trái, tránh cảm giác "lơ lửng giữa". */
@media (max-width:480px){
  .home-zone-rich-head{
    grid-template-columns:minmax(0,1fr) !important;
    gap:7px !important;
    align-items:start !important;
  }

  .home-zone-rich-link{
    justify-self:start !important;
    align-self:start !important;
    margin-top:1px !important;
  }
}