/* ==========================================================================
   RHAC - CONSOLIDATED STYLESHEET (Desktop / Tablet / Mobile)
   Cleaned & De-duplicated
   ========================================================================== */

/* --- 1) THEME VARIABLES --- */
:root{
  --rhac-primary-color:#009245;
  --rhac-primary-hover:#007a39;
  --footer-bg-color:#00a651;
  --rhac-bg-color:#fff;
  --text-color:#333;
  --text-color-light:#6c757d;
  --border-color:#dcdcdc;
  --shadow-md:0 4px 15px rgba(0,0,0,.08);
  --shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);

  /* Home theme */
  --theme-dark-teal:#19645E;
  --theme-light-mint-bg:#E7F8F0;
  --theme-serif-font:'Georgia','Times New Roman',serif;

  /* Extras */
  --rhac-gradient:linear-gradient(90deg, var(--rhac-primary-color), #00c389);
  --radius-lg:16px; --radius-md:12px; --radius-sm:8px;
}

/* --- 2) BASE LAYOUT --- */
body.rhac-theme{ font-family:'Open Sans',sans-serif; background:var(--rhac-bg-color); margin:0; color:var(--text-color) }
.container{ max-width:1280px; margin:0 auto; padding:0 1rem }
.main-content{ background:transparent; padding:0 } /* no forced top padding */
.page-container{ padding:2rem 1rem }

/* ==========================================================================
   HEADER, STICKY WRAPPER, TOP BAR
   ========================================================================== */
