/* ===============================
   Home News Slider (uses news.css cards)
   =============================== */

.home-news-section{ padding: 8px 0 26px; }
.home-news-header{ margin-bottom: 14px; }

.home-news-all{
  text-decoration:none;
  font-weight:800;
  color:#5b21b6;
  display:inline-flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}

/* Wrapper for nav buttons */
.home-news-wrap{
  position: relative;
  padding: 6px 0 0;
}

/* IMPORTANT: let Swiper calculate widths (avoid missing slides) */
.home-news-slider .swiper-wrapper{
  display:flex !important;
}
.home-news-slider .swiper-slide{
  width: auto !important;
  flex-shrink: 0 !important;
  height: auto;
}

/* Make cards equal height inside slides */
.home-news-slider .news-card{
  height: 100%;
}

/* Nav buttons */
.home-news-nav{
  position:absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.95);
  box-shadow: 0 10px 25px rgba(2,6,23,.12);
  z-index: 5;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}
.home-news-prev{ left: -10px; }
.home-news-next{ right: -10px; }

@media (max-width: 640px){
  .home-news-prev{ left: -6px; }
  .home-news-next{ right: -6px; }
}

/* ===============================
   Khmer clipping FIX (no-image title)
   =============================== */

/* Do NOT clamp Khmer title on no-image (it clips legs) */
.home-news-section .news-card-noimage{
  overflow: visible !important;
}

/* Force safe line height + padding so Khmer legs not cut */
.home-news-section .noimage-title{
  font-family: "Moul","Battambang","Siemreap",sans-serif;
  font-weight: 500;
  line-height: 2.0 !important;    /* Khmer safe */
  padding-bottom: 10px !important; /* space for legs */
  display: block !important;
  overflow: visible !important;

  /* Allow wrap, but don't hide bottom */
  white-space: normal !important;
  word-break: break-word;
}

/* Also protect card title in body (avoid clipping) */
.home-news-section .news-card-title{
  font-family: "Moul","Battambang","Siemreap",sans-serif;
  font-weight: 500;
  line-height: 1.85;
  padding-bottom: 6px;
}

/* Keep hero height consistent (image + no-image) */
.home-news-section .news-card-image-wrapper{
  height: 240px; /* desktop */
  overflow: hidden;
}
@media (max-width: 991.98px){
  .home-news-section .news-card-image-wrapper{ height: 210px; }
}
@media (max-width: 576px){
  .home-news-section .news-card-image-wrapper{ height: 190px; }
}

/* No-image content centered but not tight */
.home-news-section .news-card-noimage{
  height: 100%;
  padding: 20px !important;
  display:flex;
  flex-direction: column;
  align-items:center;
  justify-content:center;
  text-align:center;
}
/* Decrease no-image title size (Home only) */
.home-news-section .noimage-title{
  font-family: "Moul","Battambang","Siemreap",sans-serif;
  font-weight: 500;

  /* ✅ smaller size */
  font-size: 1.55rem;          /* desktop */
  line-height: 2.05 !important; /* Khmer safe (don’t cut legs) */

  padding: 0 12px 10px !important;
  display: block !important;
  overflow: visible !important;
  white-space: normal !important;
  word-break: break-word;
}

/* Tablet */
@media (max-width: 991.98px){
  .home-news-section .noimage-title{
    font-size: 1.35rem;
    line-height: 2.0 !important;
  }
}

/* Mobile */
@media (max-width: 576px){
  .home-news-section .noimage-title{
    font-size: 1.18rem;
    line-height: 1.95 !important;
    padding-bottom: 8px !important;
  }
}
/* ===============================
   HOME – Smaller no-image title
   =============================== */

.home-news-section .noimage-title{
  font-family: "Moul","Battambang","Siemreap",sans-serif;
  font-weight: 400;

  /* ✅ Much smaller */
  font-size: 1.25rem;        /* desktop */
  line-height: 2.0 !important;  /* Khmer safe */

  padding: 0 10px 8px !important;
  margin: 0 auto;
  text-align: center;

  display: block !important;
  overflow: visible !important;
  white-space: normal !important;
  word-break: break-word;
}

/* Tablet */
@media (max-width: 991.98px){
  .home-news-section .noimage-title{
    font-size: 1.1rem;
    line-height: 1.95 !important;
  }
}

/* Mobile */
@media (max-width: 576px){
  .home-news-section .noimage-title{
    font-size: 1rem;
    line-height: 1.9 !important;
  }
}
/* ===============================
   HOME NEWS – Smaller Compact Card
   =============================== */

/* 1) Reduce hero height */
.home-news-section .news-card-image-wrapper{
  height: 190px !important;   /* was 240 */
}

@media (max-width: 991.98px){
  .home-news-section .news-card-image-wrapper{
    height: 170px !important;
  }
}

@media (max-width: 576px){
  .home-news-section .news-card-image-wrapper{
    height: 155px !important;
  }
}

/* 2) Reduce no-image title */
.home-news-section .noimage-title{
  font-size: 1.05rem !important;   /* much smaller */
  line-height: 1.9 !important;
  font-weight: 400 !important;
}

/* 3) Reduce card body padding */
.home-news-section .news-card-body{
  padding: 10px 12px 12px !important;
}

/* 4) Reduce main title size */
.home-news-section .news-card-title{
  font-size: 1.05rem !important;
  line-height: 1.7 !important;
  font-weight: 500 !important;
}

/* 5) Reduce excerpt */
.home-news-section .news-card-excerpt{
  font-size: 0.95rem !important;
  line-height: 1.6 !important;
}

/* 6) Reduce date/meta */
.home-news-section .news-card-date{
  font-size: 0.85rem !important;
}

/* 7) Reduce readmore */
.home-news-section .news-card-readmore{
  font-size: 0.9rem !important;
  padding: 6px 10px !important;
}

/* 8) Slightly reduce overall card shadow */
.home-news-section .news-card{
  box-shadow: 0 8px 18px rgba(2,6,23,.08) !important;
  border-radius: 16px !important;
}
/* ======================================
   FIX: noimage-title never disappear
   ====================================== */

/* Allow content to scroll instead of hide */
.home-news-section .news-card-noimage{
  overflow-y: auto !important;
  padding: 14px !important;
}

/* Make title wrap safely */
.home-news-section .noimage-title{
  font-size: 1rem !important;   /* smaller */
  line-height: 1.9 !important;  /* Khmer safe */
  word-break: break-word;
  white-space: normal !important;
  display: block !important;
}

/* Optional: subtle scrollbar style */
.home-news-section .news-card-noimage::-webkit-scrollbar{
  width: 4px;
}

.home-news-section .news-card-noimage::-webkit-scrollbar-thumb{
  background: rgba(15,165,110,.4);
  border-radius: 4px;
}
/* =========================================
   HOME NEWS – Make all cards equal height
   ========================================= */

/* 1) Card = flex column, same height */
.home-news-section .news-card{
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}

/* 2) Hero (image/no-image) = fixed height (same for all) */
.home-news-section .news-card-image-wrapper{
  height: 170px !important;      /* desktop */
  overflow: hidden !important;
}

@media (max-width: 991.98px){
  .home-news-section .news-card-image-wrapper{ height: 155px !important; }
}
@media (max-width: 576px){
  .home-news-section .news-card-image-wrapper{ height: 140px !important; }
}

/* 3) Body fills remaining space consistently */
.home-news-section .news-card-body{
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 10px 12px 12px !important;
}

/* 4) Title clamp (2 lines) – Khmer safe (no cut legs) */
.home-news-section .news-card-title{
  font-size: 1.02rem !important;
  line-height: 1.85 !important;     /* Khmer safe */
  padding-bottom: 2px !important;

  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  overflow: hidden !important;
}

/* 5) Excerpt clamp (3 lines) */
.home-news-section .news-card-excerpt{
  font-size: .95rem !important;
  line-height: 1.65 !important;
  margin-bottom: 10px !important;

  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
  overflow: hidden !important;
}

/* 6) Readmore always at bottom (align perfectly) */
.home-news-section .news-card-readmore{
  margin-top: auto !important;
  font-size: .9rem !important;
  padding: 6px 10px !important;
}

/* 7) No-image hero: keep same height and clamp title */
.home-news-section .news-card-noimage{
  height: 100% !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  padding: 12px 12px 10px !important;
  overflow: hidden !important; /* important for equal height */
}

/* No-image title: smaller + clamp 2 lines (no missing, no scroll) */
.home-news-section .news-card-noimage .noimage-title{
  font-family: "Moul","Battambang","Siemreap",sans-serif !important;
  font-weight: 400 !important;

  font-size: 1.0rem !important;
  line-height: 1.95 !important;     /* Khmer safe */
  padding-bottom: 4px !important;

  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  overflow: hidden !important;
  word-break: break-word !important;
}
/* =========================================
   HOME – No Image Badge (modern pill style)
   ========================================= */