.sticky-header-wrapper{
  position:sticky; top:0; z-index:1000; width:100%;
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(180%) blur(8px);
  border-bottom:1px solid #eef3f2;
}
.main-header{ background:#fff }
.main-header .container{
  display:flex; justify-content:space-between; align-items:center; padding:1rem 1rem;
}
.header-logo{ height:60px }
.header-nav-right{ display:flex; align-items:center; gap:1.5rem }
.header-nav-right .flag img{ height:16px; border:1px solid #ddd }
.header-nav-right .header-icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:12px; background:#fff;
  border:1px solid var(--border-color); box-shadow:var(--shadow-md);
  color:var(--rhac-primary-color); font-size:1.25rem;
  transition:transform .15s, box-shadow .15s, background-color .15s;
}
.header-nav-right .header-icon:hover{ transform:translateY(-1px); box-shadow:var(--shadow-lg); background:#f7fff9 }
.mobile-menu-button{ display:none; background:none; border:0; font-size:1.5rem; cursor:pointer; color:var(--rhac-primary-color) }

/* Header CTA */
.header-cta.btn-primary{
  display:inline-flex; align-items:center; justify-content:center;
  height:40px; padding:0 14px; border-radius:12px;
  background:var(--rhac-gradient); color:#fff; text-decoration:none; font-weight:700;
  box-shadow:0 10px 22px rgba(0,146,69,.25);
  transition:transform .15s, box-shadow .15s, opacity .2s;
}
.header-cta.btn-primary:hover{ transform:translateY(-1px); box-shadow:0 14px 28px rgba(0,146,69,.32) }

/* ==========================================================================
   NAVIGATION + CHILD MENUS + SEARCH + PHONE CTA
   ========================================================================== */
.main-nav-bar{
  position:relative; z-index:60; background:#fff;
  box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.05);
}
.main-nav-bar .container{ display:flex; align-items:center; gap:1.25rem; overflow:visible }

.nav-menu{ list-style:none; display:flex; align-items:center; gap:1.25rem; padding:.5rem 0; margin:0 }
.nav-item{ position:relative }

/* green pills */
.nav-menu > .nav-item > a{
  position:relative;
  display:inline-block; padding:.70rem 1.05rem; border-radius:999px;
  color:var(--rhac-primary-color); text-decoration:none; font-weight:700; border:2px solid transparent;
  transition:background-color .2s, color .2s;
  font-family:'Moul','Battambang','Open Sans',sans-serif;
}
.nav-menu > .nav-item > a:hover,
.nav-menu > .nav-item > a.active{ background:#f1faf4; color:var(--rhac-primary-color) }

/* underline for active */
.nav-menu > .nav-item.active-parent > a::after,
.main-nav-bar a.active::after{
  content:""; position:absolute; left:14px; right:14px; bottom:6px; height:3px; border-radius:3px;
  background:var(--rhac-primary-color);
}

/* dropdown (desktop hover + keyboard) */
.submenu{
  position:absolute; top:calc(100% + 10px); left:10px; min-width:240px;
  background:#fff; border:1px solid #e6efe9; border-radius:14px;
  box-shadow:0 16px 38px rgba(0,0,0,.12);
  padding:8px; margin:0; list-style:none;
  opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:opacity .16s, transform .16s, visibility .16s;
}
.submenu a{
  display:block; padding:.6rem .8rem; border-radius:10px;
  text-decoration:none; color:#1c2f24; font-weight:700;
}
.submenu a:hover{ background:#f6fff9; color:var(--rhac-primary-color) }
.submenu-toggle{ display:none; margin-left:.25rem; background:transparent; border:0; color:var(--rhac-primary-color); cursor:pointer }
.submenu-toggle:focus-visible{ outline:3px solid rgba(0,146,69,.35); outline-offset:2px }

@media (hover:hover){
  .has-children:hover > .submenu,
  .has-children:focus-within > .submenu{
    opacity:1; visibility:visible; transform:translateY(0);
  }
}

/* search in nav (after last item) */
.nav-item.nav-search{ margin-left:.25rem }
.search-field{
  display:flex; align-items:center; gap:.55rem; height:40px; padding:0 .9rem;
  border:2px solid #c7cfd7; border-radius:999px; background:#fff;
  width:clamp(220px,22vw,320px);
  transition:border-color .15s, box-shadow .15s;
}
.search-field i{ color:#5f758a; font-size:1rem }
.search-input{
  width:100%; border:0; outline:0; background:transparent;
  font-size:.98rem; color:#1c2731; font-family:'Battambang','Open Sans',sans-serif;
}
.search-input::placeholder{ color:#7a8a99; opacity:1 }
.search-field:focus-within{ border-color:var(--rhac-primary-color); box-shadow:0 0 0 3px rgba(0,146,69,.18) }

/* phone call CTA with text */
.phone-cta{
  display:inline-flex; align-items:center; gap:8px;
  height:40px; padding:0 12px; border-radius:12px; border:1px solid var(--border-color);
  background:var(--rhac-primary-color); color:#fff; font-weight:700; white-space:nowrap;
  text-decoration:none; box-shadow:0 10px 22px rgba(0,146,69,.20);
  transition:transform .15s, box-shadow .15s, background-color .15s;
}
.phone-cta:hover{ transform:translateY(-1px); box-shadow:0 14px 28px rgba(0,146,69,.28) }
.phone-cta i{ font-size:1rem }
.phone-cta__text{ font-family:'Battambang','Open Sans',sans-serif; font-size:.98rem; letter-spacing:.2px }

/* social buttons */
.header-social{ display:inline-flex; gap:.6rem }
.social-cta{
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:50%;
  background:#fff; border:1px solid var(--border-color);
  color:var(--rhac-primary-color);
  box-shadow: var(--shadow-md);
  text-decoration:none;
  transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
  font-size:1rem;
}
.social-cta:hover{ transform: translateY(-1px); background:#f7fff9; box-shadow: var(--shadow-lg); }

.phone-cta--with-disc{ gap:10px }
.phone-cta__disc{
  display:inline-flex; align-items:center; justify-content:center;
  width:28px; height:28px; border-radius:50%;
  background:#fff;
}
.phone-cta__disc i{ color:var(--rhac-primary-color); font-size:.95rem }

/* mobile / tablet menu behavior */
@media (max-width:992px){
  .mobile-menu-button{ display:block }
  .main-nav-bar{ display:none }
  .main-nav-bar.is-active{ display:block }

  .main-nav-bar .container{ flex-direction:column; align-items:stretch; gap:0; padding:.5rem 1rem }
  .nav-menu{ flex-direction:column; gap:.25rem; padding:.25rem 0 }
  .nav-menu > .nav-item > a{
    display:flex; justify-content:space-between; align-items:center;
    width:100%; border-radius:12px; padding:.9rem 1rem;
  }
  .has-children > .submenu-toggle{ display:inline-flex; align-items:center }
  .submenu{
    position:static; transform:none; opacity:1; visibility:visible; border:0; box-shadow:none;
    padding:0 0 .5rem 0; margin-left:.5rem; display:none;
  }
  .has-children.open > .submenu{ display:block }

  .nav-item.nav-search{ width:100%; padding:.25rem 0 }
  .search-field{ width:100% }
  .header-logo{ height:36px }
}
@media (max-width:480px){
  .search-field{ height:38px }
  .phone-cta{ height:38px; padding:0 10px }
  .phone-cta__disc{ width:26px; height:26px }
  .phone-cta__text{ display:none !important }
  .social-cta{ width:36px; height:36px }
}

/* ==========================================================================
   APPOINTMENT PAGE + FORM
   ========================================================================== */
.hero-image{ width:100%; height:350px; object-fit:cover; border-radius:12px; margin-bottom:3rem }
.info-section h2{ font-family:'Moul',sans-serif; font-weight:normal; font-size:1.8rem }

/* accordion */
.accordion-container{ border:1px solid #e9ecef; border-radius:8px; margin-top:1.5rem; overflow:hidden }
.accordion-toggle{ display:flex; justify-content:space-between; align-items:center; width:100%; padding:1rem 1.5rem; background:#f8f9fa; border:0; cursor:pointer; text-align:left; transition:background-color .3s }
.accordion-toggle:hover{ background:#f1f3f5 }
.accordion-title{ font-size:1.1rem; font-weight:600; color:var(--text-color) }
.accordion-icon{ font-size:1.5rem; font-weight:300; color:var(--rhac-primary-color) }
.accordion-content{ max-height:0; overflow:hidden; transition:max-height .4s ease-out, padding .2s ease-out; padding:0; background:#fff }
.accordion-content .location-item{ padding:1.5rem; border-bottom:1px solid #e9ecef }
.accordion-content .location-item:last-child{ border-bottom:none }
.accordion-content .location-item h4{ font-size:1rem; font-weight:700; margin:0 0 .5rem; color:var(--text-color) }
.accordion-content .location-item .location-detail{ font-size:.9rem; color:var(--text-color-light); margin:0 }
.accordion-content .location-item .location-detail i{ color:var(--rhac-primary-color); margin-right:8px }

/* booking card */
.booking-card{ background:#fff; border:1px solid #e9ecef; border-radius:8px; margin-top:2rem; overflow:hidden; box-shadow:var(--shadow-lg) }
.booking-card .card-header{ padding:1.5rem 2rem; border-bottom:1px solid #e9ecef }
.booking-card .card-title{ font-family:'Moul',sans-serif; font-weight:normal; color:var(--rhac-primary-color); margin:0; font-size:1.5rem }
.booking-card .card-body{ padding:1rem 2rem 2rem }

/* underline inputs */
.form-control-line{
  width:100%; background:transparent; border:0; border-radius:0; border-bottom:1px solid #e0e0e0;
  padding:.85rem .25rem; font-size:1rem; color:var(--text-color); font-weight:700; transition:border-color .3s;
  -webkit-appearance:none; -moz-appearance:none; appearance:none;
}
.form-control-line::placeholder{ color:#555; font-weight:700; opacity:1 }
.form-control-line:focus{ outline:0; border-bottom-color:var(--rhac-primary-color) }
.form-control-line option{ font-weight:700 !important; color:#333 }
select:required:invalid{ color:#555; font-weight:700; opacity:1 }

/* date picker wrapper */
.date-input-container{ display:flex; align-items:center; border-bottom:1px solid #e0e0e0; transition:border-color .3s }
.date-input-container:focus-within{ border-bottom-color:var(--rhac-primary-color) }
.date-input-container .date-icon{ color:#aaa; margin-right:.5rem }
.date-input-container #appointment_date{ border:0; flex-grow:1; padding-left:0 }
.date-input-container #appointment_date:focus{ outline:0 }

/* submit */
.submit-btn{
  display:inline-block; background:var(--rhac-primary-color); color:#fff; border:0;
  padding:12px 35px; border-radius:30px; font-size:1rem; font-weight:600; cursor:pointer; text-align:center;
  transition:.3s; box-shadow:0 4px 15px rgba(0,146,69,.2);
}
.submit-btn:hover{ background:var(--rhac-primary-hover); transform:translateY(-2px); box-shadow:0 6px 20px rgba(0,146,69,.3) }

/* FLATPICKR */
.flatpickr-calendar{ font-family:'Open Sans',sans-serif; background:#fff; border-radius:8px; box-shadow:var(--shadow-lg); border:1px solid #e9ecef }
.flatpickr-months .flatpickr-month{ color:var(--text-color); fill:var(--text-color) }
.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg{ fill:var(--rhac-primary-color) }
.flatpickr-weekday{ color:var(--text-color); font-weight:700 }
.flatpickr-day{ color:var(--text-color); border:1px solid transparent }
.flatpickr-day:hover{ background:#f0f0f0; border-color:#f0f0f0 }
.flatpickr-day.today{ border-color:var(--rhac-primary-color) }
.flatpickr-day.today:hover{ background:var(--rhac-primary-color); color:#fff }
.flatpickr-day.selected,.flatpickr-day.startRange,.flatpickr-day.endRange{ background:var(--rhac-primary-color); border-color:var(--rhac-primary-color); color:#fff }
.flatpickr-day.disabled{ color:#dcdcdc }

/* ==========================================================================
   GENERIC PAGES / FOOTER
   ========================================================================== */
.info-section{ margin-bottom:3rem }
.info-section h2{ font-size:1.5rem; color:var(--rhac-primary-color); border-bottom:1px solid #eee; padding-bottom:.5rem; margin-bottom:1.5rem }
.info-section p,.info-section li{ line-height:1.7; color:var(--text-color-light) }
.info-section ul{ list-style:disc; padding-left:20px }
.info-section strong{ color:var(--text-color) }
.info-section a{ color:var(--rhac-primary-color); text-decoration:none; font-weight:bold }
.info-section a:hover{ text-decoration:underline }

/* Footer */
.main-footer{ background:var(--footer-bg-color); color:#fff; padding:1rem 0; font-size:.9rem; box-shadow:0 -10px 20px rgba(0,0,0,.04) inset }
body.lang-km .main-footer{ font-family:'Moulpali',sans-serif }
.footer-container{
  max-width:1280px; margin:0 auto; display:grid; grid-template-columns:3fr 2fr 2fr 1.5fr; gap:1rem; padding:0 1rem;
}
.footer-col h3{ font-size:1.1rem; font-weight:normal; margin:0 0 1.25rem; border:0; padding:0 }
.footer-col h3 a{ color:#fff; text-decoration:none }
.footer-col h3 a:hover{ text-decoration:underline }
.footer-col:last-of-type h3{ text-transform:uppercase }
.footer-col p{ line-height:1.6; margin:0 0 1rem }
.footer-col p,.footer-col a{ color:#eefcf4 }
.footer-col a:hover{ color:#fff }
.social-icons a{ font-size:2.2rem; color:#fff }
.footer-bottom{ max-width:1280px; margin:1rem auto 0; padding:0 1rem; text-align:left }
.footer-divider{ border:0; height:1px; background:rgba(255,255,255,.7); margin:0 0 1.5rem }
.copyright-text{ margin:0; font-size:.9rem }

/* ==========================================================================
   ABOUT / GENERIC CONTENT PAGE
   ========================================================================== */
.page-content{ max-width:1000px; margin:0 auto; padding:2rem 0 }
.page-content .page-title{
  font-family:'Moul',sans-serif; font-weight:normal; text-align:center; font-size:2.2rem;
  color:var(--rhac-primary-color); margin:0 auto 2.5rem; position:relative; padding-bottom:1rem;
}
.page-content .page-title::after{
  content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%);
  width:60px; height:3px; background:var(--rhac-primary-color);
}
.page-content p{
  font-family:'Battambang',sans-serif; font-size:1.1rem; line-height:1.9; color:var(--text-color-light);
  text-align:justify; margin-bottom:1.5rem;
}

/* ==========================================================================
   HOMEPAGE SECTIONS
   ========================================================================== */
.medical-theme-home .homepage-section{ padding:2rem 0 }
.medical-theme-home .section-title{
  font-family:'Moul',sans-serif; font-weight:normal; text-align:center; font-size:1.8rem;
  margin:0 auto 2.5rem; position:relative; padding-bottom:1rem; color:var(--text-color);
}
.medical-theme-home .section-title::after{
  content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%);
  width:50px; height:2px; background:var(--rhac-primary-color);
}

/* ===== FULL-BLEED HERO (modern) ========================================= */
.hero-slider-section.hero-fullbleed{
  position:relative;
  background:#000;             /* prevents white flash on image load */
  padding:0;
}
.hero-fullbleed .hero-shell{ border-radius:0; box-shadow:none; width:100% }
.hero-fullbleed .hero-slider{ height: clamp(420px, 60vw, 720px) }
.hero-fullbleed .swiper{ padding:0 !important } /* no extra spacing */

/* media + overlay + content */
.hero-slide-media{ position:absolute; inset:0; z-index:0 }
.hero-slide-media img{ width:100%; height:100%; object-fit:cover; display:block; transform:scale(1.02) }
.hero-slide-overlay{
  position:absolute; inset:0; z-index:1;
  background:
    radial-gradient(120% 120% at 20% 50%, rgba(0,0,0,.25) 0%, rgba(0,0,0,.05) 45%, rgba(0,0,0,0) 70%),
    linear-gradient(0deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,0) 40%);
  pointer-events:none;
}
.hero-slide-content{
  position:absolute; inset:0; z-index:2;
  display:flex; flex-direction:column; justify-content:center;
  padding: clamp(16px, 5vw, 48px);
  color:#fff; text-shadow:0 4px 18px rgba(0,0,0,.28);
  max-width:min(760px, 90%);
}
.hero-title{ font-family:'Moul','Battambang',sans-serif; font-weight:normal; font-size:clamp(28px, 4.4vw, 56px); line-height:1.1; margin:0 0 16px }
.hero-cta{
  display:inline-flex; align-items:center; gap:.6rem; padding:.8rem 1.25rem;
  border-radius:14px; background:#fff; color:#0b2d1f; font-weight:800; text-decoration:none;
  box-shadow:0 10px 22px rgba(0,0,0,.18); transition:transform .15s, box-shadow .15s;
}
.hero-cta:hover{ transform:translateY(-2px); box-shadow:0 16px 32px rgba(0,0,0,.26) }

/* Icon-only hero CTA (optional) */
.hero-cta--icon{
  position:absolute; left:2rem; bottom:2rem;
  padding:0; width:52px; height:52px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background: rgba(255,255,255,.9);
  color:#0b3b2a; text-decoration:none;
  box-shadow: 0 10px 26px rgba(0,0,0,.18);
  z-index: 3;
}
.hero-cta--icon i{ font-size:1.1rem }

/* Chevron arrows (pseudo element line) */
.hero-shell{ position:relative }
.hero-nav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:74px; height:74px; z-index:3; cursor:pointer;
  background:transparent; border:0; padding:0;
}
.hero-nav::before{
  content:""; display:block; width:28px; height:28px;
  border-top:4px solid #fff; border-right:4px solid #fff;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.35));
}
.hero-prev{ left:10px }
.hero-prev::before{ transform:rotate(-135deg) } /* < */
.hero-next{ right:10px }
.hero-next::before{ transform:rotate(45deg) }   /* > */
@media (hover:hover){
  .hero-prev:hover{ transform:translate(-2px,-50%) }
  .hero-next:hover{ transform:translate(2px,-50%) }
}

/* pagination */
.hero-pagination{
  position:absolute; left:50%; bottom:14px; transform:translateX(-50%); z-index:3;
}
.hero-pagination .swiper-pagination-bullet{ width:8px; height:8px; margin:0 5px !important; background:#fff; opacity:.6 }
.hero-pagination .swiper-pagination-bullet-active{ opacity:1; transform:scale(1.2) }

@media (max-width:768px){
  .hero-cta--icon{ width:46px; height:46px; left:1rem; bottom:1rem }
  .hero-nav{ width:60px; height:60px }
  .hero-nav::before{ width:22px; height:22px; border-width:3px }
  .hero-prev{ left:6px } .hero-next{ right:6px }
  .hero-slide-content{ padding:18px }
  .hero-cta{ padding:.72rem 1rem }
}

/* ===== Hero CTA Strip (glass row) ===== */
.hero-cta-strip{
  position: absolute;
  left: 50%;
  bottom: clamp(10px, 3.5vh, 28px);
  transform: translateX(-50%);
  width: min(1240px, 94vw);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 30px 80px rgba(0,0,0,.25);
}
.cta-tile{
  position: relative; display: grid; grid-template-rows: auto 1fr;
  padding: 22px 28px 20px 28px; text-decoration: none; color: #0e2f22;
  background: rgba(255,255,255,.16);
  backdrop-filter: blur(10px) saturate(140%); -webkit-backdrop-filter: blur(10px) saturate(140%);
  border-right: 1px solid rgba(255,255,255,.28);
}
.cta-tile:last-child{ border-right:0 }
.cta-tile.cta-contact{ color:#fff; background: linear-gradient(135deg, #1e96ff 0%, #0072ff 60%, #0063d2 100%) }
.cta-top{ display:flex; align-items:center; justify-content:space-between; gap:10px }
.cta-title{ font-family:'Open Sans','Battambang',sans-serif; font-weight:800; font-size:clamp(1.05rem, 2.2vw, 1.35rem) }
.cta-go{ width:44px; height:44px; border-radius:999px; display:grid; place-items:center; background:rgba(255,255,255,.28); color:#1e2f26 }
.cta-contact .cta-go{ background:rgba(255,255,255,.18); color:#fff }
.cta-icon{ align-self:end; font-size:clamp(1.6rem, 3vw, 2.2rem); color:rgba(255,255,255,.95); text-shadow:0 6px 18px rgba(0,0,0,.18); margin-top:12px }
.cta-tile:hover{ background: rgba(255,255,255,.22) }
.cta-tile.cta-contact:hover{ filter: brightness(1.06) }
.cta-tile::after{ content:""; position:absolute; right:-1px; top:10%; bottom:10%; width:1px; background: rgba(255,255,255,.28) }
.cta-tile:last-child::after{ display:none }
.cta-contact-row{ display:flex; align-items:center; gap:12px; margin-top:14px }
.cta-phone .cta-hotline-label{ font-size:.95rem; opacity:.9; margin-bottom:2px; font-weight:700 }
.cta-phone .cta-hotline-number{ font-weight:900; font-size:clamp(1.05rem, 2.4vw, 1.35rem); letter-spacing:.4px }
@media (max-width:1024px){
  .hero-cta-strip{ width:min(1000px,94vw); grid-template-columns:repeat(2,1fr) }
  .cta-tile:nth-child(2){ border-right:0 }
}
@media (max-width:640px){
  .hero-cta-strip{
    position: static; transform:none; width:100%;
    margin: 12px auto; border-radius: 16px; grid-template-columns: 1fr; box-shadow: var(--shadow-lg);
  }
  .cta-tile{ border-right:0; border-bottom:1px solid rgba(255,255,255,.28) }
  .cta-tile:last-child{ border-bottom:0 }
  .cta-go{ width:40px; height:40px }
}

/* ===== Sections: Why choose us / Services / News ======================== */
.why-choose-us-section{ background:#fff }
.features-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(250px, 1fr)); gap:2rem; text-align:center }
.feature-item{ border-radius:var(--radius-lg); box-shadow:var(--shadow-md); transition:transform .12s, box-shadow .12s }
.feature-item h4{ font-size:1.1rem; margin:0 0 .5rem; color:var(--text-color) }
.feature-item p{ color:var(--text-color-light); margin:0; line-height:1.6; font-size:.9rem }
.feature-icon{ font-size:2.5rem; color:var(--rhac-primary-color); margin-bottom:1rem; display:block }
@media (hover:hover){ .feature-item:hover{ transform:translateY(-2px); box-shadow:var(--shadow-lg) } }

/* Services slider (cards) */
.services-section .slider-wrapper{
  background:var(--theme-light-mint-bg); padding:2.5rem 1rem; border-radius:16px; position:relative; overflow:hidden;
}
.services-section .swiper-nav-button{ top:50%; transform:translateY(-50%) }
.services-section .swiper-nav-button.prev-slide{ left:15px }
.services-section .swiper-nav-button.next-slide{ right:15px }
.homepage-services-slider.swiper{ overflow:visible !important }
.homepage-services-slider .swiper-slide{ width:300px; height:auto; opacity:.7; transform:scale(.96); transition:transform .28s ease, opacity .28s ease }
.homepage-services-slider .swiper-slide-active{ opacity:1; transform:scale(1) }
.homepage-services-slider .swiper-slide-active .service-item{ border:2px solid var(--rhac-primary-color); box-shadow:0 10px 26px rgba(0,146,69,.16) }
.services-section .service-item{
  display:flex; flex-direction:column; justify-content:center;
  background:#fff; padding:1.5rem; border-radius:12px; border:2px solid #fff; box-shadow:0 5px 20px rgba(0,0,0,.05);
  text-decoration:none; height:100%; transition:all .3s;
}
.services-section .service-item-header{ display:flex; align-items:center; margin-bottom:.75rem }
.services-section .service-icon{ font-size:2rem; color:var(--rhac-primary-color); margin-right:.75rem }
.services-section .service-item-header h4{
  font-family:'Battambang',sans-serif; font-weight:700; font-size:1.1rem; line-height:1.4; margin:0; text-align:left;
}
.services-section .service-item-description{
  display:block; font-family:'Siemreap',sans-serif; font-size:.9rem; color:var(--text-color-light); line-height:1.5; margin:0; text-align:left;
}

/* Services page grid */
.services-page-background{ background:var(--theme-light-mint-bg); padding:3rem 1rem 4rem }
.services-main-title{
  font-family:'Moul',sans-serif; font-weight:normal; text-align:center; font-size:2.2rem; color:var(--rhac-primary-color);
  margin:0 auto 3rem; position:relative; padding-bottom:1rem;
}
.services-main-title::after{ content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:60px; height:3px; background:var(--rhac-primary-color) }
.services-page-background .services-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem }
.services-page-background .service-item{
  display:flex; align-items:center; background:#fff; padding:1.25rem; border-radius:12px; border:1px solid #e9ecef;
  box-shadow:0 4px 15px rgba(0,0,0,.05); text-decoration:none; transition:all .3s; min-height:80px;
}
@media (hover:hover){ .services-page-background .service-item:hover{ transform:translateY(-5px); box-shadow:var(--shadow-lg); border-color:#ddd } }
.services-page-background .service-item .icon{ margin-right:1rem; width:40px; text-align:center; flex-shrink:0 }
.services-page-background .service-item .icon i{ font-size:1.8rem; color:var(--rhac-primary-color) }
.services-page-background .service-item .icon img{ max-width:100%; height:auto; vertical-align:middle }
.services-page-background .service-item .pep-icon{
  font-size:.8rem; font-weight:700; border:2px solid var(--rhac-primary-color); color:var(--rhac-primary-color);
  padding:.2rem; border-radius:4px; line-height:1;
}
.services-page-background .service-item .text{
  font-family:'Battambang',sans-serif; color:var(--text-color); font-size:1rem; font-weight:600; line-height:1.5;
}

/* Providers & News */
.providers-section{ background:#fff }
.news-section{ background:var(--theme-light-mint-bg) }
.news-section .news-card{ background:#fff; box-shadow:var(--shadow-md) }
.doctor-profile{ text-align:center }
.doctor-profile img{ width:130px; height:130px; border-radius:50%; object-fit:cover; margin-bottom:1rem }
.doctor-profile h4{ font-weight:600; color:var(--text-color); margin:0 0 .25rem; font-size:1rem }
.doctor-profile p{ color:var(--text-color-light); font-size:.9rem; margin:0 }
.news-card{
  background:#fff; border-radius:8px; overflow:hidden; display:flex; flex-direction:column;
  text-decoration:none; transition:transform .3s; box-shadow:var(--shadow-md);
}
.news-card:hover{ transform:translateY(-5px) }
.news-card img{ width:100%; height:160px; object-fit:cover }
.news-card .card-body{ padding:1.5rem; display:flex; flex-direction:column; flex-grow:1; text-align:left }
.news-card .news-meta{ font-size:.8rem; color:var(--text-color-light); margin-bottom:1rem }
.news-card h4{ font-size:1.1rem; line-height:1.4; color:var(--text-color); margin-bottom:.5rem; flex-grow:1; font-weight:600 }
.news-card .news-excerpt{ font-size:.9rem; color:var(--text-color-light); margin-bottom:1rem; line-height:1.6 }
.news-card .read-more{ color:var(--rhac-primary-color); text-decoration:none; font-weight:600; font-size:.9rem; margin-top:auto }

/* Slider chrome (generic) */
.slider-wrapper{ position:relative }
.swiper{ width:100%; height:100%; padding:10px 0 }
.swiper-slide{ text-align:center; font-size:18px; background:transparent; display:flex; justify-content:center; align-items:stretch; height:auto }
.swiper-slide .doctor-profile,
.swiper-slide .news-card,
.swiper-slide .service-item,
.swiper-slide .styled-clinic-card{ height:100%; width:100% }
.swiper-nav-button{
  position:absolute; top:40%; transform:translateY(-50%);
  width:42px; height:42px; border-radius:12px; background:#fff; border:1px solid var(--border-color);
  cursor:pointer; color:#2e2e2e; transition:color .3s; z-index:10; box-shadow:var(--shadow-md);
}
.swiper-nav-button:hover{ color:var(--rhac-primary-color) }
.swiper-nav-button.prev-slide{ left:-40px }
.swiper-nav-button.next-slide{ right:-40px }
.swiper-nav-button i{ font-size:1.5rem }

/* ==========================================================================
   CLINIC MAP (slider + compact card)
   ========================================================================== */
.clinic-map-section .slider-wrapper{ background:var(--theme-light-mint-bg); padding:3rem 2.5rem; border-radius:16px }
.clinic-card-compact{
  background:#fff; border-radius:12px; padding:2rem; border:2px solid var(--theme-light-mint-bg);
  box-shadow:0 5px 20px rgba(0,0,0,.07); display:flex; flex-direction:column; height:auto; transition:transform .12s, box-shadow .12s;
}
@media (hover:hover){ .clinic-card-compact:hover{ transform:translateY(-3px); box-shadow:rgba(0,146,69,.15) 0 4px 8px, rgba(0,146,69,.2) 0 0 0 3px } }
.clinic-card-compact .card-body-compact{ flex-grow:1 }
.clinic-card-compact .card-header-compact{ display:flex; align-items:center; margin-bottom:1.5rem }
.clinic-card-compact .icon-wrapper-compact i{ font-size:2rem; color:var(--rhac-primary-color); margin-right:.75rem }
.clinic-card-compact .title-compact{ font-family:'Open Sans',sans-serif; font-weight:700; font-size:1.1rem; color:var(--text-color); margin:0 }
.clinic-card-compact .detail-item-compact{ display:flex; align-items:flex-start; font-size:.9rem; color:var(--text-color-light); line-height:1.5; margin:0 0 .75rem }
.clinic-card-compact .detail-item-compact i{ color:var(--rhac-primary-color); margin-right:.5rem; margin-top:3px; width:16px; text-align:center }
.clinic-card-compact .detail-item-compact a{ color:var(--rhac-primary-color); font-weight:600 }
.clinic-card-compact .card-footer-compact{ margin-top:1rem; text-align:left }
.homepage-clinics-slider.swiper{ padding:0 !important }

/* Map-style button */
.clinic-map-link{
  display:inline-flex; align-items:center; justify-content:center; background:#fff;
  border:1px solid #d9e6df; border-radius:30px; padding:8px 16px; text-decoration:none; transition:background-color .2s, border-color .2s, box-shadow .2s;
  align-self:flex-start; margin-top:auto; box-shadow:0 2px 8px rgba(0,0,0,.04);
}
.clinic-map-link:hover{ background:#f6fffa; border-color:#cce9db }
.clinic-map-link img{ height:20px; margin-right:8px }
.clinic-map-link span{ font-size:1rem; font-weight:600; color:var(--text-color); line-height:1 }
body.lang-km .clinic-map-link span{ font-family:'Battambang',sans-serif; font-weight:700; font-size:1.1rem }

/* ==========================================================================
   RESPONSIVE TWEAKS FOR PAGES (non-nav)
   ========================================================================== */
@media (max-width:992px){
  .location-grid{ grid-template-columns:1fr }
  .footer-container{ grid-template-columns:repeat(2,1fr); gap:2rem }

  .booking-card .submit-btn{ width:100% }
  .form-group[style*="margin-top: 2rem;"]{ text-align:center }

  .services-section .services-grid{ grid-template-columns:repeat(3,1fr); gap:.75rem }
  .services-section .service-item{ flex-direction:column; justify-content:center; align-items:center; text-align:center; padding:1.25rem .5rem; min-height:120px; gap:0 }
  .services-section .service-icon{ margin-right:0; margin-bottom:.75rem; font-size:2rem; color:#333 }
  .services-section .service-item-text h4{ font-size:.8rem; line-height:1.4; font-weight:600; font-family:'Battambang',sans-serif }
  .services-section .service-item-text p{ display:none }
}

@media (max-width:768px){
  .container{ padding:0 .5rem }
  .footer-container{ grid-template-columns:1fr; text-align:left }
  .providers-section .swiper-nav-button, .news-section .swiper-nav-button{ display:none }

  .services-section .services-grid{ gap:.8rem }
  .services-section .service-item{ padding:.8rem; gap:.75rem }
  .services-section .service-icon{ font-size:1.3rem }
  .services-section .service-item-text h4{ font-size:.95rem }
  .services-section .service-item-text p{ font-size:.85rem }

  .medical-theme-home .homepage-section:last-of-type{ padding-bottom:0 }
  .footer-bottom{ margin-top:.1rem }
  .footer-container{ gap:.7rem }
  .footer-col h3{ margin-bottom:.5rem }
  .footer-col p{ margin-bottom:.6rem }

  .location-card{ flex-direction:column }
  .location-image-wrapper{ height:200px }
  .hero-image{ height:200px; margin-bottom:2rem }
  .booking-card .card-header{ padding:1rem 1.25rem }
  .booking-card .card-body{ padding:.5rem 1.25rem 1.5rem }
  .booking-card .card-title{ font-size:1.3rem }
  .form-control-line{ font-size:16px } /* prevent iOS zoom */

  .page-content .page-title{ font-size:1.8rem }
  .page-content p{ font-size:1rem; line-height:1.8; text-align:left }

  /* Services list style on phones */
  .services-section .services-grid{ grid-template-columns:1fr; gap:1.5rem }
  .services-section .service-item{
    flex-direction:row; align-items:flex-start; text-align:left; padding:0; background:none; border:0; box-shadow:none; min-height:0;
  }
  .services-section .service-icon{ font-size:1.5rem; color:var(--rhac-primary-color); margin-bottom:0 }
  .services-section .service-item-text h4{ font-size:1rem; font-family:'Open Sans',sans-serif }
  .services-section .service-item-text p{ display:block; font-size:.9rem }
  .services-page-background .services-grid{ grid-template-columns:1fr; gap:1rem }
}

/* ==========================================================================
   ACCESSIBILITY / MISC
   ========================================================================== */
a:focus-visible, button:focus-visible{ outline:3px solid rgba(0,146,69,.35); outline-offset:2px }
.sr-only{
  position:absolute !important; height:1px; width:1px; overflow:hidden; clip:rect(1px,1px,1px,1px);
  white-space:nowrap; border:0; padding:0; margin:-1px;
}
@media (prefers-reduced-motion:reduce){
  *{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important }
}

/* ==========================================================================
   CSS-ONLY CALL MODAL (:target)
   ========================================================================== */
.call-modal-overlay{
  position: fixed; inset: 0; z-index: 1000;
  background: rgba(0,0,0,.35);
  display: none;            /* hidden by default */
  place-items: center;
}
.call-modal-overlay:target{ display: grid }  /* show when URL hash matches */

.call-modal{
  position: relative;
  width: min(560px, 92vw);
  background: #fff;
  border: 1px solid #e7efe9;
  border-radius: 16px;
  box-shadow: 0 20px 60px rgba(0,0,0,.18);
  overflow: visible;        /* allow floating close button */
}
.call-modal-close{
  position: absolute;
  top: -14px; right: -14px;
  width: 36px; height: 36px; border-radius: 50%;
  border: 1px solid #e9f0ea; background:#fff; color:#222;
  display:inline-flex; align-items:center; justify-content:center;
  text-decoration:none; box-shadow: 0 8px 18px rgba(0,0,0,.12);
}
.call-modal-close:hover{ background:#f7fff9; border-color:#d9eadf }
@media (max-width:520px){
  .call-modal-close{ top:-12px; right:-12px; width:32px; height:32px }
}
.call-modal-header{ padding:18px 20px 8px }
.call-modal-subtitle{ margin:0 0 6px; color:#4b5b55; font-size: clamp(.9rem, 1.6vw, 1rem) }
#callModalTitle{ margin:0; font-size: clamp(1rem, 1.8vw, 1.15rem); color:#0f3b28; font-family:'Moul','Battambang',sans-serif; font-weight:normal }
.call-modal-body{ padding:8px 16px 18px }
.call-options{ list-style:none; margin:0; padding:0; display:grid; gap:14px }
.call-option{
  display:flex; align-items:center; gap:16px; padding:12px;
  border:2px solid var(--rhac-primary-color); border-radius:14px; background:#fff; text-decoration:none;
  transition:transform .12s, box-shadow .12s, border-color .12s, background-color .12s;
}
.call-option:hover{ transform:translateY(-1px); background:#f7fff9; box-shadow:0 10px 22px rgba(0,146,69,.12); border-color:var(--rhac-primary-hover) }
.carrier-badge{ min-width:110px; height:44px; border-radius:10px; color:#fff; font-weight:800; display:flex; align-items:center; justify-content:center; text-transform:none; letter-spacing:.2px; font-size:1rem }
.carrier--smart{ background:#00a651 } .carrier--cellcard{ background:#f7a600 } .carrier--metfone{ background:#0a8d6f }
.call-option .number{ font-size:1.25rem; font-weight:800; color:#0b2d1f; letter-spacing:.4px; font-family:'Battambang','Open Sans',sans-serif }
.call-modal-footer{ border-top:1px solid #eef3ef; padding:10px 16px; background:#fbfffd }
.call-modal-footer .hint{ margin:0; color:#4b5b55; font-size:.95rem }

/* ==========================================================================
   SEARCH OVERLAY (popup)
   ========================================================================== */
.search-submit-btn{ background:none; border:0; padding:0; margin:0; display:inline-flex; align-items:center; cursor:pointer; line-height:0 }

.rhac-search-overlay{
  position: fixed; inset: 0; z-index: 1100;
  background: rgba(0,0,0,.38);
  display: grid; place-items: start center;
}
.rhac-search-overlay[hidden],
.rhac-search-overlay[aria-hidden="true"]{ display: none !important; }

.rhac-search-panel{
  width: min(1200px, 94vw);
  margin-top: clamp(12px, 4vh, 32px);
  background: #fff; border-radius: 16px;
  border: 1px solid #e7efe9;
  box-shadow: 0 22px 60px rgba(0,0,0,.18);
  overflow: hidden;
}

/* top bar */
.rhac-search-topbar{
  position: sticky; top: 0; z-index: 1;
  background: #fff; padding: 12px 16px; display: grid;
  grid-template-columns: auto 1fr; gap: 12px; align-items: center;
  border-bottom: 1px solid #eef3ef;
}
.rhac-search-close{
  width: 38px; height: 38px; border-radius: 10px;
  border: 1px solid #e9f0ea; background: #fff; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  color: #1f2a24;
}
.rhac-search-close:hover{ background: #f7fff9; border-color: #d9eadf }

/* searchbar */
.rhac-searchbar{
  display: flex; align-items: center; gap: .6rem;
  height: 46px; border: 2px solid #c7cfd7; border-radius: 999px;
  padding: 0 .9rem; background: #fff;
  transition: border-color .15s, box-shadow .15s;
}
.rhac-searchbar i{ color:#5f758a; font-size:1rem }
.rhac-searchbar input{
  flex:1; border:0; outline:0; background:transparent; font-size:1.02rem;
  font-family:'Battambang','Open Sans',sans-serif; color:#1c2731;
}
.rhac-searchbar:focus-within{ border-color: var(--rhac-primary-color); box-shadow: 0 0 0 3px rgba(0,146,69,.18) }
.rhac-search-clear{ background: transparent; border: 0; font-size: 1.3rem; line-height: 0; cursor: pointer; color: #61707a; padding: 0 .2rem }

/* body */
.rhac-search-content{ padding: 18px 18px 26px }
.rhac-search-h3{ margin: 0 0 10px; font-size: 1.05rem; color: #2f453a; font-weight: 800; font-family: 'Open Sans',sans-serif }

/* chips */
.rhac-chip-row{ display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 16px }
.rhac-chip{
  display:inline-flex; align-items:center; height: 32px; padding: 0 12px;
  background:#f6fffa; border:1px solid #d9eadf; color:#0c3b28;
  border-radius:999px; text-decoration:none; font-weight:700; font-size:.92rem;
}
.rhac-chip:hover{ background:#eafff3; border-color:#c8e7d7 }

/* banner and cards (placeholders) */
.rhac-search-banner{ margin: 8px 0 20px }
.rhac-banner{ height: 180px; border-radius: 12px; background: linear-gradient(135deg,#f2e6d6,#fff); border:1px solid #efe7db }
.rhac-card-grid{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px }
.rhac-card{ display: block; background:#fff; border:1px solid #e9ecef; border-radius:12px; text-decoration:none; box-shadow: var(--shadow-md); overflow: hidden }
.rhac-card:hover{ box-shadow: var(--shadow-lg) }
.rhac-card-img{ height:120px; background:#e9efe9 }
.rhac-card-title{ padding:.75rem .9rem; color:#1b2d22; font-weight:700; font-size:.96rem }
@media (max-width:900px){ .rhac-card-grid{ grid-template-columns: repeat(2,1fr) } }
@media (max-width:560px){
  .rhac-card-grid{ grid-template-columns: 1fr }
  .rhac-search-panel{ width: 100vw; height: 100vh; margin: 0; border-radius: 0 }
  .rhac-search-content{ padding: 14px }
}
/* ===== Submenu: Khmer Moul “light” look ===== */
/* Targets your dropdown links only */
.submenu a,
.submenu [role="menuitem"]{
  font-family: 'Moul', 'Moulpali', 'Battambang', 'Open Sans', system-ui, sans-serif;
  font-weight: 400;          /* Moul ships as a single weight; this gives a light feel */
  font-size: 1.02rem;        /* comfy Khmer size; tweak 0.96–1.06rem to taste */
  line-height: 1.25;
  letter-spacing: 0;         /* keep Khmer crisp */
  text-transform: none;      /* never uppercase Khmer */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Optional: parent item “Health News” too (if it’s Khmer) */
.nav-menu > .nav-item > a{
  font-family: 'Moul', 'Moulpali', 'Battambang', 'Open Sans', system-ui, sans-serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
}

/* Tighter submenu padding to suit the lighter Khmer style */
.submenu{
  padding: 6px;
}
.submenu a{
  padding: .55rem .75rem;
  border-radius: 10px;
}

/* Keep hover nice and readable */
.submenu a:hover{
  background: #f6fff9;
  color: var(--rhac-primary-color);
}

/* If your site toggles Khmer with a body class, keep it explicit */
body.lang-km .submenu a,
body.lang-km .nav-menu > .nav-item > a{
  font-family: 'Moul', 'Moulpali', 'Battambang', 'Open Sans', system-ui, sans-serif;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
}
/* Khmer font utility */
:root {
  --kh-font: "Battambang", "Noto Sans Khmer", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.kh-font {
  font-family: var(--kh-font);
  font-weight: 700;               /* looks nicer for buttons */
  letter-spacing: 0.1px;
}
.post-body h2 {
  color: #178a53;         /* pick any color you like */
  font-weight: 700;
}
/* Ensure card body can right-align the CTA */
.news-card .card-body {
  display: flex;
  flex-direction: column;
}

/* Khmer font helper (if not already defined) */
.kh-font {
  font-family: "Battambang", "Noto Sans Khmer", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* Right-aligned, green CTA with arrow */
.read-more-cta {
  align-self: flex-end;            /* push to the right */
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  font-weight: 700;
  letter-spacing: .1px;
  color: #14a44d;                  /* green text */
  text-decoration: none;           /* parent <a> handles hover */
}

/* Optional hover effect (the whole card is a link) */
.news-card:hover .read-more-cta {
  color: #0d8e3e;
}

.read-more-cta svg {
  display: block;
  color: currentColor;             /* arrow follows text color */
}
/* ---------- Palette & Khmer font ---------- */
:root{
  --brand-green: #14a44d;
  --brand-green-dk: #0d8e3e;
  --ink: #0b3b2a;
  --muted: #6b7e76;
  --card-border: #eaf3ef;
  --card-shadow: 0 6px 22px rgba(11, 59, 42, .10);
  --card-shadow-hover: 0 14px 34px rgba(11, 59, 42, .18);
}
.kh-font{
  font-family: "Battambang","Noto Sans Khmer",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

/* ---------- Slider sizing (3 per row on desktop) ---------- */
.news-slider .swiper-slide{
  width: 100%;
}
@media (min-width: 640px){
  .news-slider .swiper-slide{ width: 48%; }
}
@media (min-width: 1024px){
  .news-slider .swiper-slide{ width: 31.5%; }
}

/* ---------- Card ---------- */
.news-card{
  display: block;
  background: #fff;
  border: 1px solid var(--card-border);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: var(--card-shadow);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.news-card:hover{
  transform: translateY(-2px);
  box-shadow: var(--card-shadow-hover);
  border-color: rgba(20,164,77,.25);
}

/* image */
.news-card-img{
  width: 100%;
  aspect-ratio: 16/9;      /* keeps the nice 16:9 crop */
  object-fit: cover;
  display: block;
}

/* body */
.news-card .card-body{
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 16px 18px 14px;
}

/* title */
.news-card .h5{
  margin: 0 0 6px;
  color: var(--ink);
  line-height: 1.32;
  font-weight: 700;
}
html[lang="km"] .news-card .h5{ font-family: "Battambang","Noto Sans Khmer",sans-serif; }

/* meta row */
.news-meta{
  display: flex;
  flex-wrap: wrap;
  gap: 14px 18px;
  color: var(--muted);
  font-size: .95rem;
}
.news-meta .meta{
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.news-meta .meta i,
.news-meta .meta svg{
  opacity: .9;
}

/* excerpt */
.news-excerpt{
  margin-top: 4px;
  color: #40544d;
  line-height: 1.6;
  font-size: .96rem;
}

/* read-more (right aligned with arrow) */
.read-more-cta{
  align-self: flex-end;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  font-weight: 700;
  color: var(--brand-green);
  letter-spacing: .05px;
  text-decoration: none;   /* parent <a> is the link */
}
.read-more-cta svg{
  display: block;
  color: currentColor;
}
.news-card:hover .read-more-cta{ color: var(--brand-green-dk); }
/* Use Siemreap for Khmer pages’ excerpts */
html[lang="km"] .news-excerpt{
  font-family: "Siemreap", "Noto Sans Khmer", system-ui, -apple-system, "Segoe UI",
               Roboto, "Helvetica Neue", Arial, sans-serif;
  line-height: 1.75;     /* looks nicer with Siemreap */
}
/* Layout */
.news-detail{ padding: 24px 0 40px; }
.news-grid{
  display: grid;
  grid-template-columns: minmax(0,1fr);
  gap: 22px;
}
@media (min-width: 1024px){
  .news-grid{
    grid-template-columns: minmax(0,2fr) minmax(280px,1fr);
    gap: 28px;
  }
}

/* Article */
.article-col{ min-width: 0; }
.article-hero img{
  width: 100%;
  height: auto;
  border-radius: 16px;
  box-shadow: 0 10px 28px rgba(11,59,42,.12);
  display: block;
}
.article-header{ margin-top: 14px; }
.article-title{
  margin: 0 0 6px;
  color: #0b3b2a;
  line-height: 1.28;
  font-weight: 800;
}
.article-meta{
  display: flex; flex-wrap: wrap;
  gap: 10px 16px; margin: 6px 0 16px;
  list-style: none; padding: 0;
  color: #6b7e76; font-size: .95rem;
}
.article-meta .item{ display: inline-flex; align-items: center; gap: 8px; }

.article-body{
  color: #29453c;
  line-height: 1.8;
}
.article-body h2, .article-body h3 { color: #0b3b2a; margin-top: 1.4em; }
.article-body h2 { border-left: 6px solid #14a44d; padding-left: 10px; }
.article-body ul { padding-left: 1.25rem; }

/* Sidebar */
.aside-col{ min-width: 0; }
.aside-card{
  background: #fff;
  border: 1px solid #eaf3ef;
  border-radius: 14px;
  box-shadow: 0 6px 22px rgba(11,59,42,.08);
  padding: 14px;
}
.aside-card + .aside-card{ margin-top: 14px; }
.aside-title{
  margin: 2px 2px 10px; font-weight: 800; color: #0b3b2a;
}
.aside-list{ display: flex; flex-direction: column; gap: 10px; }

/* Latest post item */
.aside-item{
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 10px;
  padding: 8px;
  border-radius: 10px;
  text-decoration: none;
  border: 1px solid #edf5f1;
  transition: background .2s ease, border-color .2s ease;
}
.aside-item:hover{ background: #f7fffb; border-color: rgba(20,164,77,.35); }
.aside-item .thumb{
  width: 100%; height: 68px; object-fit: cover; border-radius: 8px;
}
.aside-item .meta{ min-width: 0; }
.aside-item .title{
  color: #163d30; font-weight: 700; line-height: 1.35;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
}
.aside-item .date{ color: #6b7e76; font-size: .9rem; margin-top: 4px; }

/* Quick links */
.quick-links{ list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.quick-links a{
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: 10px;
  text-decoration: none; color: #0b3b2a; background: #f8fffb; border: 1px solid #eaf3ef;
}
.quick-links a:hover{ background: #effcf6; border-color: rgba(20,164,77,.35); color: #0d8e3e; }
.quick-links i{ color: #14a44d; }

/* Khmer fonts for better look */
.kh-font{ font-family: "Battambang","Noto Sans Khmer",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif; }
html[lang="km"] .article-body{ font-family: "Siemreap","Noto Sans Khmer",sans-serif; }