.home-news-section .news-card-noimage .noimage-badge{
    font-family: "Moul","Battambang","Siemreap",sans-serif !important;
    font-weight: 400 !important;

    font-size: 15px !important;
    letter-spacing: .5px;

    padding: 8px 22px !important;
    border-radius: 999px !important;

    background: #ffffff !important;
    color: #0f172a !important;

    border: 1px solid rgba(2,6,23,.06) !important;

    box-shadow:
        0 10px 25px rgba(2,6,23,.08),
        0 2px 6px rgba(2,6,23,.05);

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

    margin-bottom: 14px !important;
}
/* =========================================
   HOME NEWS – Make all cards same size
   ========================================= */

/* 1) Track/container: fix equal columns */
.home-news-section .home-news-track{
  display: flex;
  gap: 22px;
  align-items: stretch;
}

/* 2) Each slide has same width (3 cards on desktop) */
.home-news-section .home-news-slide{
  flex: 0 0 calc((100% - 44px) / 3);
  min-width: calc((100% - 44px) / 3);
}

/* Tablet: 2 cards */
@media (max-width: 991.98px){
  .home-news-section .home-news-slide{
    flex: 0 0 calc((100% - 22px) / 2);
    min-width: calc((100% - 22px) / 2);
  }
}

/* Mobile: 1 card */
@media (max-width: 576px){
  .home-news-section .home-news-slide{
    flex: 0 0 100%;
    min-width: 100%;
  }
}

/* 3) Card: fixed height + flex layout */
.home-news-section .news-card{
  height: 520px;              /* ✅ adjust if you want smaller: 480px */
  display: flex;
  flex-direction: column;
  border-radius: 22px;
  overflow: hidden;
}

/* 4) Hero image/no-image area fixed height */
.home-news-section .news-card-image-wrapper{
  height: 230px;              /* ✅ consistent hero height */
  overflow: hidden;
}

@media (max-width: 991.98px){
  .home-news-section .news-card{ height: 500px; }
  .home-news-section .news-card-image-wrapper{ height: 210px; }
}
@media (max-width: 576px){
  .home-news-section .news-card{ height: 480px; }
  .home-news-section .news-card-image-wrapper{ height: 190px; }
}

/* 5) Ensure image fills hero */
.home-news-section .news-card-image{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 6) Body grows and button sticks bottom */
.home-news-section .news-card-body{
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* 7) Clamp title/excerpt so heights are equal */
.home-news-section .news-card-title{
  line-height: 1.45;
  padding-bottom: 6px;        /* ✅ protect Khmer legs */
  overflow: visible;
  display: -webkit-box;
  -webkit-line-clamp: 2;      /* ✅ only 2 lines */
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.home-news-section .news-card-excerpt{
  display: -webkit-box;
  -webkit-line-clamp: 2;      /* ✅ only 2 lines */
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* 8) Readmore always bottom */
.home-news-section .news-card-readmore{
  margin-top: auto;
}
/* =========================================================
   HOME NEWS HEADER (news-page-header home-news-header)
   Like screenshot: modern gradient card + top line
   ========================================================= */

.home-news-section .home-news-header {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 14px;
    padding: 18px 18px;
    margin: 8px 0 18px;
    border-radius: 18px;
    background: radial-gradient(900px 120px at 10% 0%, rgba(0,185,106,.18), transparent 65%), radial-gradient(900px 120px at 60% 0%, rgba(14,165,233,.16), transparent 60%), #ffffff;
    border: 1px solid rgba(15,23,42,.08);
    box-shadow: 0 14px 30px rgba(15,23,42,.08);
    overflow: hidden;
}

    .home-news-section .home-news-header::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4px;
        background: linear-gradient(90deg, #00b96a, #0ea5e9);
    }

.home-news-header__text {
    min-width: 0;
}

.home-news-section .home-news-header .news-page-title {
    margin: 0 0 6px 0;
    font-weight: 900;
    letter-spacing: .2px;
    font-size: clamp(1.55rem, 2.1vw, 2.2rem);
    line-height: 1.15;
    color: #009245;
}

.home-news-section .home-news-header .news-page-subtitle {
    margin: 0;
    color: rgba(15,23,42,.70);
    font-size: clamp(1rem, 1.2vw, 1.15rem);
    line-height: 1.5;
    max-width: 58ch;
}

.home-news-all {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    font-weight: 800;
    color: #6d28d9; /* purple like screenshot */
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(109,40,217,.20);
    background: rgba(109,40,217,.06);
    white-space: nowrap;
    flex-shrink: 0;
    transition: transform .15s ease, background .15s ease;
}

    .home-news-all:hover {
        transform: translateY(-1px);
        background: rgba(109,40,217,.10);
    }

.home-news-all__count {
    font-weight: 900;
}

.home-news-all__arrow {
    font-weight: 900;
}

/* Mobile: stack link under text */
@media (max-width: 575.98px) {
    .home-news-section .home-news-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .home-news-all {
        width: 100%;
        justify-content: space-between;
    }
}

/* =========================================================
   NEWS CARD IMAGE WRAPPER renovation
   ========================================================= */

.news-card-image-wrapper {
    position: relative;
    border-radius: 18px 18px 14px 14px;
    overflow: hidden;
    background: #eef2f7;
}

/* consistent height across cards */
.news-card-image-wrapper {
    aspect-ratio: 16 / 10; /* nice modern ratio */
}

@supports not (aspect-ratio: 1 / 1) {
    .news-card-image-wrapper {
        height: 210px; /* fallback */
    }
}

.news-card-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform: scale(1.001);
}

/* subtle overlay so badge/text readable */
.news-card-image-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(15,23,42,.00) 45%, rgba(15,23,42,.22) 100%);
    pointer-events: none;
}

/* badge position, nicer pill */
.news-card-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 2;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: .92rem;
    font-weight: 800;
    color: #ffffff;
    background: rgba(0,185,106,.92);
    border: 1px solid rgba(255,255,255,.55);
    box-shadow: 0 10px 20px rgba(15,23,42,.14);
}

/* no-image block: modern + readable Khmer */
.news-card-noimage {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 14px 14px;
    background: radial-gradient(700px 200px at 20% 0%, rgba(0,185,106,.18), transparent 60%), radial-gradient(700px 200px at 70% 0%, rgba(14,165,233,.14), transparent 60%), #f8fafc;
}

.noimage-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 14px;
    border-radius: 999px;
    font-weight: 900;
    font-size: 1.05rem;
    color: #0f172a;
    background: rgba(255,255,255,.95);
    border: 1px solid rgba(15,23,42,.10);
    box-shadow: 0 10px 18px rgba(15,23,42,.08);
    margin-bottom: 10px;
}

.noimage-title {
    font-weight: 900;
    color: #009245;
    font-size: clamp(1.05rem, 1.25vw, 1.25rem);
    line-height: 1.35;
    max-width: 28ch;
    /* ✅ show multi-line nicely without cutting */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Small screens: reduce the card image height a bit */
@media (max-width: 575.98px) {
    .news-card-image-wrapper {
        aspect-ratio: 16 / 11;
    }
}
/* ✅ FIX Khmer clipping: vowels/descenders cut */
.home-news-header .news-page-title.kh-font {
    display: inline-block; /* important */
    line-height: 1.35 !important; /* was 1.1~1.15 -> too tight */
    padding: .12em 0 .18em; /* give room for top vowels + bottom legs */
    margin: 0 0 6px 0;
}

.home-news-header .news-page-subtitle.kh-font {
    line-height: 1.7 !important;
    padding: .06em 0 .10em;
}

/* give the header more breathing room */
.home-news-header {
    padding-top: 22px !important;
    padding-bottom: 18px !important;
}

    /* If still clipped (rare): loosen overflow only for text area */
    .home-news-header .home-news-header__text {
        overflow: visible !important;
    }
/* =========================================================
   FIX Khmer vowels clipping (TOP vowels) in home-news header
   Root cause: overflow:hidden on the header card
   Solution: keep rounded/gradient using ::before, but allow overflow visible
   ========================================================= */

.home-news-section .home-news-header {
    position: relative;
    overflow: visible !important; /* ✅ DO NOT CLIP Khmer glyphs */
    border-radius: 18px;
    background: transparent !important;
    border: 1px solid rgba(15,23,42,.08);
    box-shadow: 0 14px 30px rgba(15,23,42,.08);
    padding: 22px 18px 18px !important; /* more top room */
    isolation: isolate;
}

    /* Move the gradient background into a rounded pseudo element */
    .home-news-section .home-news-header::before {
        content: "";
        position: absolute;
        inset: 0;
        border-radius: 18px; /* same as card */
        background: radial-gradient(900px 120px at 10% 0%, rgba(0,185,106,.18), transparent 65%), radial-gradient(900px 120px at 60% 0%, rgba(14,165,233,.16), transparent 60%), #ffffff;
        z-index: -1;
    }

    /* Top line */
    .home-news-section .home-news-header::after {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 4px;
        border-radius: 18px 18px 0 0;
        background: linear-gradient(90deg, #00b96a, #0ea5e9);
        z-index: 0;
    }

/* Title + subtitle: increase line box for Khmer */
.home-news-header .news-page-title.kh-font {
    display: inline-block;
    line-height: 1.6 !important; /* ✅ Khmer safe */
    padding: .20em 0 .25em !important;
    margin: 0 0 6px 0 !important;
}

.home-news-header .news-page-subtitle.kh-font {
    line-height: 1.85 !important;
    padding: .10em 0 .12em !important;
}

/* Ensure wrapper doesn't clip */
.home-news-header .home-news-header__text {
    overflow: visible !important;
}

/* Mobile stack */
@media (max-width: 575.98px) {
    .home-news-section .home-news-header {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* =========================================================
   HOME NEWS – Featured layout like screenshot
   Keep RHAC signature green + responsive
   ========================================================= */

:root {
    --rhac-green: #00b96a;
    --rhac-green-dark: #009245;
    --ink: #0f172a;
    --muted: rgba(15,23,42,.68);
    --line: rgba(15,23,42,.12);
}

/* wrapper */
.home-news-feature {
    margin-top: 10px;
}

/* ===== Featured (top) ===== */
.home-news-hero {
    border-radius: 18px;
    background: #fff;
    border: 1px solid rgba(15,23,42,.08);
    box-shadow: 0 12px 26px rgba(15,23,42,.08);
    overflow: hidden;
}

.home-news-hero__link {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 18px;
    text-decoration: none;
    color: inherit;
    padding: 18px;
}

.home-news-hero__media {
    border-radius: 14px;
    overflow: hidden;
    background: #eef2f7;
    min-height: 220px;
}

    .home-news-hero__media img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

.home-news-hero__noimg {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 14px;
    background: radial-gradient(700px 260px at 20% 0%, rgba(0,185,106,.20), transparent 60%), radial-gradient(700px 260px at 70% 0%, rgba(14,165,233,.12), transparent 60%), #f8fafc;
}

.home-news-hero__badge {
    display: inline-flex;
    padding: 8px 14px;
    border-radius: 999px;
    font-weight: 900;
    background: rgba(255,255,255,.96);
    border: 1px solid rgba(15,23,42,.10);
    margin-bottom: 10px;
}

.home-news-hero__noimgtitle {
    font-weight: 900;
    color: var(--rhac-green-dark);
    line-height: 1.55;
    padding: .15em 0 .2em; /* Khmer safe */
    max-width: 34ch;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* content */
.home-news-hero__content {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 10px;
}

.home-news-hero__title {
    margin: 0;
    font-weight: 900;
    color: var(--rhac-green-dark);
    font-size: clamp(1.35rem, 2.1vw, 2.15rem);
    line-height: 1.45; /* Khmer safe */
    padding: .14em 0 .18em; /* Khmer safe */
}

.home-news-hero__excerpt {
    margin: 0;
    color: var(--muted);
    font-size: clamp(1.02rem, 1.2vw, 1.15rem);
    line-height: 1.7;
}

.home-news-hero__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 6px;
    color: rgba(15,23,42,.72);
    font-weight: 700;
}

.home-news-hero__date i {
    margin-right: 6px;
    color: var(--rhac-green);
}

.home-news-hero__more {
    color: var(--rhac-green-dark);
    font-weight: 900;
}

.home-news-hero:hover {
    box-shadow: 0 18px 36px rgba(15,23,42,.12);
}

/* ===== Bottom links row (3 items like screenshot) ===== */
.home-news-links {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid var(--line);
    margin-top: 14px;
}

.home-news-link {
    display: block;
    padding: 16px 14px;
    font-weight: 900;
    color: var(--ink);
    text-decoration: none;
    border-right: 1px solid rgba(15,23,42,.10);
    line-height: 1.45;
    padding-top: 18px; /* Khmer safe */
    padding-bottom: 18px;
}

    .home-news-link:last-child {
        border-right: none;
    }

    .home-news-link:hover {
        color: var(--rhac-green-dark);
        background: rgba(0,185,106,.06);
    }

/* ===== Tablet ===== */
@media (max-width: 991.98px) {
    .home-news-hero__link {
        grid-template-columns: 1fr;
        padding: 14px;
    }

    .home-news-hero__media {
        min-height: 200px;
    }

    .home-news-links {
        grid-template-columns: 1fr;
    }

    .home-news-link {
        border-right: none;
        border-top: 1px solid rgba(15,23,42,.10);
    }

        .home-news-link:first-child {
            border-top: none;
        }
}

/* ===== Mobile small ===== */
@media (max-width: 575.98px) {
    .home-news-hero__media {
        min-height: 180px;
    }

    .home-news-hero__meta {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* =========================================================
   HOME NEWS – Modern featured card + popup shadow
   ========================================================= */

:root {
    --rhac: #00b96a;
    --rhac2: #009245;
    --ink: #0b1220;
    --muted: rgba(11,18,32,.68);
    --line: rgba(11,18,32,.10);
    --card: #ffffff;
}

.home-news-feature {
    margin-top: 12px;
}

/* ===== Main featured card ===== */
.home-news-hero {
    position: relative;
    border-radius: 22px;
    background: var(--card);
    border: 1px solid rgba(11,18,32,.08);
    overflow: hidden;
    box-shadow: 0 10px 26px rgba(11,18,32,.10), 0 40px 120px rgba(0,185,106,.10); /* green aura */
    transform: translateY(0);
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

    /* Top “accent bar” */
    .home-news-hero::before {
        content: "";
        position: absolute;
        left: 14px;
        right: 14px;
        top: 12px;
        height: 4px;
        border-radius: 999px;
        background: linear-gradient(90deg, var(--rhac2), #18c47c, #0ea5e9);
        opacity: .95;
        z-index: 2;
    }

    /* Soft glass background blobs */
    .home-news-hero::after {
        content: "";
        position: absolute;
        inset: -120px -140px auto -140px;
        height: 260px;
        background: radial-gradient(160px 140px at 30% 60%, rgba(0,185,106,.22), transparent 70%), radial-gradient(200px 170px at 65% 35%, rgba(14,165,233,.18), transparent 70%);
        filter: blur(2px);
        z-index: 1;
        pointer-events: none;
    }

    /* Popup shadow / hover lift */
    .home-news-hero:hover {
        transform: translateY(-6px);
        border-color: rgba(0,185,106,.25);
        box-shadow: 0 18px 44px rgba(11,18,32,.16), 0 70px 160px rgba(0,185,106,.18);
    }

/* clickable area */
.home-news-hero__link {
    position: relative;
    z-index: 3;
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 22px;
    padding: 22px;
    text-decoration: none;
    color: inherit;
}

/* ===== Media ===== */
.home-news-hero__media {
    border-radius: 18px;
    overflow: hidden;
    background: #eef2f7;
    min-height: 250px;
    box-shadow: 0 14px 30px rgba(11,18,32,.10); /* “popup” image */
    transform: translateY(0);
    transition: transform .22s ease, box-shadow .22s ease;
}

.home-news-hero:hover .home-news-hero__media {
    transform: translateY(-3px);
    box-shadow: 0 20px 46px rgba(11,18,32,.14);
}

.home-news-hero__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform: scale(1.02);
    transition: transform .35s ease;
}

.home-news-hero:hover .home-news-hero__media img {
    transform: scale(1.06);
}

.home-news-hero__noimg {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 18px;
    background: radial-gradient(700px 260px at 20% 0%, rgba(0,185,106,.20), transparent 60%), radial-gradient(700px 260px at 70% 0%, rgba(14,165,233,.12), transparent 60%), #f8fafc;
}

.home-news-hero__badge {
    display: inline-flex;
    padding: 9px 14px;
    border-radius: 999px;
    font-weight: 900;
    background: rgba(255,255,255,.92);
    border: 1px solid rgba(11,18,32,.10);
    box-shadow: 0 10px 22px rgba(11,18,32,.10);
    margin-bottom: 10px;
}

.home-news-hero__noimgtitle {
    font-weight: 900;
    color: var(--rhac2);
    line-height: 1.6; /* Khmer safe */
    padding: .18em 0 .22em;
    max-width: 36ch;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ===== Content ===== */
.home-news-hero__content {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 12px;
}

.home-news-hero__title {
    margin: 0;
    font-weight: 950;
    color: var(--rhac2);
    font-size: clamp(1.45rem, 2.2vw, 2.25rem);
    letter-spacing: -0.01em;
    line-height: 1.5; /* Khmer safe */
    padding: .16em 0 .20em; /* Khmer safe */
}

.home-news-hero__excerpt {
    margin: 0;
    color: var(--muted);
    font-size: clamp(1.05rem, 1.15vw, 1.18rem);
    line-height: 1.75;
    max-width: 65ch;
}

/* ===== Meta + CTA ===== */
.home-news-hero__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 2px;
    font-weight: 800;
}

.home-news-hero__date {
    color: rgba(11,18,32,.70);
}

    .home-news-hero__date i {
        margin-right: 6px;
        color: var(--rhac);
    }

.home-news-hero__more {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 999px;
    font-weight: 950;
    color: #fff;
    background: linear-gradient(135deg, var(--rhac2), var(--rhac));
    box-shadow: 0 14px 28px rgba(0,185,106,.22);
    transition: transform .22s ease, box-shadow .22s ease;
}

.home-news-hero:hover .home-news-hero__more {
    transform: translateY(-2px);
    box-shadow: 0 18px 38px rgba(0,185,106,.30);
}

/* ===== Bottom links row ===== */
.home-news-links {
    margin-top: 14px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    border-top: 1px solid var(--line);
    background: rgba(255,255,255,.60);
    backdrop-filter: blur(10px);
}

.home-news-link {
    position: relative;
    display: block;
    padding: 18px 16px;
    font-weight: 950;
    color: var(--ink);
    text-decoration: none;
    line-height: 1.5;
    padding-top: 20px; /* Khmer safe */
    padding-bottom: 20px;
    border-right: 1px solid rgba(11,18,32,.10);
    transition: background .18s ease, color .18s ease, transform .18s ease;
}

    .home-news-link:last-child {
        border-right: none;
    }

    .home-news-link:hover {
        background: rgba(0,185,106,.08);
        color: var(--rhac2);
        transform: translateY(-1px);
    }

    /* little green dot on hover */
    .home-news-link::after {
        content: "";
        position: absolute;
        left: 16px;
        top: 14px;
        width: 8px;
        height: 8px;
        border-radius: 999px;
        background: var(--rhac);
        opacity: 0;
        transform: translateY(2px);
        transition: opacity .18s ease, transform .18s ease;
    }

    .home-news-link:hover::after {
        opacity: 1;
        transform: translateY(0);
    }

/* ===== Tablet ===== */
@media (max-width: 991.98px) {
    .home-news-hero {
        border-radius: 20px;
    }

    .home-news-hero__link {
        grid-template-columns: 1fr;
        padding: 16px;
        gap: 16px;
    }

    .home-news-hero__media {
        min-height: 220px;
    }

    .home-news-links {
        grid-template-columns: 1fr;
    }

    .home-news-link {
        border-right: none;
        border-top: 1px solid rgba(11,18,32,.10);
    }

        .home-news-link:first-child {
            border-top: none;
        }

    .home-news-hero__meta {
        flex-direction: column;
        align-items: flex-start;
    }

    .home-news-hero__more {
        width: 100%;
        justify-content: center;
    }
}

/* ===== Mobile small ===== */
@media (max-width: 575.98px) {
    .home-news-hero__media {
        min-height: 190px;
    }

    .home-news-hero__title {
        font-size: 1.55rem;
    }
}
/* ==============================
   FEATURED BADGE – RHAC GREEN
   ============================== */

.home-news-hero__badge {
    background: linear-gradient(135deg, #009245, #00b96a) !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 10px 24px rgba(0,185,106,.35), 0 2px 6px rgba(0,0,0,.10);
    font-size: 1.05rem;
    letter-spacing: .4px;
    padding: 10px 18px;
}
/* ===========================================
   HOME NEWS LINKS – Modern Glass + Bigger
   =========================================== */

.home-news-links {
    margin-top: 20px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    border: none;
    background: transparent;
}

/* Each link becomes modern card */
.home-news-link {
    position: relative;
    display: flex;
    align-items: center;
    padding: 22px 22px;
    font-weight: 950;
    font-size: 1.35rem; /* 🔥 Bigger font */
    color: #0b1220;
    text-decoration: none;
    border-radius: 18px;
    line-height: 1.6; /* Khmer safe */
    padding-top: 24px; /* Khmer safe */
    padding-bottom: 24px;
    background: rgba(255,255,255,.75);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(0,185,106,.18);
    box-shadow: 0 12px 26px rgba(15,23,42,.08), 0 30px 60px rgba(0,185,106,.08);
    transition: all .25s ease;
}

    /* Hover effect – popup green */
    .home-news-link:hover {
        transform: translateY(-6px);
        background: linear-gradient(135deg, #009245, #00b96a);
        color: #ffffff;
        border-color: transparent;
        box-shadow: 0 18px 42px rgba(15,23,42,.18), 0 50px 120px rgba(0,185,106,.30);
    }

    /* Small decorative green circle */
    .home-news-link::before {
        content: "";
        width: 14px;
        height: 14px;
        border-radius: 999px;
        background: #00b96a;
        margin-right: 16px;
        flex-shrink: 0;
        transition: all .25s ease;
    }

    .home-news-link:hover::before {
        background: #ffffff;
        transform: scale(1.2);
    }

    /* Remove old borders */
    .home-news-link:last-child {
        border-right: none;
    }
/* ===== Tablet ===== */
@media (max-width: 991.98px) {
    .home-news-links {
        grid-template-columns: 1fr;
    }

    .home-news-link {
        font-size: 1.25rem;
    }
}

/* ===== Small Mobile ===== */
@media (max-width: 575.98px) {
    .home-news-link {
        font-size: 1.15rem;
        padding: 18px;
    }
}
/* =====================================
   FEATURED BADGE – WHITE BUTTON STYLE
   Text Green (Clinic RHAC Signature)
   ===================================== */

.home-news-hero__badge {
    background: #ffffff !important;
    color: #009245 !important; /* RHAC green text */
    border: 2px solid #00b96a !important;
    font-weight: 900;
    font-size: 1.05rem;
    letter-spacing: .4px;
    padding: 10px 20px;
    border-radius: 999px;
    box-shadow: 0 8px 20px rgba(0,185,106,.18), 0 2px 6px rgba(0,0,0,.06);
    transition: all .25s ease;
}

    /* Hover effect – subtle green fill */
   
/* =====================================
   Decrease Featured Title Size
   ===================================== */

.home-news-hero__title.kh-font {
    font-size: clamp(1.5rem, 1.8vw, 2.0rem) !important;
    line-height: 1.55 !important; /* Khmer safe */
    padding: .14em 0 .18em;
}
@media (max-width: 575.98px) {
    .home-news-hero__title.kh-font {
        font-size: 1.25rem !important;
    }
}
/* =========================================
   Khmer text clipping fix (mobile)
   For: noimage badge + title
   ========================================= */

/* IMPORTANT: allow text to fully show */
.news-card-noimage,
.news-card-noimage *{
  overflow: visible !important;
}

/* Badge: add safe padding + line-height */
.news-card-noimage .noimage-badge.kh-font{
  line-height: 1.6 !important;
  padding: 10px 18px !important;     /* more top/bottom room */
  height: auto !important;
  min-height: 0 !important;
}

/* Title in no-image area: Khmer-safe */
.news-card-noimage .noimage-title.kh-font{
  line-height: 1.85 !important;
  padding-top: .15em !important;
  padding-bottom: .25em !important;
  overflow: visible !important;
  word-break: normal;
}

/* Mobile extra safety */
@media (max-width: 575.98px){
  .news-card-noimage .noimage-badge.kh-font{
    padding: 10px 16px !important;
    font-size: 1.05rem !important;
  }
  .news-card-noimage .noimage-title.kh-font{
    line-height: 1.95 !important;
    padding-bottom: .35em !important;
  }
}



/* =========================================================
   FIX: Desktop overlap (media covers text)
   Make columns responsive + prevent overflow
   ========================================================= */

/* Parent row MUST allow shrinking */
.home-news-hero__inner{
  display: grid !important;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr) !important;
  gap: 26px !important;
  align-items: start !important;
}

/* VERY IMPORTANT: allow flex/grid children to shrink */
.home-news-hero__media,
.home-news-hero__content{
  min-width: 0 !important;
}

/* Media: never exceed its column, no overlap */
.home-news-hero__media{
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;        /* clip only inside its box */
  border-radius: 18px !important;
}

/* Keep Khmer safe inside media */
.home-news-hero__media *{
  overflow: visible !important;
}

/* Content side: allow long Khmer wrap instead of pushing out */
.home-news-hero__title.kh-font,
.home-news-hero__excerpt.kh-font{
  overflow-wrap: anywhere !important;
  word-break: normal;
}

/* Desktop large screens: keep nice ratio */
@media (min-width: 1200px){
  .home-news-hero__inner{
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr) !important;
  }
}

/* Tablet/mobile: stack */
@media (max-width: 991.98px){
  .home-news-hero__inner{
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
}

/* If it is flex layout, prevent overlap */
.home-news-hero__inner{
  flex-wrap: wrap !important;
}

.home-news-hero__media{
  flex: 0 0 46% !important;
}

.home-news-hero__content{
  flex: 1 1 54% !important;
}

.home-news-hero__media,
.home-news-hero__content{
  min-width: 0 !important;
}

@media (max-width: 991.98px){
  .home-news-hero__media,
  .home-news-hero__content{
    flex: 0 0 100% !important;
  }
}