﻿
/* tokens.css */
/* front/tokens.css â€” design tokens */
:root{
  --mh-primary:#0f3a4f;
  --mh-primary-soft:#134E66;
  --mh-accent:#0e7490;
  --mh-accent-2:#0369a1;
  --mh-bg:#f4f6f8;
  --mh-card:#ffffff;
  --mh-border:#e2e8f0;
  --mh-border-soft:#edf1f5;
  --mh-text:#1e293b;
  --mh-muted:#64748b;
  --mh-link:#0f3a4f;
  --mh-link-hover:#0e7490;
  --mh-radius:14px;
  --mh-radius-sm:10px;
  --mh-gap:20px;
  --mh-container:1200px;
  --mh-font:"Tajawal","IBM Plex Sans Arabic","Noto Naskh Arabic",Tahoma,system-ui,sans-serif;
  --mh-shadow:0 1px 2px rgba(0,0,0,.06), 0 8px 24px rgba(0,0,0,.07);
  --mh-shadow-lg:0 12px 32px rgba(0,0,0,.14);
}


/* base.css */
/* front/base.css */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body.mh-home{
  background: var(--mh-bg) !important;
  font-family: var(--mh-font) !important;
  color: var(--mh-text);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body.mh-home a{color:var(--mh-link); text-decoration:none}
body.mh-home a:hover{color:var(--mh-link-hover); text-decoration:none}
body.mh-home img{max-width:100%; height:auto}
.mh-skip{
  position:absolute; right:-9999px; top:auto; width:1px; height:1px; overflow:hidden;
}
.mh-skip:focus{right:12px; top:10px; width:auto; height:auto; background:var(--mh-primary); color:#fff; padding:8px 12px; border-radius:8px; z-index:9999}
.mh-container{
  max-width: var(--mh-container);
  margin-inline:auto;
  padding-inline:16px;
  width:100%;
}
@media(min-width:768px){ .mh-container{padding-inline:20px} }
body.mh-home #table1, body.mh-home #table2{max-width:100%; width:100% !important}
body.mh-home #table1{border:none !important; height:auto !important}
body.mh-home #table1 img{width:100%; height:auto; display:block}
body.mh-home #table2{background: var(--mh-primary) !important; height:auto !important; background-image:none !important}
body.mh-home[background]{background-image:none !important}


/* header.css */
/* front/header.css â€” FIXED logo: fully visible, centered, no crop */
.mh-header{background: #061e2e; border-bottom:1px solid #0e4a6b; overflow:visible; position:relative; z-index:110}
.mh-header__top{
  padding:10px 16px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: #061e2e;
}
@media(min-width:768px){ .mh-header__top{padding:12px 20px} }
.mh-logo{
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:0;
  width:100%;
  max-width:860px;
  margin-inline:auto;
  background: transparent;
}
.mh-logo img{
  width:100%;
  height:auto;
  max-width:770px;
  max-height:150px;
  aspect-ratio:auto;
  object-fit:contain;
  object-position:center;
  display:block;
}
@media(min-width:1400px){ .mh-logo img{max-height:165px} }
@media(max-width:768px){ .mh-logo img{max-height:125px} }
@media(max-width:576px){ .mh-logo img{max-height:105px} }


/* nav.css */
/* front/nav.css â€” top navigation */
.mh-topnav{
  background: linear-gradient(180deg, var(--mh-primary) 0%, var(--mh-primary-soft) 100%);
  border-bottom:1px solid #0e4a6b;
  position:sticky; top:0; z-index:120;
  box-shadow:0 2px 10px rgba(0,0,0,.18);
  overflow:visible;
}
.mh-topnav__bar{
  display:flex; align-items:center; gap:10px;
  min-height:52px;
  justify-content:space-between;
}
.mh-topnav__toggle{
  display:none; align-items:center; gap:8px;
  background: rgba(255,255,255,.12);
  color:#fff; border:1px solid rgba(255,255,255,.18);
  padding:8px 14px; border-radius:999px;
  font:700 14px var(--mh-font); cursor:pointer;
  transition: background .18s;
}
.mh-topnav__toggle:hover{background:rgba(255,255,255,.18)}
.mh-topnav__toggle:focus-visible{outline:2px solid #38bdf8; outline-offset:2px}
.mh-topnav__list{
  display:flex; align-items:center; gap:4px;
  list-style:none; margin:0; padding:0;
  flex:1;
}
.mh-topnav__item{position:relative}
.mh-topnav .mh-topnav__link{
  display:flex; align-items:center; gap:6px;
  padding:10px 14px; color:#eef6fb !important; border-radius:999px;
  font:700 13.5px var(--mh-font); letter-spacing:.1px;
  transition: background .18s, color .18s, transform .18s;
  white-space:nowrap; text-shadow:0 1px 2px rgba(0,0,0,.35);
}
.mh-topnav .mh-topnav__link:hover, .mh-topnav .mh-topnav__link:focus-visible{
  background: rgba(255,255,255,.16) !important; color:#ffffff !important; outline:0;
}
body.mh-home .mh-topnav a{color:#eef6fb}
body.mh-home .mh-topnav a:hover{color:#ffffff}
.mh-topnav__link[aria-haspopup]{
  gap:8px;
}
.mh-topnav__link[aria-haspopup]::after{
  content:"";
  width:14px; height:14px;
  flex:0 0 14px;
  display:inline-block;
  margin-inline-start:1px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4.5 6.5L8 10L11.5 6.5' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4.5 6.5L8 10L11.5 6.5' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
  opacity:.82;
  transition: transform .2s cubic-bezier(.4,0,.2,1), opacity .15s;
  transform-origin: center;
}
.mh-topnav .mh-topnav__link[aria-haspopup]:hover::after,
.mh-topnav .mh-topnav__link[aria-haspopup]:focus-visible::after{
  opacity:1;
}
.mh-topnav__item.is-open > .mh-topnav__link[aria-haspopup]::after{
  transform: rotate(180deg);
  opacity:1;
}
.mh-submenu{
  position:absolute; top:calc(100% + 8px); inset-inline-start:0;
  min-width:240px; max-width:min(92vw, 320px);
  background:var(--mh-card); border:1px solid var(--mh-border);
  border-radius:12px; box-shadow:var(--mh-shadow-lg);
  padding:6px; list-style:none; margin:0;
  opacity:0; transform: translateY(8px) scale(.98);
  pointer-events:none; transition: opacity .18s ease, transform .18s ease;
  z-index:200;
}
.mh-submenu::before{
  content:""; position:absolute; top:-6px; inset-inline-start:22px;
  width:10px; height:10px; background:var(--mh-card);
  border-left:1px solid var(--mh-border); border-top:1px solid var(--mh-border);
  transform: rotate(45deg);
}
.mh-submenu li+li{margin-top:1px}
.mh-submenu a{
  display:block; padding:9px 12px; color:var(--mh-text) !important;
  border-radius:8px; font:500 13.5px var(--mh-font);
  transition: background .15s, color .15s;
}
.mh-submenu a:hover, .mh-submenu a:focus-visible{
  background:#f1f5f9; color:var(--mh-link-hover) !important; outline:0;
}
@media(min-width:768px){
  .mh-topnav__item:hover > .mh-submenu,
  .mh-topnav__item:focus-within > .mh-submenu,
  .mh-topnav__item.is-open > .mh-submenu{
    opacity:1; transform:none; pointer-events:auto;
  }
}
/* Header search */
.mh-search{ display:flex; align-items:center; gap:8px; flex:0 0 auto }
.mh-search input[type="text"]{
  min-width:180px; max-width:260px; width:22vw;
  padding:8px 12px; border:1px solid rgba(255,255,255,.22);
  border-radius:999px; background:rgba(255,255,255,.10);
  color:#fff; font:500 13px var(--mh-font);
  outline:0; transition: background .18s, border-color .18s, width .18s;
}
.mh-search input[type="text"]::placeholder{color:rgba(255,255,255,.72)}
.mh-search input[type="text"]:focus{background:rgba(255,255,255,.16); border-color:rgba(255,255,255,.34); width:26vw}
.mh-search input[type="submit"], .mh-search button{
  padding:8px 16px; border-radius:999px; border:0;
  background:#fff; color:var(--mh-primary); font:800 13px var(--mh-font);
  cursor:pointer; transition: transform .15s, box-shadow .15s;
}
.mh-search input[type="submit"]:hover, .mh-search button:hover{transform:translateY(-1px); box-shadow:0 4px 12px rgba(0,0,0,.18)}

/* Mobile topnav â€” â‰¤991 unified drawer handles it; keep â‰¤767 legacy hidden */
@media(max-width:991px){
  .mh-topnav__toggle{display:none !important}
  .mh-topnav__list{display:none !important}
  .mh-search{display:none !important}
}
@media(max-width:767px){
  .mh-topnav__bar{flex-wrap:wrap}
  .mh-topnav__item{width:100%}
  .mh-topnav .mh-topnav__link{width:100%; justify-content:space-between; background:rgba(255,255,255,.06)}
  .mh-submenu{
    position:static; box-shadow:none; border:1px solid #e2e8f0;
    background:#ffffff; margin:6px 0 0; padding:6px;
    opacity:1; transform:none; pointer-events:auto;
    display:none; max-width:none; border-radius:12px;
  }
  .mh-submenu::before{display:none}
  .mh-submenu a{color:#1e293b !important; background:#fff}
  .mh-submenu a:hover{background:#f1f5f9 !important; color:#0f3a4f !important}
  .mh-topnav__item.is-open > .mh-submenu{display:block}
}
@media(min-width:768px) and (max-width:991px){
  .mh-search input[type="text"]{max-width:200px}
}


/* layout.css */
/* front/layout.css â€” modern grid (replaces TABLE#table3) */
.mh-container--layout{padding-top:0; padding-bottom:0}
.mh-layout{
  display:grid; grid-template-columns: 1fr; gap:var(--mh-gap);
  padding-block:18px 24px;
  align-items:start;
}
.mh-layout__sidebar{min-width:0}
.mh-layout__main{min-width:0; display:flex; flex-direction:column}
@media(min-width:992px){
  .mh-layout{ grid-template-columns: 280px 1fr; gap:22px; }
  .mh-layout__sidebar{position:sticky; top:72px; align-self:start}
}
@media(min-width:1280px){
  .mh-layout{ grid-template-columns: 300px 1fr; }
}
.mh-layout-legacy-wrapper{max-width:100%; overflow:visible}
body.mh-home #table3{width:100% !important; max-width:100% !important; table-layout:fixed}
body.mh-home .mh-layout-legacy-wrapper{overflow:hidden; border-radius:var(--mh-radius); box-shadow:var(--mh-shadow)}
.mh-legacy-table{display:none !important}

/* Main cell â€” replaces inline style on TD#mh-main */
.mh-main-cell{vertical-align:top; background:#f4f6f8; padding:0; border:none}
.mh-main{padding:16px; display:flex; flex-direction:column; gap:18px; min-width:0}
.mh-empty{padding:16px; color:#64748b; text-align:center; background:#fff; border:1px solid var(--mh-border); border-radius:var(--mh-radius)}
.mh-card__item--empty{color:#64748b; justify-content:center}


/* sidebar.css */
/* front/sidebar.css â€” desktop sticky, mobile off-canvas with hamburger as first item */
.mh-sidebar{position:relative; display:flex; flex-direction:column; gap:16px; padding:14px}
.mh-sidebar-td{background:#f4f6f8; border-left:1px solid #e2e8f0; vertical-align:top}
.mh-sidecard{
  background:var(--mh-card); border:1px solid var(--mh-border);
  border-radius:var(--mh-radius); box-shadow:var(--mh-shadow);
  padding:10px; overflow:hidden;
}
.mh-sidecard__title{
  font:800 14px var(--mh-font); color:var(--mh-primary-soft);
  padding:10px 12px 8px; margin:0 0 6px; border-bottom:1px solid var(--mh-border);
  display:flex; align-items:center; gap:8px;
}
.mh-sidecard__nav{display:flex; flex-direction:column; gap:4px; padding:4px 0}
.mh-sidecard__link{
  display:flex; align-items:center; gap:10px;
  padding:11px 12px; border-radius:var(--mh-radius-sm);
  color:var(--mh-text) !important; font:600 13.5px var(--mh-font);
  transition: background .15s, color .15s, transform .15s;
  border:1px solid transparent;
}
.mh-sidecard__link:hover{ background:#eef4f8; color:var(--mh-primary) !important; transform: translateX(-2px)}
.mh-sidecard__link:focus-visible{outline:2px solid #38bdf8; outline-offset:2px}
.mh-sidecard__link.is-active{background:var(--mh-primary); color:#fff !important}
.mh-sidecard__icon{width:20px; height:20px; display:inline-flex; align-items:center; justify-content:center; font-size:15px; flex:0 0 20px; opacity:.9}
.mh-banners{display:flex; flex-direction:column; gap:12px}
.mh-banners a{display:block; background:var(--mh-card); border:1px solid var(--mh-border); border-radius:var(--mh-radius-sm); overflow:hidden; box-shadow:var(--mh-shadow)}
.mh-banners img{width:100%; height:auto; display:block}
.mh-sidebar__close{
  display:none; position:absolute; top:10px; inset-inline-end:10px; width:36px; height:36px;
  border-radius:999px; border:1px solid #e2e8f0; background:#fff; color:#334155; cursor:pointer;
  align-items:center; justify-content:center; font:700 16px var(--mh-font);
}

/* Backdrop & toggle â€” accessible mobile menu as first position */
.mh-sidebar-toggle, .mh-sidebar-backdrop{display:none}
.mh-sidebar-toggle{
  align-items:center; gap:8px;
  background: rgba(255,255,255,.12);
  color:#fff; border:1px solid rgba(255,255,255,.18);
  padding:8px 14px; border-radius:999px;
  font:700 14px var(--mh-font); cursor:pointer;
}
.mh-sidebar-backdrop{
  position:fixed; inset:0; background:rgba(15,23,42,.42);
  backdrop-filter: blur(2px); z-index:95;
}
.mh-sidebar-backdrop.is-open{display:block}
.mh-topnav__sidecard-mobile{display:none !important}

/* Drawer unified â€” hidden on desktop, shown in mobile drawer */
.mh-drawer__topnav{display:none}
.mh-drawer__title{font:800 14px var(--mh-font); color:var(--mh-primary); margin:0 0 10px; padding:0 2px 8px; border-bottom:1px solid var(--mh-border); display:flex; align-items:center; gap:8px}
.mh-drawer__side-first{display:flex; flex-direction:column; gap:4px; margin:0 0 4px}
.mh-drawer__divider{height:1px; background:linear-gradient(90deg, transparent, #e2e8f0, transparent); margin:8px 0; border:0}
.mh-drawer__list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:4px}
.mh-drawer__link{display:flex; align-items:center; gap:10px; padding:11px 12px; border-radius:10px; background:#f8fafc; border:1px solid #e2e8f0; color:var(--mh-text) !important; font:600 13.5px var(--mh-font); text-decoration:none; transition:background .15s, color .15s, transform .15s; border:1px solid #e2e8f0}
.mh-drawer__link:hover{background:#eef4f8; color:var(--mh-primary) !important; transform:translateX(-1px)}
.mh-drawer__icon{width:20px; height:20px; display:inline-flex; align-items:center; justify-content:center; font-size:15px; flex:0 0 20px; opacity:.9}
.mh-drawer__item.has-sub > .mh-drawer__link{justify-content:space-between}
.mh-drawer__item.has-sub > .mh-drawer__link::after{content:""; width:14px; height:14px; flex:0 0 14px; background-color:currentColor; -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4.5 6.5L8 10L11.5 6.5' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px 14px no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4.5 6.5L8 10L11.5 6.5' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px 14px no-repeat; opacity:.7; transition:transform .2s; margin-inline-start:auto}
.mh-drawer__item.is-open > .mh-drawer__link::after{transform:rotate(180deg); opacity:1}
.mh-drawer__submenu{list-style:none; margin:6px 0 0; padding:6px; background:#fff; border:1px solid #e2e8f0; border-radius:10px; display:none; flex-direction:column; gap:2px}
.mh-drawer__item.is-open > .mh-drawer__submenu{display:flex}
.mh-drawer__submenu a{display:block; padding:8px 10px; border-radius:8px; font:500 13px var(--mh-font); color:#1e293b !important; text-decoration:none}
.mh-drawer__submenu a:hover{background:#f1f5f9; color:var(--mh-primary) !important}
.mh-drawer__search{display:flex; gap:8px; margin-top:10px; padding-top:10px; border-top:1px dashed #e2e8f0}
.mh-drawer__search input{flex:1; padding:10px 12px; border:1px solid #e2e8f0; border-radius:999px; font:500 13px var(--mh-font); outline:0}
.mh-drawer__search input:focus{border-color:#38bdf8; box-shadow:0 0 0 3px rgba(56,189,248,.15)}
.mh-drawer__search button{padding:8px 14px; border-radius:999px; border:0; background:var(--mh-primary); color:#fff; font:800 13px var(--mh-font); cursor:pointer}

/* Mobile banners strip â€” hidden on desktop, separate from drawer */
.mh-banners-mobile{display:none}
.mh-banners-mobile__head{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px}
.mh-banners-mobile__title{font:800 13px var(--mh-font); color:var(--mh-primary); display:flex; align-items:center; gap:6px}
.mh-banners-mobile__title::before{content:""; width:4px; height:16px; background:linear-gradient(180deg,#0e7490,#0f3a4f); border-radius:999px; display:inline-block}
.mh-banners-mobile__hint{font:600 11px var(--mh-font); color:#94a3b8; background:#fff; border:1px solid #e2e8f0; padding:4px 8px; border-radius:999px}
.mh-banners-mobile__track{display:flex; gap:12px; overflow-x:auto; scrollbar-width:thin; scroll-snap-type:x mandatory; padding-bottom:4px}
.mh-banners-mobile__item{flex:0 0 240px; scroll-snap-align:start; background:#fff; border:1px solid var(--mh-border); border-radius:12px; overflow:hidden; box-shadow:var(--mh-shadow); display:block}
.mh-banners-mobile__item img{width:100%; height:120px; object-fit:cover; display:block}
@media(max-width:480px){ .mh-banners-mobile__item{flex:0 0 78vw} }

@media(max-width:991px){
  /* Single hamburger controls unified drawer â€” hide topnav toggle on â‰¤991 */
  .mh-sidebar-toggle{display:inline-flex !important; order:-1}
  .mh-topnav__toggle{display:none !important}
  .mh-topnav__list{display:none !important}
  .mh-topnav__bar{flex-wrap:wrap}
  .mh-layout__sidebar{
    position:fixed !important; inset:0 auto 0 0;
    inset-inline-start:0;
    width:min(86vw, 340px) !important; max-width:86vw !important;
    height:100dvh !important; overflow:auto !important;
    background:var(--mh-card) !important; border-inline-end:1px solid var(--mh-border) !important;
    box-shadow:var(--mh-shadow-lg) !important;
    transform: translateX(110%);
    transition: transform .28s cubic-bezier(.22,1,.36,1);
    z-index:100 !important; padding:14px !important;
    display:block !important;
    visibility:hidden; pointer-events:none;
  }
  html[dir="rtl"] .mh-layout__sidebar{transform: translateX(110%)}
  .mh-layout__sidebar.is-open{
    transform:none !important;
    visibility:visible !important; pointer-events:auto !important;
  }
  .mh-sidebar{
    position:static !important; transform:none !important;
    width:100% !important; max-width:100% !important;
    padding:0 !important;
    gap:12px !important;
  }
  .mh-sidebar__close{display:flex !important}
  .mh-sidebar-backdrop{display:none}
  .mh-sidebar-backdrop.is-open{display:block}
  .mh-topnav__sidecard-mobile{display:none !important}
  /* Unified drawer: single header "Ø§Ù„Ù‚Ø§Ø¦Ù…Ø© Ø§Ù„Ø±Ø¦ÙŠØ³ÙŠØ©", sidebar items first, no outer card â€” just icon items */
  .mh-drawer__topnav{display:flex !important; flex-direction:column; gap:4px; padding:0 !important; background:transparent !important; border:0 !important; box-shadow:none !important; border-radius:0 !important}
  .mh-drawer__topnav .mh-drawer__title{padding:140px 2px 2px 10px; margin:0 0 8px}
  .mh-banners{display:none !important}
  /* Hide desktop sidecard duplication in drawer â€” its links already shown in mh-drawer__side-first */
  .mh-sidecard--desktop{display:none !important}
  /* Hide drawer search on mobile */
  .mh-drawer__search{display:none !important}
  /* Ensure Home + News are visible */
  .mh-drawer__side-first{display:flex !important; flex-direction:column !important; visibility:visible !important; opacity:1 !important}
  .mh-drawer__side-first .mh-drawer__link{display:flex !important; visibility:visible !important; opacity:1 !important}
  /* Show separate banners strip below content */
  .mh-banners-mobile{display:block !important; margin:16px; padding:14px; background:#fff; border:1px solid var(--mh-border); border-radius:12px; box-shadow:var(--mh-shadow)}
  .mh-layout__main{padding-bottom:0}
}
@media(min-width:992px){
  .mh-layout__sidebar{position:sticky; top:72px; align-self:start}
  .mh-layout__sidebar.is-open{transform:none; visibility:visible; pointer-events:auto}
  .mh-topnav__sidecard-mobile{display:none !important}
}


/* hero.css */
/* front/hero.css â€” slider + search + cards */
.mh-hero-news{
  background:var(--mh-card); border:1px solid var(--mh-border);
  border-radius:var(--mh-radius); box-shadow:var(--mh-shadow);
  overflow:hidden; min-width:0;
}
.mh-hero-news__head{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:14px 18px 12px; border-bottom:1px solid var(--mh-border);
  background: linear-gradient(180deg, #f8fbfc, #fff);
}
.mh-hero-news__title{margin:0; font:800 18px var(--mh-font); color:var(--mh-primary-soft); display:flex; align-items:center; gap:8px}
.mh-hero-news__title::before{content:""; width:4px; height:18px; background:var(--mh-accent); border-radius:999px; display:inline-block}
.mh-hero-news__all{font:700 13px var(--mh-font); color:var(--mh-accent) !important; padding:6px 12px; border:1px solid var(--mh-border); border-radius:999px; background:#fff}
.mh-hero-news__all:hover{background:#f1f5f9}
.mh-slider{position:relative; overflow:hidden; background:var(--mh-card); border-radius:12px; min-height:280px}
.mh-slider__track{display:flex; direction:ltr; transition: transform .45s cubic-bezier(.22,1,.36,1); will-change:transform}
.mh-slider__slide{flex:0 0 100%; min-width:0; position:relative; display:flex; flex-direction:column; background:var(--mh-card); direction:rtl}
.mh-slider__media{position:relative; aspect-ratio: 16/8.5; background: linear-gradient(135deg, #e0f2fe 0%, #f0f9ff 50%, #e0f2fe 100%); overflow:hidden; display:flex; align-items:center; justify-content:center; min-height:180px}
.mh-slider__media img{width:100%; height:100%; object-fit:cover; display:block; transition: transform .5s}
.mh-slider__media::before{content:"ðŸ“°"; position:absolute; font-size:48px; opacity:.15; pointer-events:none}
.mh-slider__media img[src]{position:relative; z-index:1}
.mh-slider__slide:hover .mh-slider__media img{transform: scale(1.02)}
.mh-slider__body{padding:16px 18px 18px; background:var(--mh-card); border-top:1px solid #f1f5f9}
.mh-slider__h{margin:0 0 8px; font:800 18px/1.4 var(--mh-font); color:var(--mh-primary)}
.mh-slider__h a{color:inherit !important}
.mh-slider__h a:hover{color:var(--mh-accent) !important}
.mh-slider__desc{margin:0; color:#475569; font:400 13.5px/1.8 var(--mh-font); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:46px}
.mh-slider__more{margin-top:10px; font:700 13px var(--mh-font); color:#fff !important; background:var(--mh-primary); padding:6px 14px; border-radius:999px; display:inline-flex; gap:6px; align-items:center}
.mh-slider__more:hover{background:var(--mh-accent) !important}
.mh-slider__nav{position:absolute; inset:0 0 auto 0; top:32%; display:flex; align-items:center; justify-content:space-between; pointer-events:none; padding:0 12px; transform:translateY(-50%)}
.mh-slider__btn{pointer-events:auto; width:42px; height:42px; border-radius:999px; border:1px solid rgba(255,255,255,.9); background:rgba(15,58,79,.85); color:#fff; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; backdrop-filter: blur(8px); transition: background .18s, transform .18s; font-size:20px; box-shadow:0 4px 12px rgba(0,0,0,.18)}
.mh-slider__btn:hover{background:var(--mh-primary); transform: scale(1.06)}
.mh-slider__dots{display:flex; gap:8px; justify-content:center; padding:14px 16px 16px; background:var(--mh-card); border-top:1px solid #f1f5f9}
.mh-slider__dot{width:10px; height:10px; border-radius:999px; background:#cbd5e1; border:0; cursor:pointer; transition: width .18s, background .18s, transform .18s}
.mh-slider__dot.is-active{width:26px; background:var(--mh-primary); transform:scaleY(1.1)}

.mh-main__search{
  background:var(--mh-card); border:1px solid var(--mh-border);
  border-radius:var(--mh-radius); box-shadow:var(--mh-shadow);
  padding:14px 16px; display:flex; gap:12px; align-items:center; flex-wrap:wrap;
}
.mh-main__search label{font:700 13px var(--mh-font); color:var(--mh-muted); white-space:nowrap}
.mh-main__search form{display:flex; gap:8px; flex:1; flex-wrap:wrap; align-items:center}
.mh-main__search input[type="text"]{
  flex:1; min-width:180px; padding:10px 14px;
  border:1px solid var(--mh-border); border-radius:999px;
  background:#f8fafc; font:500 14px var(--mh-font); outline:0;
  transition: border-color .18s, box-shadow .18s;
}
.mh-main__search input[type="text"]:focus{border-color:var(--mh-accent); box-shadow:0 0 0 4px rgba(35,114,148,.12); background:#fff}
.mh-main__search input[type="submit"]{
  padding:10px 18px; border-radius:999px; border:0;
  background:var(--mh-primary); color:#fff; font:800 13px var(--mh-font); cursor:pointer;
}
.mh-main__search .mh-hint{width:100%; font:400 12px var(--mh-font); color:var(--mh-muted)}

/* ===== Modern Cards â€” mh-cards v2 (premium) ===== */
.mh-cards{
  display:grid; grid-template-columns:1fr; gap:18px;
}
@media(min-width:640px){ .mh-cards{grid-template-columns:repeat(2,1fr); gap:18px} }
@media(min-width:1280px){ .mh-cards{gap:20px} }

.mh-card{
  position:relative;
  background:var(--mh-card); border:1px solid #e2e8f0;
  border-radius:18px; box-shadow:0 4px 16px rgba(15,58,79,.06);
  display:flex; flex-direction:column; min-width:0; overflow:hidden;
  transition: transform .22s cubic-bezier(.22,1,.36,1), box-shadow .22s, border-color .22s;
  isolation:isolate;
}
.mh-card::before{
  content:""; position:absolute; inset:0 0 auto 0; height:4px;
  background: var(--mh-card-accent, linear-gradient(90deg,#0e7490,#0f3a4f));
  z-index:2;
}
.mh-card:hover{ transform:translateY(-4px); box-shadow:0 14px 32px rgba(15,58,79,.12); border-color:#cbd5e1 }
.mh-card:focus-within{ box-shadow:0 14px 32px rgba(15,58,79,.12), 0 0 0 3px rgba(14,116,144,.12) }

.mh-card--video{ --mh-card-accent:linear-gradient(90deg,#f43f5e 0%, #ef4444 55%, #dc2626 100%); --mh-card-accent-solid:#ef4444; --mh-card-soft:#fff1f2; --mh-card-soft-border:#ffe4e6; --mh-card-icon-bg:linear-gradient(135deg,#f43f5e,#dc2626); }
.mh-card--audio{ --mh-card-accent:linear-gradient(90deg,#0e7490 0%, #06b6d4 100%); --mh-card-accent-solid:#0891b2; --mh-card-soft:#ecfeff; --mh-card-soft-border:#cffafe; --mh-card-icon-bg:linear-gradient(135deg,#0e7490,#06b6d4); }
.mh-card--book{ --mh-card-accent:linear-gradient(90deg,#f59e0b 0%, #d97706 100%); --mh-card-accent-solid:#d97706; --mh-card-soft:#fffbeb; --mh-card-soft-border:#fef3c7; --mh-card-icon-bg:linear-gradient(135deg,#f59e0b,#d97706); }
.mh-card--doc{ --mh-card-accent:linear-gradient(90deg,#6366f1 0%, #4f46e5 100%); --mh-card-accent-solid:#4f46e5; --mh-card-soft:#eef2ff; --mh-card-soft-border:#e0e7ff; --mh-card-icon-bg:linear-gradient(135deg,#6366f1,#4f46e5); }

.mh-card__head{
  position:relative;
  padding:16px 16px 14px; border-bottom:1px solid #f1f5f9;
  display:flex; align-items:center; gap:12px;
  background: linear-gradient(180deg,#f8fafc 0%, #ffffff 100%);
  overflow:hidden;
}
.mh-card__head::after{
  content:""; position:absolute; inset-inline-end:-30px; top:-30px; width:120px; height:120px;
  background: var(--mh-card-accent);
  opacity:.06; border-radius:999px; pointer-events:none;
  filter: blur(0px);
}
.mh-card__icon{
  width:42px; height:42px; border-radius:12px;
  background: var(--mh-card-icon-bg, linear-gradient(135deg,#0f3a4f,#0e7490));
  color:#fff; display:inline-flex; align-items:center; justify-content:center;
  font-size:19px; flex:0 0 42px; line-height:1;
  box-shadow:0 6px 16px rgba(0,0,0,.14), inset 0 1px 0 rgba(255,255,255,.25);
  position:relative; z-index:1;
}
.mh-card__icon svg{ width:22px; height:22px; display:block; }
.mh-card__head-text{ display:flex; flex-direction:column; gap:2px; min-width:0; flex:1; position:relative; z-index:1; }
.mh-card__title{margin:0; font:800 15px/1.3 var(--mh-font); color:#0f2e44; letter-spacing:.1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.mh-card__sub{ font:600 11.5px var(--mh-font); color:#64748b; display:flex; align-items:center; gap:6px }
.mh-card__sub-dot{ width:6px; height:6px; border-radius:999px; background:var(--mh-card-accent-solid,#0e7490); display:inline-block; opacity:.9 }
.mh-card__count{
  flex:0 0 auto; font:800 11px var(--mh-font); color:var(--mh-card-accent-solid,#0f3a4f);
  background:var(--mh-card-soft,#f1f5f9); border:1px solid var(--mh-card-soft-border,#e2e8f0);
  padding:5px 9px; border-radius:999px; position:relative; z-index:1; white-space:nowrap;
}

.mh-card__list{
  list-style:none; margin:0; padding:10px; display:flex; flex-direction:column; gap:6px; flex:1;
}
.mh-card__item{
  display:flex; align-items:center; gap:11px;
  padding:11px 12px; border-radius:12px;
  border:1px solid transparent; background:#fff;
  transition: background .18s, border-color .18s, transform .18s, box-shadow .18s;
  position:relative; overflow:hidden;
}
.mh-card__item:hover{ background:#f8fafc; border-color:#e2e8f0; transform:translateX(-2px); box-shadow:0 2px 10px rgba(15,58,79,.06) }
html[dir="ltr"] .mh-card__item:hover{ transform:translateX(2px) }
.mh-card__item:focus-within{ border-color:var(--mh-card-accent-solid,#0e7490); box-shadow:0 0 0 3px color-mix(in srgb, var(--mh-card-accent-solid,#0e7490) 14%, transparent) }
.mh-card__item-icon{
  flex:0 0 36px; width:36px; height:36px; border-radius:10px;
  background: var(--mh-card-soft,#f1f5f9); border:1px solid var(--mh-card-soft-border,#e2e8f0);
  color: var(--mh-card-accent-solid,#0f3a4f);
  display:inline-flex; align-items:center; justify-content:center;
  font-size:16px; transition: transform .18s, background .18s;
}
.mh-card__item:hover .mh-card__item-icon{ transform:scale(1.05); background:#fff }
.mh-card__item-icon svg{ width:18px; height:18px; display:block }
.mh-card__item-icon img{ width:18px; height:18px; object-fit:contain; display:block; opacity:.95 }
.mh-card__item-link{
  flex:1; min-width:0;
  font:700 13.3px/1.55 var(--mh-font); color:#1e293b !important;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  overflow-wrap:anywhere; text-decoration:none !important;
}
.mh-card__item-link:hover{ color:var(--mh-card-accent-solid,#0f3a4f) !important }
.mh-card__arrow{
  flex:0 0 22px; width:22px; height:22px; border-radius:999px;
  background:#fff; border:1px solid #e2e8f0; color:#94a3b8;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:12px; opacity:0; transform:translateX(6px);
  transition: opacity .18s, transform .18s, background .18s, color .18s, border-color .18s;
}
.mh-card__item:hover .mh-card__arrow{ opacity:1; transform:none; color:var(--mh-card-accent-solid,#0f3a4f); border-color:var(--mh-card-soft-border,#e2e8f0); background:var(--mh-card-soft,#f1f5f9) }
.mh-card__item-link:focus-visible{ outline:0 }

.mh-card__item--empty{
  justify-content:center; text-align:center; color:#64748b;
  font:600 13px var(--mh-font); padding:18px 14px;
  border:1px dashed #e2e8f0; background:#f8fafc; border-radius:12px;
}
.mh-card__empty-icon{ font-size:22px; opacity:.6; margin-bottom:6px }
.mh-card__empty-text{ font:600 12.5px var(--mh-font); color:#64748b }

.mh-card__foot{
  margin-top:auto; padding:12px 14px;
  border-top:1px solid #f1f5f9;
  display:flex; justify-content:center;
  background: linear-gradient(180deg,#ffffff 0%, #fbfdff 100%);
}
.mh-card__more{
  font:800 12.8px var(--mh-font); color:#fff !important;
  display:inline-flex; gap:7px; align-items:center; justify-content:center;
  padding:9px 18px; border-radius:999px; background: var(--mh-card-icon-bg, linear-gradient(135deg,#0f3a4f,#0e7490));
  border:0; box-shadow:0 6px 16px rgba(15,58,79,.16), 0 1px 2px rgba(0,0,0,.06);
  transition: transform .16s, box-shadow .16s, filter .16s;
  text-decoration:none !important; min-width:132px; letter-spacing:.1px;
}
.mh-card__more:hover{ transform:translateY(-1px); box-shadow:0 10px 22px rgba(15,58,79,.20); filter:brightness(1.03); color:#fff !important }
.mh-card__more:active{ transform:translateY(0) scale(.98) }
.mh-card__more svg{ width:14px; height:14px; display:block; flex:0 0 14px; opacity:.95 }

body.mh-home .mh-card img[src*="Box_"], body.mh-home .mh-card img[src*="inner_"]{display:none !important}
body.mh-home .mh-card table{border:0 !important}
body.mh-home .mh-card td{background:transparent !important}
body.mh-home .mh-card img[src*="Box_"], body.mh-home .mh-card img[src*="inner_"]{display:none !important}
body.mh-home .mh-card table{border:0 !important}
body.mh-home .mh-card td{background:transparent !important}

@media(max-width:767px){
  .mh-hero-news__media{aspect-ratio: 16/9}
  .mh-main__search{padding:12px}
}


/* footer.css */
/* front/footer.css */
.mh-footer{background:var(--mh-primary); color:#d6e6f0; margin-top:8px; border-top:1px solid #0e4a6b}
.mh-footer__inner{padding:18px 0 20px; display:flex; flex-direction:column; gap:10px}
.mh-footer__bar{height:1px; background:linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent)}
.mh-footer__links{display:flex; gap:12px; flex-wrap:wrap; justify-content:center; font:500 13px var(--mh-font)}
.mh-footer__links a{color:#e6f0f6 !important}
.mh-footer__links a:hover{color:#fff !important; text-decoration:underline}
.mh-footer__meta{text-align:center; font:400 12.5px/1.6 var(--mh-font); color:#b9d1e2}
body.mh-home .mh-footer + div table, body.mh-home div[align="center"] > table[bgColor="#00314c"]{display:none}
@media print{
  .mh-topnav, .mh-sidebar, .mh-banners, .mh-slider__nav, .mh-slider__dots{display:none !important}
  .mh-layout{grid-template-columns:1fr}
  .mh-card{box-shadow:none; break-inside:avoid}
}
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{transition:none !important; animation:none !important; scroll-behavior:auto !important}
}
#mh-main form{height:auto !important; min-height:0 !important; max-height:none !important; overflow:visible !important}
body.mh-home .mh-layout-legacy-wrapper{overflow:visible !important}
#mh-main{overflow:visible !important}
[id^="comment-form-"]{position:relative !important; z-index:10 !important; isolation:isolate; overflow:visible !important; height:auto !important}
[id^="mhdi-comment-form-"]{height:auto !important; min-height:0 !important; max-height:none !important; overflow:visible !important; position:relative; z-index:1}
#mh-main .article-footer{position:relative !important; z-index:10 !important; isolation:isolate; overflow:visible !important; height:auto !important}
.article-wrap > div[style*="Ø°Ø§Øª ØµÙ„Ø©"], .article-wrap > .mh-related{position:relative; z-index:1 !important}


/* article.css */
/* ===== Article Modern â€” v2 ===== */
:root{--art-radius:20px; --art-shadow:0 8px 30px rgba(15,58,79,.08); --art-border:#e2e8f0;}
.art-page{max-width:1180px; margin:0 auto; padding:14px 14px 28px; width:100%; box-sizing:border-box;}
@media(min-width:768px){ .art-page{padding:18px 18px 32px;} }

/* Breadcrumb */
.art-crumb{display:flex; flex-wrap:wrap; gap:6px; align-items:center; font:600 12.5px var(--mh-font); color:#64748b; margin:2px 0 14px;}
.art-crumb a{display:inline-flex; align-items:center; gap:6px; background:#fff; border:1px solid #e2e8f0; padding:6px 12px; border-radius:999px; color:#0f3a4f; text-decoration:none; font-weight:700; transition:.15s; box-shadow:0 1px 2px rgba(0,0,0,.04);}
.art-crumb a:hover{background:#f8fafc; border-color:#cbd5e1; color:#0e7490; transform:translateY(-1px);}
.art-crumb .sep{color:#94a3b8; font-size:12px; padding:0 2px;}
.art-crumb .cur{background:linear-gradient(135deg,#0f3a4f,#134e66); color:#fff; border-color:#0f3a4f; padding:6px 13px; border-radius:999px; font:800 12px var(--mh-font); max-width:32ch; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; box-shadow:0 4px 12px rgba(15,58,79,.18);}
@media(max-width:640px){ .art-crumb .cur{max-width:18ch;} }

/* Layout grid */
.art-layout{display:grid; grid-template-columns:1fr; gap:16px; align-items:start;}
@media(min-width:1024px){ .art-layout{grid-template-columns: minmax(0,1fr) 340px; gap:18px;} }
.art-layout--no-sidebar{grid-template-columns:1fr !important; max-width:860px; margin-inline:auto}
@media(min-width:1024px){ .art-layout--no-sidebar{grid-template-columns:1fr !important} }

/* Hero header */
.art-hero{background:#fff; border:1px solid var(--art-border); border-radius:var(--art-radius); overflow:hidden; box-shadow:var(--art-shadow); position:relative; isolation:isolate;}
.art-hero::before{content:""; position:absolute; inset:0 0 auto 0; height:4px; background:linear-gradient(90deg,#0e7490 0%, #0f3a4f 55%, #38bdf8 100%); z-index:2;}
.art-hero-top{position:relative; padding:18px 18px 14px; background:linear-gradient(180deg,#f8fbfc 0%, #ffffff 85%);}
@media(min-width:768px){ .art-hero-top{padding:22px 22px 16px;} }
.art-eyebrow{display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:12px;}
.art-eyebrow .pill{display:inline-flex; align-items:center; gap:6px; font:700 11.5px var(--mh-font); padding:6px 10px; border-radius:999px; border:1px solid #e2e8f0; background:#f8fafc; color:#475569;}
.art-eyebrow .pill--cat{background:linear-gradient(135deg,#0f3a4f,#0e7490); color:#fff; border-color:#0f3a4f; box-shadow:0 4px 12px rgba(15,58,79,.15);}
.art-eyebrow .pill--live{background:#f0fdf4; border-color:#bbf7d0; color:#166534;}
.art-title{margin:0; font:800 clamp(19px, 3.8vw, 28px)/1.32 var(--mh-font); color:#0f2e44; letter-spacing:.1px; text-wrap:balance; overflow-wrap:anywhere;}
.art-excerpt{margin:10px 0 0; color:#475569; font:500 13.8px/1.75 var(--mh-font); background:#f8fafc; border:1px solid #eef2f7; border-right:3px solid #0e7490; padding:10px 12px; border-radius:10px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
@media(max-width:640px){ .art-excerpt{font-size:13px;}}
.art-meta{display:flex; flex-wrap:wrap; gap:8px; margin-top:14px;}
.art-meta .m{display:inline-flex; align-items:center; gap:6px; background:#fff; border:1px solid #e2e8f0; color:#334155; padding:7px 11px; border-radius:999px; font:700 12.2px var(--mh-font); box-shadow:0 1px 2px rgba(0,0,0,.04);}
.art-meta .m--views{background:#eef6ff; border-color:#dbeafe; color:#0f3a4f;}
.art-meta .m--time{background:#fefce8; border-color:#fde68a; color:#854d0e;}
.art-meta .m--date{background:#f1f5f9;}
.art-toolbar{display:flex; flex-wrap:wrap; gap:8px; align-items:center; justify-content:space-between; margin-top:14px; padding-top:12px; border-top:1px dashed #e2e8f0;}
.art-toolbar__group{display:flex; gap:8px; flex-wrap:wrap; align-items:center;}
.art-tbtn{display:inline-flex; align-items:center; gap:7px; padding:8px 12px; border-radius:999px; border:1px solid #e2e8f0; background:#fff; color:#0f3a4f; font:700 12.5px var(--mh-font); cursor:pointer; transition:.16s; text-decoration:none; user-select:none; box-shadow:0 1px 2px rgba(0,0,0,.04);}
.art-tbtn:hover{transform:translateY(-1px); box-shadow:0 6px 14px rgba(15,58,79,.09); border-color:#cbd5e1;}
.art-tbtn--primary{background:linear-gradient(180deg,#0f3a4f,#134e66); color:#fff; border-color:#0f3a4f; box-shadow:0 6px 16px rgba(15,58,79,.18);}
.art-tbtn--primary:hover{background:linear-gradient(180deg,#134e66,#0e7490);}
.art-tbtn--ghost{background:#f8fafc;}
.art-tbtn:active{transform:scale(.98);}
.art-fontctl{display:inline-flex; align-items:center; gap:6px; background:#f8fafc; border:1px solid #e2e8f0; padding:4px; border-radius:999px;}
.art-fontctl button{width:32px; height:32px; border-radius:999px; border:1px solid #e2e8f0; background:#fff; color:#0f3a4f; font:800 14px var(--mh-font); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; transition:.15s;}
.art-fontctl button:hover{background:#0f3a4f; color:#fff; border-color:#0f3a4f;}
.art-fontctl span{font:700 11px var(--mh-font); color:#64748b; padding:0 4px;}

/* Reading progress */
.art-progress{height:3px; background:#e2e8f0; border-radius:999px; overflow:hidden; margin-top:12px; position:sticky; top:0; z-index:5;}
.art-progress__bar{height:100%; width:0; background:linear-gradient(90deg,#0e7490,#38bdf8); border-radius:999px; transition:width .12s linear;}

/* Content card */
.art-body-card{background:#fff; border:1px solid var(--art-border); border-radius:var(--art-radius); box-shadow:var(--art-shadow); overflow:hidden; margin-top:12px;}
.art-body-inner{padding:18px;}
@media(min-width:768px){ .art-body-inner{padding:22px 24px;}}
.art-text{font-size:17px; line-height:2; color:#1e293b; overflow-wrap:break-word; word-break:break-word; transition:font-size .18s;}
.art-text p{margin:0 0 14px;}
.art-text img{max-width:100%; height:auto; border-radius:12px; margin:14px auto; display:block; box-shadow:0 4px 16px rgba(0,0,0,.07); border:1px solid #eef2f7;}
.art-text a{color:#0e7490; text-decoration:underline; text-underline-offset:3px; font-weight:600;}
.art-text a:hover{color:#0f3a4f;}
.art-text h2{font:800 19px/1.4 var(--mh-font); color:#0f2e44; margin:22px 0 12px; padding:10px 12px 10px 0; background:linear-gradient(90deg,#f8fafc, transparent); border-right:4px solid #0e7490; border-radius:8px; scroll-margin-top:18px;}
.art-text h3{font:800 16px/1.5 var(--mh-font); color:#134e66; margin:18px 0 10px; padding-right:10px; border-right:3px solid #38bdf8;}
.art-text blockquote{background:#f8fafc; border:1px solid #e2e8f0; border-right:4px solid #0f3a4f; padding:12px 14px; border-radius:10px; color:#334155; margin:14px 0; font-style:normal;}
.art-text ul, .art-text ol{margin:0 0 14px; padding-inline-start:22px;}
.art-text li{margin:6px 0;}
.art-text table{width:100%; border-collapse:collapse; border:1px solid #e2e8f0; border-radius:10px; overflow:hidden;}
.art-text table td,.art-text table th{border:1px solid #e2e8f0; padding:9px 10px; font-size:14px; text-align:right;}
.art-text table th{background:#f8fafc; font-weight:800; color:#0f2e44;}
.art-text .table-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch; margin:14px 0; border-radius:12px; border:1px solid #e2e8f0; box-shadow:0 2px 8px rgba(0,0,0,.04);}
.art-text .table-wrap table{margin:0; min-width:480px; border:0; border-radius:0;}
.art-text hr{border:0; height:1px; background:linear-gradient(90deg,transparent,#e2e8f0,transparent); margin:18px 0;}
@media(max-width:640px){ .art-text{font-size:16px; line-height:1.95;} .art-text h2{font-size:17px;} }

/* Share + font size helper */
.art-share-row{display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:16px; padding-top:14px; border-top:1px dashed #e2e8f0;}
.art-share-row .lbl{font:700 12px var(--mh-font); color:#64748b;}
.art-share-row a{width:38px; height:38px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; border:1px solid #e2e8f0; background:#fff; color:#0f3a4f; text-decoration:none; transition:.15s; font-size:16px; box-shadow:0 1px 3px rgba(0,0,0,.06);}
.art-share-row a:hover{transform:translateY(-2px); box-shadow:0 8px 16px rgba(0,0,0,.08); background:#0f3a4f; color:#fff; border-color:#0f3a4f;}

/* Prev/Next */
.art-pn{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:14px;}
@media(max-width:640px){ .art-pn{grid-template-columns:1fr;}}
.art-pn a{background:#fff; border:1px solid #e2e8f0; border-radius:14px; padding:12px 14px; text-decoration:none; color:#0f2e44; display:flex; flex-direction:column; gap:6px; transition:.16s; box-shadow:0 2px 8px rgba(0,0,0,.04);}
.art-pn a:hover{transform:translateY(-1px); box-shadow:0 8px 20px rgba(0,0,0,.07); border-color:#cbd5e1;}
.art-pn .k{font:700 11px var(--mh-font); color:#0e7490; display:flex; align-items:center; gap:6px;}
.art-pn .t{font:700 13.5px/1.5 var(--mh-font); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.art-pn .a--disabled{background:#f8fafc; color:#94a3b8; border-style:dashed; pointer-events:none; justify-content:center; align-items:center; text-align:center; font:600 12.5px var(--mh-font);}

/* Comments section */
.art-section{background:#fff; border:1px solid var(--art-border); border-radius:var(--art-radius); box-shadow:var(--art-shadow); padding:16px; margin-top:14px;}
@media(min-width:768px){ .art-section{padding:18px;}}
.art-section__head{display:flex; align-items:center; gap:10px; margin-bottom:10px; flex-wrap:wrap;}
.art-section__title{margin:0; font:800 15px var(--mh-font); color:#0f2e44; display:flex; align-items:center; gap:8px;}
.art-section__title:before{content:""; width:4px; height:18px; background:linear-gradient(180deg,#0e7490,#0f3a4f); border-radius:999px; display:inline-block;}

/* Related */
.art-related{background:#fff; border:1px solid var(--art-border); border-radius:var(--art-radius); box-shadow:var(--art-shadow); padding:16px; margin-top:14px;}
.art-related__head{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px; flex-wrap:wrap;}
.art-related__title{margin:0; font:800 15px var(--mh-font); color:#0f2e44; display:flex; align-items:center; gap:8px;}
.art-related__title:before{content:""; width:4px; height:18px; background:#0e7490; border-radius:999px; display:inline-block;}
.art-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:10px;}
@media(max-width:640px){ .art-grid{grid-template-columns:1fr;}}
.art-rel{display:flex; flex-direction:column; gap:8px; background:#fff; border:1px solid #eef2f7; border-radius:14px; padding:13px 14px; text-decoration:none; color:#0f2e44; transition:.16s; position:relative; overflow:hidden; min-height:110px;}
.art-rel::before{content:""; position:absolute; inset:0 0 auto 0; height:3px; background:linear-gradient(90deg,#0e7490,#38bdf8); opacity:0; transition:.16s;}
.art-rel:hover{transform:translateY(-2px); box-shadow:0 10px 22px rgba(15,58,79,.08); border-color:#dbeafe;}
.art-rel:hover::before{opacity:1;}
.art-rel__t{font:700 13.8px/1.5 var(--mh-font); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:42px;}
.art-rel__meta{display:flex; gap:6px; flex-wrap:wrap; margin-top:auto;}
.art-rel__meta span{background:#f1f5f9; border:1px solid #e2e8f0; padding:4px 8px; border-radius:999px; font:600 11px var(--mh-font); color:#475569;}
.art-rel__meta .v{background:#eef6ff; border-color:#dbeafe; color:#0f3a4f;}

/* Sidebar */
.art-sidebar{display:flex; flex-direction:column; gap:14px;}
@media(min-width:1024px){ .art-sidebar{position:sticky; top:72px;}}
.side-card{background:#fff; border:1px solid var(--art-border); border-radius:var(--art-radius); box-shadow:var(--art-shadow); overflow:hidden;}
.side-card__head{padding:13px 14px 10px; background:linear-gradient(180deg,#f8fafc,#fff); border-bottom:1px solid #eef2f7; display:flex; align-items:center; gap:8px; font:800 13.5px var(--mh-font); color:#0f3a4f;}
.side-card__body{padding:12px 14px;}
.side-info{display:flex; flex-direction:column; gap:8px;}
.side-info .row{display:flex; align-items:center; justify-content:space-between; gap:10px; background:#f8fafc; border:1px solid #eef2f7; padding:9px 11px; border-radius:12px; font:600 12.5px var(--mh-font); color:#334155;}
.side-info .row b{color:#0f3a4f; font-weight:800;}
.side-toc{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; max-height:320px; overflow:auto; scrollbar-width:thin;}
.side-toc a{display:block; padding:8px 10px; border-radius:10px; border:1px solid #eef2f7; background:#f8fafc; color:#334155; font:600 12.5px/1.5 var(--mh-font); text-decoration:none; transition:.14s; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.side-toc a:hover{background:#eef6ff; border-color:#dbeafe; color:#0f3a4f;}
.side-toc a.is-active{background:linear-gradient(135deg,#0f3a4f,#0e7490); color:#fff; border-color:#0f3a4f;}
.side-share{display:grid; grid-template-columns:repeat(4,1fr); gap:8px;}
.side-share a{height:42px; border-radius:12px; border:1px solid #e2e8f0; background:#fff; color:#0f3a4f; display:flex; align-items:center; justify-content:center; text-decoration:none; font-size:16px; transition:.14s;}
.side-share a:hover{background:#0f3a4f; color:#fff; border-color:#0f3a4f; transform:translateY(-1px);}
.side-actions{display:flex; flex-direction:column; gap:8px;}
.side-actions a{padding:10px 12px; border-radius:12px; text-decoration:none; font:700 13px var(--mh-font); display:flex; align-items:center; gap:8px; justify-content:center; transition:.14s; border:1px solid transparent;}
.side-actions .a-primary{background:linear-gradient(180deg,#0f3a4f,#134e66); color:#fff; box-shadow:0 6px 16px rgba(15,58,79,.16);}
.side-actions .a-primary:hover{transform:translateY(-1px); box-shadow:0 10px 20px rgba(15,58,79,.18);}
.side-actions .a-ghost{background:#fff; border-color:#e2e8f0; color:#0f3a4f;}
.side-actions .a-ghost:hover{background:#f8fafc;}

/* Print */
@media print{
  .art-toolbar, .art-share-row, .art-sidebar, .art-pn, .art-related, .art-progress{display:none !important;}
  .art-page{padding:0;}
  .art-hero, .art-body-card, .art-section{box-shadow:none; border:1px solid #ddd;}
}
/* Inline extracted 2026-08-28 */
.art-main-col{min-width:0; display:flex; flex-direction:column; gap:0}
.art-share__actions{margin-inline-start:auto; display:flex; gap:8px}
.art-date-small{font:600 11px var(--mh-font); color:#64748b}
.art-related__more{font:700 12px var(--mh-font); color:#0e7490; background:#fff; border:1px solid #e2e8f0; padding:6px 10px; border-radius:999px; text-decoration:none}
.art-rel__excerpt{font:400 12px/1.6 var(--mh-font); color:#64748b; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.art-rel__cta{margin-inline-start:auto; background:#0f3a4f; color:#fff; border-color:#0f3a4f}
.side-info__source{max-width:16ch; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.side-toc__actions{margin-top:10px; display:flex; gap:8px}
.side-toc__btn{flex:1; justify-content:center}
.side-actions__print{width:100%; cursor:pointer}
.side-share__copy{width:100%; margin-top:10px; justify-content:center}
.side-share__ok{display:none; margin-top:8px; background:#ecfdf5; border:1px solid #a7f3d0; color:#065f46; padding:8px 10px; border-radius:10px; font:700 12px var(--mh-font); text-align:center}
.side-card--cta{background:linear-gradient(135deg,#0f3a4f,#0e7490); color:#fff; border-color:#0f3a4f}
.side-card--cta .side-card__body{text-align:center; padding:16px}
.side-card--cta .cta-title{font:800 13px var(--mh-font); margin-bottom:8px}
.side-card--cta .cta-desc{font:500 12.5px/1.6 var(--mh-font); opacity:.92; margin-bottom:12px}
.side-card--cta .cta-btn{display:inline-flex; background:#fff; color:#0f3a4f; padding:8px 14px; border-radius:999px; font:800 12.5px var(--mh-font); text-decoration:none}
.art-comments-wrap{display:block; width:100%; overflow:visible}
.art-section--comments{background:#f8fafc}


/* topic.css */
/* ===== Topic (dept) â€” modern, RTL, mobile-first ===== */
.tp-wrap{max-width:860px; margin:0 auto; width:100%; display:flex; flex-direction:column; gap:14px;}
.tp-breadcrumb{font:500 12.5px var(--mh-font); color:#64748b; display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin:0;}
.tp-breadcrumb a{color:#0f3a4f; background:#fff; border:1px solid #e2e8f0; padding:4px 10px; border-radius:999px; font:700 12px var(--mh-font); transition:.15s;}
.tp-breadcrumb a:hover{background:#f1f5f9; color:#0e7490;}
.tp-breadcrumb span.sep{color:#94a3b8; font-size:11px;}
.tp-cur{background:#0f3a4f; color:#fff; padding:4px 10px; border-radius:999px; font:800 12px var(--mh-font);}
/* Hero */
.tp-hero{background:linear-gradient(135deg,#061e2e 0%, #0f3a4f 45%, #0e7490 100%); color:#fff; border-radius:18px; padding:20px 18px 16px; position:relative; overflow:hidden; box-shadow:0 10px 28px rgba(6,30,46,.18); isolation:isolate;}
.tp-hero::before{content:""; position:absolute; inset:-40% -20% auto auto; width:360px; height:360px; background:radial-gradient(circle at 30% 30%, rgba(56,189,248,.22), transparent 65%); pointer-events:none; z-index:0;}
.tp-hero::after{content:""; position:absolute; inset:auto -10% -50% auto; width:420px; height:220px; background:radial-gradient(ellipse at center, rgba(255,255,255,.08), transparent 70%); pointer-events:none;}
.tp-hero > *{position:relative; z-index:1;}
.tp-hero__eyebrow{display:inline-flex; align-items:center; gap:7px; font:700 11px var(--mh-font); letter-spacing:.4px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.18); color:#e0f2fe; padding:5px 10px; border-radius:999px; backdrop-filter:blur(6px);}
.tp-hero h1{margin:10px 0 6px; font:800 clamp(18px, 4.2vw, 24px)/1.35 var(--mh-font); letter-spacing:.1px; text-wrap:balance;}
.tp-hero__meta{display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; align-items:center;}
.tp-hero__pill{display:inline-flex; align-items:center; gap:6px; background:rgba(255,255,255,.13); border:1px solid rgba(255,255,255,.18); color:#f1f5f9; padding:6px 11px; border-radius:999px; font:600 12.5px var(--mh-font); backdrop-filter:blur(6px);}
.tp-hero__pill b{color:#fff; font-weight:800;}
.tp-hero__actions{display:flex; gap:8px; flex-wrap:wrap; margin-top:14px;}
.tp-btn{display:inline-flex; align-items:center; gap:7px; padding:9px 14px; border-radius:999px; font:800 13px var(--mh-font); text-decoration:none; transition:.18s; border:1px solid transparent; white-space:nowrap;}
.tp-btn--light{background:#fff; color:#0f3a4f; box-shadow:0 4px 12px rgba(0,0,0,.12);}
.tp-btn--light:hover{transform:translateY(-1px); box-shadow:0 8px 18px rgba(0,0,0,.14); background:#f8fafc;}
.tp-btn--ghost{background:rgba(255,255,255,.12); color:#fff; border-color:rgba(255,255,255,.22);}
.tp-btn--ghost:hover{background:rgba(255,255,255,.18);}
/* Toolbar */
.tp-toolbar{background:#fff; border:1px solid #e2e8f0; border-radius:14px; padding:10px 12px; display:flex; gap:10px; flex-wrap:wrap; align-items:center; justify-content:space-between; box-shadow:0 1px 2px rgba(0,0,0,.04);}
.tp-toolbar__left{display:flex; gap:8px; flex-wrap:wrap; align-items:center; flex:1; min-width:200px;}
.tp-toolbar__right{font:600 12.5px var(--mh-font); color:#64748b; display:flex; gap:8px; align-items:center; flex-wrap:wrap;}
.tp-search{position:relative; flex:1; min-width:180px; max-width:420px;}
.tp-search input{width:100%; padding:10px 36px 10px 12px; border:1px solid #e2e8f0; border-radius:999px; background:#f8fafc; font:500 13.5px var(--mh-font); outline:0; transition:.18s;}
.tp-search input:focus{background:#fff; border-color:#0e7490; box-shadow:0 0 0 4px rgba(14,116,144,.10);}
.tp-search__icon{position:absolute; inset-block-start:50%; inset-inline-end:10px; transform:translateY(-50%); width:18px; height:18px; color:#64748b; pointer-events:none;}
.tp-count{ background:#f1f5f9; border:1px solid #e2e8f0; padding:6px 10px; border-radius:999px; font:700 12px var(--mh-font); color:#0f3a4f;}
/* List */
.tp-list{display:grid; grid-template-columns:1fr; gap:10px;}
.tp-card{background:#fff; border:1px solid #eef2f7; border-radius:16px; padding:14px 14px 12px; display:grid; grid-template-columns:1fr auto; gap:12px; align-items:center; transition:transform .18s, box-shadow .18s, border-color .18s; position:relative; overflow:hidden;}
.tp-card::before{content:""; position:absolute; inset-inline-start:0; inset-block:0; width:3px; background:linear-gradient(180deg, #0e7490, #0f3a4f); opacity:0; transition:.18s;}
.tp-card:hover{transform:translateY(-1px); box-shadow:0 8px 22px rgba(15,58,79,.08); border-color:#e2e8f0;}
.tp-card:hover::before{opacity:1;}
.tp-card__main{min-width:0; display:flex; flex-direction:column; gap:7px;}
.tp-card__title{margin:0; font:750 15.5px/1.5 var(--mh-font); color:#0f2e44; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere;}
.tp-card__title a{color:inherit; text-decoration:none;}
.tp-card__title a:hover{color:#0e7490;}
.tp-card__excerpt{margin:0; font:400 13px/1.7 var(--mh-font); color:#64748b; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.tp-card__meta{display:flex; flex-wrap:wrap; gap:6px; align-items:center;}
.tp-meta-pill{display:inline-flex; align-items:center; gap:5px; background:#f8fafc; border:1px solid #eef2f7; color:#475569; padding:4px 8px; border-radius:999px; font:600 11.5px var(--mh-font);}
.tp-meta-pill--views{background:#eef6fb; border-color:#dbeafe; color:#0f3a4f;}
.tp-card__action{display:flex; flex-direction:column; align-items:flex-end; gap:8px; flex-shrink:0;}
.tp-go{width:42px; height:42px; border-radius:999px; background:linear-gradient(180deg,#0f3a4f,#134e66); color:#fff; display:inline-flex; align-items:center; justify-content:center; text-decoration:none; font-size:16px; box-shadow:0 4px 12px rgba(15,58,79,.18); transition:.18s; flex-shrink:0;}
.tp-go:hover{transform:translateX(-2px) scale(1.03); background:linear-gradient(180deg,#134e66,#0e7490);}
.tp-go__label{font:700 11px var(--mh-font); color:#64748b; text-align:center;}
.tp-empty{background:#fff; border:1px dashed #cbd5e1; border-radius:16px; padding:32px 18px; text-align:center; color:#64748b; font:500 14px var(--mh-font);}
.tp-empty b{color:#0f3a4f; font-size:15px; display:block; margin-bottom:6px;}
/* Pagination wrapper */
.tp-pager{margin-top:2px;}
/* Mobile */
@media(max-width:640px){
  .tp-hero{padding:16px 14px 14px; border-radius:16px;}
  .tp-hero h1{font-size:19px;}
  .tp-toolbar{padding:10px;}
  .tp-card{grid-template-columns:1fr; padding:13px;}
  .tp-card__action{flex-direction:row; align-items:center; justify-content:space-between; width:100%;}
  .tp-card__action .tp-go{width:38px; height:38px; font-size:15px;}
  .tp-card__title{font-size:15px;}
}
@media(max-width:380px){
  .tp-hero__actions .tp-btn{flex:1; justify-content:center;}
}

/* topic-main.css */
.tp-wrap{max-width:860px; margin:0 auto; width:100%; display:flex; flex-direction:column; gap:14px;}
.tp-breadcrumb{font:500 12.5px var(--mh-font); color:#64748b; display:flex; flex-wrap:wrap; gap:6px; align-items:center;}
.tp-breadcrumb a{color:#0f3a4f; background:#fff; border:1px solid #e2e8f0; padding:4px 10px; border-radius:999px; font:700 12px var(--mh-font);}
.tp-breadcrumb a:hover{background:#f1f5f9;}
/* Hero â€” same language as show page */
.tp-hero{background:linear-gradient(135deg,#061e2e 0%, #0f3a4f 55%, #115e7a 100%); color:#fff; border-radius:18px; padding:22px 18px 18px; position:relative; overflow:hidden; box-shadow:0 10px 28px rgba(6,30,46,.18); isolation:isolate;}
.tp-hero::before{content:""; position:absolute; inset:-30% -15% auto auto; width:360px; height:360px; background:radial-gradient(circle at 30% 30%, rgba(56,189,248,.18), transparent 65%); pointer-events:none;}
.tp-hero > *{position:relative; z-index:1;}
.tp-hero__eyebrow{display:inline-flex; gap:7px; align-items:center; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.18); color:#e0f2fe; padding:5px 10px; border-radius:999px; font:700 11px var(--mh-font);}
.tp-hero h1{margin:10px 0 6px; font:800 clamp(19px, 4.5vw, 26px)/1.35 var(--mh-font);}
.tp-hero p{margin:0; font:500 13px/1.7 var(--mh-font); color:#e2f1f8; opacity:.95;}
.tp-hero__stats{display:flex; flex-wrap:wrap; gap:8px; margin-top:12px;}
.tp-stat{background:rgba(255,255,255,.13); border:1px solid rgba(255,255,255,.18); color:#fff; padding:6px 11px; border-radius:999px; font:700 12.5px var(--mh-font);}
.tp-stat--solid{background:#fff; color:#0f3a4f; border-color:#fff;}
/* Grid */
.tp-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:12px;}
@media(max-width:640px){ .tp-grid{grid-template-columns:1fr; gap:10px;} }
.tp-dept{background:#fff; border:1px solid #eef2f7; border-radius:16px; overflow:hidden; box-shadow:0 2px 10px rgba(0,0,0,.05); transition:transform .18s, box-shadow .18s, border-color .18s; display:flex; flex-direction:column; position:relative; text-decoration:none; color:inherit;}
.tp-dept:hover{transform:translateY(-2px); box-shadow:0 10px 24px rgba(15,58,79,.09); border-color:#dbeafe;}
.tp-dept__top{height:4px; background:linear-gradient(90deg, #0e7490, #0f3a4f); opacity:.95;}
.tp-dept__body{padding:14px 14px 12px; display:flex; flex-direction:column; gap:10px; flex:1;}
.tp-dept__head{display:flex; gap:10px; align-items:flex-start;}
.tp-dept__icon{flex:0 0 44px; width:44px; height:44px; border-radius:12px; background:linear-gradient(135deg,#eef6fb,#e0f2fe); border:1px solid #dbeafe; color:#0f3a4f; display:inline-flex; align-items:center; justify-content:center; font-size:20px;}
.tp-dept__title{margin:0; font:800 15px/1.4 var(--mh-font); color:#0f2e44; flex:1; min-width:0; overflow-wrap:anywhere;}
.tp-dept__desc{margin:0; font:400 12.5px/1.6 var(--mh-font); color:#64748b; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:32px;}
.tp-dept__foot{margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:8px; padding-top:10px; border-top:1px dashed #eef2f7;}
.tp-badge{font:700 11.5px var(--mh-font); background:#f1f5f9; color:#334155; border:1px solid #e2e8f0; padding:5px 9px; border-radius:999px; display:inline-flex; gap:5px; align-items:center;}
.tp-badge--primary{background:#0f3a4f; color:#fff; border-color:#0f3a4f;}
.tp-arrow{width:32px; height:32px; border-radius:999px; background:#f8fafc; border:1px solid #e2e8f0; color:#0f3a4f; display:inline-flex; align-items:center; justify-content:center; transition:.18s; flex-shrink:0;}
.tp-dept:hover .tp-arrow{background:#0f3a4f; color:#fff; border-color:#0f3a4f; transform:translateX(-2px);}
.tp-empty{grid-column:1/-1; background:#fff; border:1px dashed #cbd5e1; border-radius:16px; padding:30px 18px; text-align:center; color:#64748b; font:500 14px var(--mh-font);}

/* news-show.css */
.article-wrap{max-width:760px;margin:0 auto;padding:0}
.breadcrumb{font-size:12px;color:#6b7c8d;margin:0 0 8px}
.breadcrumb a{color:#0b4a6e;text-decoration:none}
.article-header{background:#fff;border:1px solid #eef2f7;border-radius:12px;overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,.06)}
.article-hero-img{width:100%;max-height:360px;object-fit:cover;background:#eef2f7}
.article-header-body{padding:18px}
.article-title{font-size:22px;line-height:1.4;color:#0f2e44;margin:0 0 10px;font-weight:800}
.article-meta{display:flex;flex-wrap:wrap;gap:8px;font-size:12px;color:#5a6d80;margin-bottom:12px}
.article-meta span{background:#f1f5f9;padding:5px 10px;border-radius:20px}
.article-desc{background:#f8fafc;border-right:4px solid #00314c;padding:12px 14px;border-radius:6px;font-size:14px;line-height:1.8;color:#1e3346;margin:12px 0}
.article-content{font-size:15px;line-height:1.9;color:#1a2e40}
.article-content img{max-width:100%;height:auto;border-radius:8px;margin:10px 0}
.article-actions{display:flex;gap:10px;margin:16px 0;flex-wrap:wrap}
.btn{padding:8px 14px;border-radius:8px;font-size:13px;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.btn-primary{background:#00314c;color:#fff}
.btn-outline{border:1px solid #cbd9e6;color:#0b4a6e;background:#fff}
.article-footer{margin-top:18px;padding:14px;background:#fff;border:1px solid #eef2f7;border-radius:10px}

/* news-index.css */
.news-hero{background:linear-gradient(135deg,#00314c 0%,#09557d 100%);color:#fff;padding:22px 18px;border-radius:10px;margin:0 0 12px}
.news-hero h1{margin:0;font-size:22px;font-weight:700}
.news-hero p{margin:6px 0 0;opacity:.9;font-size:13px}
.news-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;padding:0}
.news-card{background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.08);transition:transform .15s,box-shadow .15s;border:1px solid #eef2f7}
.news-card:hover{transform:translateY(-3px);box-shadow:0 8px 22px rgba(0,0,0,.12)}
.news-card img{width:100%;height:160px;object-fit:cover;background:#eef2f7}
.news-card-body{padding:14px}
.news-card h3{margin:0 0 6px;font-size:16px;line-height:1.4;color:#14344a}
.news-card h3 a{color:inherit;text-decoration:none}
.news-card h3 a:hover{color:#0b4a6e}
.news-meta{font-size:12px;color:#6b7c8d;display:flex;gap:10px;align-items:center;margin:6px 0 8px}
.news-meta span{background:#f1f5f9;padding:3px 8px;border-radius:20px}
.news-excerpt{font-size:13px;line-height:1.7;color:#2d3e4f;max-height:52px;overflow:hidden}
.news-actions{margin-top:10px;display:flex;justify-content:space-between;align-items:center}
.news-actions .btn-read,
.btn-read{background:#00314c;color:#fff !important;padding:6px 14px;border-radius:20px;font-size:13px;text-decoration:none}
.news-actions .btn-read:visited,
.news-actions .btn-read:hover,
.news-actions .btn-read:active,
.news-actions .btn-read:focus,
.btn-read:visited,
.btn-read:hover,
.btn-read:active,
.btn-read:focus{color:#fff !important}
.news-actions .btn-read:hover,
.btn-read:hover{background:#0b4a6e;color:#fff !important}
.news-pagination{padding:12px;display:flex;justify-content:center}
.news-pagination nav{display:flex;gap:6px}
.news-pagination a,.news-pagination span{padding:6px 12px;border-radius:6px;border:1px solid #dde6ee;background:#fff;font-size:13px;text-decoration:none;color:#14344a}
.news-pagination .active{background:#00314c;color:#fff;border-color:#00314c}

/* book-index.css */
.hero{background:linear-gradient(135deg,#00314c 0%,#7c4d0a 100%);color:#fff;padding:20px;border-radius:10px;margin:0 0 12px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;padding:0}
.card{background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.07);border:1px solid #eef2f7;transition:.15s}
.card:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.1)}
.cover{width:100%;height:220px;object-fit:cover;background:#f1f5f9}

/* book-show.css */
.book-wrap{max-width:760px;margin:0 auto;padding:0}
.book-card{background:#fff;border:1px solid #eef2f7;border-radius:12px;overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,.06);display:flex;gap:16px;padding:16px;flex-wrap:wrap}
.cover{width:180px;height:240px;object-fit:cover;border-radius:8px;background:#f1f5f9}
.meta{display:flex;gap:8px;flex-wrap:wrap;font-size:12px;color:#5a6d80;margin:8px 0}
.meta span{background:#f1f5f9;padding:5px 10px;border-radius:20px}

/* doc-index.css */
/* ===== Documents Index â€” Modern v2 ===== */
.doc-index{max-width:1180px; margin:0 auto; padding:14px 14px 24px; width:100%; box-sizing:border-box}
@media(min-width:768px){ .doc-index{padding:18px 18px 28px} }

/* Hero */
.doc-hero{position:relative; overflow:hidden; border-radius:20px; background:linear-gradient(135deg,#0f3a4f 0%, #134e66 45%, #0e7490 100%); color:#fff; padding:22px 18px; display:flex; gap:18px; align-items:center; justify-content:space-between; isolation:isolate; box-shadow:0 10px 30px rgba(15,58,79,.22); border:1px solid rgba(255,255,255,.12)}
@media(min-width:768px){ .doc-hero{padding:26px 24px} }
.doc-hero__bg{position:absolute; inset:0; background:radial-gradient(520px 220px at 85% 0%, rgba(56,189,248,.18), transparent 60%), radial-gradient(420px 200px at 10% 100%, rgba(255,255,255,.08), transparent 60%); pointer-events:none}
.doc-hero__content{position:relative; z-index:1; flex:1; min-width:0}
.doc-hero__eyebrow{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px}
.doc-eyebrow-pill{display:inline-flex; align-items:center; gap:6px; font:700 11.8px var(--mh-font); padding:6px 10px; border-radius:999px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.18); color:#fff; backdrop-filter:blur(6px)}
.doc-eyebrow-pill--accent{background:#fff; color:#0f3a4f; border-color:#fff; box-shadow:0 4px 12px rgba(0,0,0,.12)}
.doc-eyebrow-pill--live{background:#f0fdf4; color:#065f46; border-color:#bbf7d0}
.doc-hero__title{margin:0; font:800 clamp(22px, 3.6vw, 28px)/1.25 var(--mh-font); letter-spacing:.2px; text-wrap:balance}
.doc-hero__desc{margin:8px 0 0; font:500 13.6px/1.75 var(--mh-font); color:#e2f0f7; max-width:62ch; opacity:.95}
.doc-hero__stats{display:flex; flex-wrap:wrap; gap:8px; margin-top:14px}
.doc-stat{display:inline-flex; align-items:center; gap:6px; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.18); padding:7px 11px; border-radius:999px; font:700 12.2px var(--mh-font); backdrop-filter:blur(6px)}
.doc-stat strong{font-weight:800; color:#fff}
.doc-hero__art{position:relative; z-index:1; display:none; flex-direction:column; align-items:center; gap:10px}
@media(min-width:880px){ .doc-hero__art{display:flex} }
.doc-hero__icon{width:72px; height:72px; border-radius:18px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.18); display:grid; place-items:center; font-size:34px; backdrop-filter:blur(8px); box-shadow:0 8px 18px rgba(0,0,0,.14)}
.doc-hero__grid-mini{display:grid; grid-template-columns:1fr 1fr; gap:6px; opacity:.9}
.doc-hero__grid-mini span{width:36px; height:26px; border-radius:8px; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.18); display:block}

/* Toolbar */
.doc-toolbar{display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:space-between; margin:14px 2px 12px; padding:10px 12px; background:#fff; border:1px solid var(--mh-border); border-radius:14px; box-shadow:0 2px 10px rgba(0,0,0,.04)}
.doc-toolbar__info{display:flex; flex-wrap:wrap; gap:8px; align-items:center; font:600 12.6px var(--mh-font); color:#475569}
.doc-toolbar__count strong{color:#0f3a4f}
.doc-toolbar__sep{color:#cbd5e1}
.doc-toolbar__hint{color:#64748b}
.doc-toolbar__badge{font:700 11.8px var(--mh-font); background:#f8fafc; border:1px solid #e2e8f0; padding:6px 10px; border-radius:999px; color:#334155}

/* Grid */
.doc-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:14px}
@media(max-width:640px){ .doc-grid{grid-template-columns:1fr} }

/* Card */
.doc-card{display:flex; flex-direction:column; background:#fff; border:1px solid var(--mh-border); border-radius:16px; overflow:hidden; box-shadow:0 2px 10px rgba(15,58,79,.06); text-decoration:none; color:inherit; transition:.18s; position:relative}
.doc-card:hover{transform:translateY(-3px); box-shadow:0 12px 28px rgba(15,58,79,.12); border-color:#dbeafe}
.doc-card__thumb{position:relative; background:#f1f5f9; padding:8px; border-bottom:1px solid #eef2f7}
.doc-thumb-mosaic{display:grid; grid-template-columns:1fr 1fr; gap:6px}
.doc-thumb-mosaic img{width:100%; height:78px; object-fit:cover; border-radius:10px; background:#e2e8f0; border:1px solid #e2e8f0; display:block}
.doc-thumb-mosaic__ph{height:78px; border-radius:10px; background:repeating-linear-gradient(45deg,#f8fafc,#f8fafc 8px,#eef2f7 8px,#eef2f7 16px); border:1px dashed #cbd5e1}
.doc-card__badge{position:absolute; top:12px; inset-inline-end:12px; background:rgba(15,58,79,.92); color:#fff; font:800 11px var(--mh-font); padding:6px 9px; border-radius:999px; box-shadow:0 4px 12px rgba(0,0,0,.18); border:1px solid rgba(255,255,255,.18)}
.doc-card__overlay{position:absolute; inset:0; display:grid; place-items:center; background:linear-gradient(180deg, transparent 40%, rgba(15,58,79,.62)); color:#fff; font:800 13px var(--mh-font); opacity:0; transition:.18s; backdrop-filter:blur(1px)}
.doc-card:hover .doc-card__overlay{opacity:1}
.doc-card__empty{display:grid; place-items:center; gap:6px; height:164px; color:#64748b; font:700 13px var(--mh-font); background:linear-gradient(180deg,#f8fafc,#eef2f7); border-radius:10px; border:1px dashed #cbd5e1}
.doc-card__empty-icon{font-size:28px; opacity:.9}
.doc-card__body{padding:14px 14px 12px; display:flex; flex-direction:column; gap:8px; flex:1}
.doc-card__title{margin:0; font:800 15px/1.45 var(--mh-font); color:#0f2e44; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:44px}
.doc-card__excerpt{margin:0; font:400 13px/1.7 var(--mh-font); color:#475569; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:44px}
.doc-card__excerpt--muted{color:#94a3b8; font-style:italic}
.doc-card__meta{display:flex; flex-wrap:wrap; gap:6px; margin-top:auto; padding-top:8px; border-top:1px dashed #eef2f7}
.doc-meta-chip{display:inline-flex; align-items:center; gap:6px; background:#f8fafc; border:1px solid #e2e8f0; color:#475569; padding:5px 9px; border-radius:999px; font:700 11.2px var(--mh-font)}
.doc-meta-chip--views{background:#eef6ff; border-color:#dbeafe; color:#0f3a4f}
.doc-meta-chip--imgs{background:#fefce8; border-color:#fde68a; color:#854d0e}

/* Empty */
.doc-empty{grid-column:1/-1; background:#fff; border:1px solid var(--mh-border); border-radius:16px; padding:30px 18px; text-align:center; box-shadow:0 2px 10px rgba(0,0,0,.04)}
.doc-empty__icon{font-size:34px; margin-bottom:8px}
.doc-empty h3{margin:0; font:800 16px var(--mh-font); color:#0f2e44}
.doc-empty p{margin:6px 0 0; font:500 13px var(--mh-font); color:#64748b}

/* Legacy compat: keep old class names working */
.hero{background:linear-gradient(135deg,#0f3a4f 0%, #0e7490 100%); color:#fff; padding:20px; border-radius:16px; margin:0 0 12px}
.grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:12px; padding:0}
.card{background:#fff; border-radius:14px; overflow:hidden; box-shadow:0 2px 10px rgba(0,0,0,.07); border:1px solid #eef2f7; transition:.15s}
.card:hover{transform:translateY(-2px); box-shadow:0 8px 18px rgba(0,0,0,.1)}
.thumb{width:100%; height:140px; background:#f1f5f9; display:grid; grid-template-columns:repeat(2,1fr); gap:2px; padding:6px}
.thumb img{width:100%; height:67px; object-fit:cover; border-radius:4px}


/* doc-show.css */
/* ===== Document Show â€” Modern v2 ===== */
:root{--doc-radius:18px; --doc-shadow:0 8px 30px rgba(15,58,79,.08); --doc-border:#e2e8f0}
.doc-page{max-width:1180px; margin:0 auto; padding:14px 14px 28px; width:100%; box-sizing:border-box}
@media(min-width:768px){ .doc-page{padding:18px 18px 32px} }

/* Breadcrumb */
.doc-crumb{display:flex; flex-wrap:wrap; gap:6px; align-items:center; font:600 12.5px var(--mh-font); color:#64748b; margin:2px 0 14px}
.doc-crumb a{display:inline-flex; align-items:center; gap:6px; background:#fff; border:1px solid #e2e8f0; padding:6px 12px; border-radius:999px; color:#0f3a4f; text-decoration:none; font-weight:700; transition:.15s; box-shadow:0 1px 2px rgba(0,0,0,.04)}
.doc-crumb a:hover{background:#f8fafc; border-color:#cbd5e1; color:#0e7490; transform:translateY(-1px)}
.doc-crumb .sep{color:#94a3b8; font-size:12px; padding:0 2px}
.doc-crumb .cur{background:linear-gradient(135deg,#0f3a4f,#134e66); color:#fff; border-color:#0f3a4f; padding:6px 13px; border-radius:999px; font:800 12px var(--mh-font); max-width:36ch; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; box-shadow:0 4px 12px rgba(15,58,79,.18)}
@media(max-width:640px){ .doc-crumb .cur{max-width:18ch} }

/* Hero card */
.doc-hero-card{background:#fff; border:1px solid var(--doc-border); border-radius:var(--doc-radius); overflow:hidden; box-shadow:var(--doc-shadow); position:relative; isolation:isolate}
.doc-hero-card::before{content:""; position:absolute; inset:0 0 auto 0; height:4px; background:linear-gradient(90deg,#0e7490 0%, #0f3a4f 55%, #f59e0b 100%); z-index:2}
.doc-hero-card__top{padding:18px 18px 14px; background:linear-gradient(180deg,#f8fbfc 0%, #ffffff 85%)}
@media(min-width:768px){ .doc-hero-card__top{padding:22px 22px 16px} }
.doc-eyebrow{display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:12px}
.doc-eyebrow .pill{display:inline-flex; align-items:center; gap:6px; font:700 11.5px var(--mh-font); padding:6px 10px; border-radius:999px; border:1px solid #e2e8f0; background:#f8fafc; color:#475569}
.doc-eyebrow .pill--cat{background:linear-gradient(135deg,#0f3a4f,#0e7490); color:#fff; border-color:#0f3a4f; box-shadow:0 4px 12px rgba(15,58,79,.15)}
.doc-eyebrow .pill--live{background:#f0fdf4; border-color:#bbf7d0; color:#166534}
.doc-eyebrow .pill--imgs{background:#fefce8; border-color:#fde68a; color:#854d0e}
.doc-eyebrow .pill--id{background:#eef2ff; border-color:#c7d2fe; color:#3730a3}
.doc-title{margin:0; font:800 clamp(20px, 3.8vw, 28px)/1.32 var(--mh-font); color:#0f2e44; letter-spacing:.1px; text-wrap:balance; overflow-wrap:anywhere}
.doc-meta{display:flex; flex-wrap:wrap; gap:8px; margin-top:14px}
.doc-meta .m{display:inline-flex; align-items:center; gap:6px; background:#fff; border:1px solid #e2e8f0; color:#334155; padding:7px 11px; border-radius:999px; font:700 12.2px var(--mh-font); box-shadow:0 1px 2px rgba(0,0,0,.04)}
.doc-meta .m--views{background:#eef6ff; border-color:#dbeafe; color:#0f3a4f}
.doc-meta .m--date{background:#f1f5f9}
.doc-excerpt{margin:12px 0 0; color:#1e293b; font:500 14px/1.85 var(--mh-font); background:#fffbeb; border:1px solid #fde68a; border-right:4px solid #f59e0b; padding:12px 14px; border-radius:12px}
.doc-progress{height:3px; background:#e2e8f0; border-radius:999px; overflow:hidden; margin-top:14px}
.doc-progress__bar{height:100%; width:0; background:linear-gradient(90deg,#0e7490,#38bdf8); border-radius:999px; transition:width .12s linear}
.doc-toolbar{display:flex; flex-wrap:wrap; gap:8px; align-items:center; justify-content:space-between; margin-top:14px; padding-top:12px; border-top:1px dashed #e2e8f0}
.doc-toolbar__group{display:flex; gap:8px; flex-wrap:wrap; align-items:center}
.doc-tbtn{display:inline-flex; align-items:center; gap:7px; padding:8px 12px; border-radius:999px; border:1px solid #e2e8f0; background:#fff; color:#0f3a4f; font:700 12.5px var(--mh-font); cursor:pointer; transition:.16s; text-decoration:none; user-select:none; box-shadow:0 1px 2px rgba(0,0,0,.04)}
.doc-tbtn:hover{transform:translateY(-1px); box-shadow:0 6px 14px rgba(15,58,79,.09); border-color:#cbd5e1}
.doc-tbtn--primary{background:linear-gradient(180deg,#0f3a4f,#134e66); color:#fff; border-color:#0f3a4f; box-shadow:0 6px 16px rgba(15,58,79,.18)}
.doc-tbtn--primary:hover{background:linear-gradient(180deg,#134e66,#0e7490)}
.doc-tbtn--ghost{background:#f8fafc}

/* Viewer */
.doc-viewer{background:#fff; border:1px solid var(--doc-border); border-radius:var(--doc-radius); box-shadow:var(--doc-shadow); overflow:hidden; margin-top:14px}
.doc-viewer__head{display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:space-between; padding:14px 16px; background:linear-gradient(180deg,#f8fafc,#fff); border-bottom:1px solid #eef2f7}
.doc-viewer__title{margin:0; font:800 14px var(--mh-font); color:#0f2e44; display:flex; align-items:center; gap:8px}
.doc-viewer__title::before{content:""; width:4px; height:18px; background:linear-gradient(180deg,#f59e0b,#0e7490); border-radius:999px; display:inline-block}
.doc-viewer__hint{font:600 11.8px var(--mh-font); color:#94a3b8; background:#f8fafc; border:1px solid #e2e8f0; padding:5px 9px; border-radius:999px}
.doc-viewer__stage{position:relative; background:#0f172a; display:grid; place-items:center; min-height:360px; overflow:hidden}
@media(min-width:768px){ .doc-viewer__stage{min-height:500px} }
.doc-stage__frame{width:100%; height:100%; display:grid; place-items:center; padding:16px; box-sizing:border-box}
.doc-viewer__stage img{max-width:100%; max-height:70vh; width:auto; height:auto; object-fit:contain; border-radius:10px; box-shadow:0 10px 30px rgba(0,0,0,.35); cursor:zoom-in; transition:opacity .2s, transform .2s; background:#fff}
.doc-viewer__stage img:hover{transform:scale(1.01)}
.doc-stage__bar{position:absolute; inset:auto 0 0 0; display:flex; flex-wrap:wrap; gap:8px; align-items:center; padding:10px 12px; background:linear-gradient(180deg, transparent, rgba(0,0,0,.55)); color:#fff; font:700 12px var(--mh-font)}
.doc-counter{background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.22); padding:5px 9px; border-radius:999px; backdrop-filter:blur(6px)}
.doc-counter__sep{opacity:.6}
.doc-stage__title{flex:1; min-width:120px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; opacity:.92}
.doc-stage__actions{display:flex; gap:6px}
.doc-chip-btn{display:inline-flex; align-items:center; gap:6px; background:#fff; color:#0f3a4f; padding:6px 10px; border-radius:999px; font:800 11.5px var(--mh-font); text-decoration:none; border:1px solid #fff}
.doc-chip-btn--ghost{background:rgba(255,255,255,.16); color:#fff; border-color:rgba(255,255,255,.22); backdrop-filter:blur(6px)}
.doc-nav{position:absolute; top:50%; transform:translateY(-50%); width:42px; height:42px; border-radius:999px; border:1px solid rgba(255,255,255,.22); background:rgba(255,255,255,.14); color:#fff; font:800 18px var(--mh-font); display:grid; place-items:center; cursor:pointer; backdrop-filter:blur(8px); transition:.15s; z-index:2}
.doc-nav:hover{background:rgba(255,255,255,.9); color:#0f3a4f; border-color:#fff; transform:translateY(-50%) scale(1.06)}
.doc-nav--prev{inset-inline-start:14px}
.doc-nav--next{inset-inline-end:14px}
.doc-stage__loader{position:absolute; inset:0; display:grid; place-items:center; background:rgba(15,23,42,.62); color:#fff; font:700 13px var(--mh-font); backdrop-filter:blur(4px); z-index:1}
.doc-stage__loader[hidden]{display:none !important}

/* Thumbs */
.doc-thumbs{display:flex; gap:8px; padding:12px; overflow-x:auto; scrollbar-width:thin; background:#f8fafc; border-top:1px solid #eef2f7; scroll-behavior:smooth}
.doc-thumb{position:relative; flex:0 0 78px; width:78px; height:78px; border-radius:12px; overflow:hidden; border:2px solid transparent; background:#fff; padding:0; cursor:pointer; transition:.15s; box-shadow:0 1px 4px rgba(0,0,0,.06)}
.doc-thumb img{width:100%; height:100%; object-fit:cover; display:block}
.doc-thumb__num{position:absolute; bottom:4px; inset-inline-end:4px; background:rgba(15,58,79,.88); color:#fff; font:800 10px var(--mh-font); padding:2px 6px; border-radius:999px; line-height:1}
.doc-thumb.is-active{border-color:#0e7490; box-shadow:0 0 0 3px rgba(14,116,144,.18), 0 4px 12px rgba(0,0,0,.1); transform:translateY(-1px)}
.doc-thumb:hover{border-color:#cbd5e1}

/* Grid all */
.doc-grid-all{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:8px; padding:12px; background:#fff; border-top:1px solid #eef2f7}
.doc-grid-all__item{display:block; border-radius:10px; overflow:hidden; border:1px solid #eef2f7; aspect-ratio:4/3; background:#f1f5f9}
.doc-grid-all__item img{width:100%; height:100%; object-fit:cover; transition:transform .2s}
.doc-grid-all__item:hover img{transform:scale(1.04)}

/* Empty view */
.doc-empty-view{background:#fff; border:1px dashed #cbd5e1; border-radius:14px; padding:28px; text-align:center; margin-top:14px; color:#64748b; font:700 13px var(--mh-font)}
.doc-empty-view__icon{font-size:32px; display:block; margin-bottom:8px}

/* Prev/Next */
.doc-pn{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:14px}
@media(max-width:640px){ .doc-pn{grid-template-columns:1fr} }
.doc-pn__card{background:#fff; border:1px solid #e2e8f0; border-radius:14px; padding:12px 14px; text-decoration:none; color:#0f2e44; display:flex; flex-direction:column; gap:6px; transition:.16s; box-shadow:0 2px 8px rgba(0,0,0,.04)}
.doc-pn__card:hover{transform:translateY(-1px); box-shadow:0 8px 20px rgba(0,0,0,.07); border-color:#cbd5e1}
.doc-pn__card .k{font:700 11px var(--mh-font); color:#0e7490}
.doc-pn__card .t{font:700 13.5px/1.5 var(--mh-font); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.doc-pn__card .d{font:600 11px var(--mh-font); color:#64748b}
.doc-pn__card--disabled{background:#f8fafc; color:#94a3b8; border-style:dashed; justify-content:center; align-items:center; text-align:center; font:600 12.5px var(--mh-font); min-height:80px}
.doc-pn__card--next{text-align:left}

/* Share row */
.doc-share-row{display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:14px; padding:12px 14px; background:#fff; border:1px solid var(--doc-border); border-radius:14px; box-shadow:var(--doc-shadow)}
.doc-share-row .lbl{font:700 12px var(--mh-font); color:#64748b}
.doc-share-row a{width:38px; height:38px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; border:1px solid #e2e8f0; background:#fff; color:#0f3a4f; text-decoration:none; transition:.15s; font-size:16px; box-shadow:0 1px 3px rgba(0,0,0,.06)}
.doc-share-row a:hover{transform:translateY(-2px); box-shadow:0 8px 16px rgba(0,0,0,.08); background:#0f3a4f; color:#fff; border-color:#0f3a4f}

/* Sections */
.doc-sections{display:flex; flex-direction:column; gap:14px; margin-top:14px}
.doc-section{background:#fff; border:1px solid var(--doc-border); border-radius:var(--doc-radius); box-shadow:var(--doc-shadow); padding:16px}
@media(min-width:768px){ .doc-section{padding:18px} }
.doc-section--comments{background:#f8fafc}
.doc-section__head{display:flex; align-items:center; gap:10px; margin-bottom:12px; flex-wrap:wrap; justify-content:space-between}
.doc-section__title{margin:0; font:800 15px var(--mh-font); color:#0f2e44; display:flex; align-items:center; gap:8px}
.doc-section__title::before{content:""; width:4px; height:18px; background:linear-gradient(180deg,#f59e0b,#0e7490); border-radius:999px; display:inline-block}
.doc-section__hint{font:600 11.8px var(--mh-font); color:#94a3b8; background:#fff; border:1px solid #e2e8f0; padding:5px 9px; border-radius:999px}
.doc-comments-wrap{display:block; width:100%; overflow:visible}

/* Related */
.doc-related{background:#fff; border:1px solid var(--doc-border); border-radius:var(--doc-radius); box-shadow:var(--doc-shadow); padding:16px; margin-top:14px}
.doc-related__head{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px; flex-wrap:wrap}
.doc-related__title{margin:0; font:800 15px var(--mh-font); color:#0f2e44; display:flex; align-items:center; gap:8px}
.doc-related__title::before{content:""; width:4px; height:18px; background:#0e7490; border-radius:999px; display:inline-block}
.doc-related__more{font:700 12px var(--mh-font); color:#0e7490; background:#fff; border:1px solid #e2e8f0; padding:6px 10px; border-radius:999px; text-decoration:none}
.doc-related__grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:10px}
@media(max-width:640px){ .doc-related__grid{grid-template-columns:1fr 1fr} }
@media(max-width:400px){ .doc-related__grid{grid-template-columns:1fr} }
.doc-rel{display:flex; flex-direction:column; gap:8px; background:#fff; border:1px solid #eef2f7; border-radius:14px; overflow:hidden; text-decoration:none; color:#0f2e44; transition:.16s}
.doc-rel:hover{transform:translateY(-2px); box-shadow:0 10px 22px rgba(15,58,79,.08); border-color:#dbeafe}
.doc-rel__thumb{position:relative; height:110px; background:#f1f5f9; overflow:hidden}
.doc-rel__thumb img{width:100%; height:100%; object-fit:cover}
.doc-rel__ph{width:100%; height:100%; display:grid; place-items:center; font-size:28px; color:#94a3b8; background:linear-gradient(180deg,#f8fafc,#eef2f7)}
.doc-rel__badge{position:absolute; top:8px; inset-inline-end:8px; background:rgba(15,58,79,.88); color:#fff; font:800 10px var(--mh-font); padding:4px 7px; border-radius:999px; border:1px solid rgba(255,255,255,.18)}
.doc-rel__t{font:700 13px/1.5 var(--mh-font); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; padding:0 10px}
.doc-rel__meta{display:flex; gap:8px; font:600 11px var(--mh-font); color:#64748b; padding:0 10px 10px}

/* Lightbox */
.doc-lightbox{position:fixed; inset:0; background:rgba(2,8,23,.88); backdrop-filter:blur(8px); display:grid; place-items:center; padding:22px; z-index:9999}
.doc-lightbox[hidden]{display:none !important}
.doc-lightbox__img{max-width:min(92vw,1100px); max-height:88vh; object-fit:contain; border-radius:12px; box-shadow:0 20px 60px rgba(0,0,0,.5); background:#fff}
.doc-lightbox__close{position:absolute; top:14px; inset-inline-end:14px; width:44px; height:44px; border-radius:999px; border:1px solid rgba(255,255,255,.22); background:rgba(255,255,255,.12); color:#fff; font:400 28px/1 var(--mh-font); cursor:pointer; display:grid; place-items:center; backdrop-filter:blur(8px)}
.doc-lightbox__nav{position:absolute; top:50%; transform:translateY(-50%); width:48px; height:48px; border-radius:999px; border:1px solid rgba(255,255,255,.22); background:rgba(255,255,255,.14); color:#fff; font:800 22px var(--mh-font); display:grid; place-items:center; cursor:pointer; backdrop-filter:blur(8px)}
.doc-lightbox__nav--prev{inset-inline-start:16px}
.doc-lightbox__nav--next{inset-inline-end:16px}
.doc-lightbox__nav:hover, .doc-lightbox__close:hover{background:#fff; color:#0f3a4f}
.doc-lightbox__cap{position:absolute; bottom:14px; left:50%; transform:translateX(-50%); background:rgba(255,255,255,.92); color:#0f2e44; padding:7px 12px; border-radius:999px; font:700 12px var(--mh-font); box-shadow:0 6px 18px rgba(0,0,0,.18)}

/* Legacy compat */
.doc-wrap{max-width:760px; margin:0 auto; padding:0}
.doc-card{background:#fff; border:1px solid #eef2f7; border-radius:12px; overflow:hidden; box-shadow:0 2px 12px rgba(0,0,0,.06)}
.gallery{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:8px; padding:12px}
.gallery a{display:block; border-radius:8px; overflow:hidden; border:1px solid #eef2f7}
.gallery img{width:100%; height:120px; object-fit:cover; transition:transform .2s}
.gallery a:hover img{transform:scale(1.05)}
.meta{display:flex; gap:8px; flex-wrap:wrap; font-size:12px; color:#5a6d80; margin:8px 0}
.meta span{background:#f1f5f9; padding:5px 10px; border-radius:20px}


/* audio-index.css */
.media-hero{background:linear-gradient(135deg,#00314c 0%,#1a7a3a 100%);color:#fff;padding:20px;border-radius:10px;margin:0 0 12px}
.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;padding:0}
.media-card{background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.07);border:1px solid #eef2f7;transition:.15s}
.media-card:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.1)}
.media-card-body{padding:14px}
.media-card h3{margin:0;font-size:15px;color:#0f2e44;line-height:1.4}
.media-meta{font-size:12px;color:#6b7c8d;display:flex;gap:8px;margin-top:6px}
.icon{width:40px;height:40px;border-radius:8px;background:#e8f5e9;display:flex;align-items:center;justify-content:center;font-size:18px}

/* audio-show.css */
.audio-wrap{max-width:760px;margin:0 auto;padding:0}
.audio-card{background:#fff;border:1px solid #eef2f7;border-radius:12px;overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,.06)}
.audio-player{background:linear-gradient(135deg,#0f4c0f 0%,#1a7a3a 100%);padding:18px;color:#fff}
.audio-player audio{width:100%;margin-top:10px;border-radius:8px}
.meta{display:flex;gap:8px;flex-wrap:wrap;font-size:12px;margin-top:10px}
.meta span{background:rgba(255,255,255,.15);padding:5px 10px;border-radius:20px}

/* video-index.css */
.media-hero{background:linear-gradient(135deg,#0f3a4f 0%,#0e7490 100%);color:#fff;padding:20px;border-radius:10px;margin:0 0 12px}
.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;padding:0}
.media-card{background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.07);border:1px solid #eef2f7;transition:.15s}
.media-card:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.1)}
.thumb{width:100%;height:168px;background:#0f2e44;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}
.thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s}
.media-card:hover .thumb img{transform:scale(1.04)}
.thumb--yt{background:#000}
.thumb--fallback{background:linear-gradient(135deg,#0f2e44 0%,#134e66 45%,#0e7490 100%);color:#fff}
.thumb__fallback-inner{display:flex;flex-direction:column;align-items:center;gap:7px;color:#e6f0f6}
.thumb__fallback-icon{opacity:.98;display:flex;filter:drop-shadow(0 2px 6px rgba(0,0,0,.25))}
.thumb__fallback-label{font:700 12px var(--mh-font);letter-spacing:.3px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);padding:3px 9px;border-radius:999px;backdrop-filter:blur(4px)}
.thumb__play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}
.thumb__play-icon{width:54px;height:54px;border-radius:999px;background:rgba(0,0,0,.58);backdrop-filter:blur(4px);border:2px solid rgba(255,255,255,.92);display:inline-flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 4px 16px rgba(0,0,0,.35);transition:transform .18s,background .18s}
.media-card:hover .thumb__play-icon{transform:scale(1.06);background:rgba(220,20,20,.92);border-color:#fff}
.thumb__play-icon--sm{width:42px;height:42px}
.thumb__play-icon svg{margin-left:2px}
.thumb__badge{position:absolute;top:8px;right:8px;background:#ff0000;color:#fff;font:800 10px var(--mh-font);letter-spacing:.4px;padding:4px 7px;border-radius:6px;box-shadow:0 2px 8px rgba(0,0,0,.25)}

/* video-show.css */
.video-wrap{max-width:760px;margin:0 auto;padding:0}
.video-card{background:#fff;border:1px solid #eef2f7;border-radius:12px;overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,.06)}
.player{width:100%;background:#000;aspect-ratio:16/9;display:flex;align-items:center;justify-content:center}
.player video,.player iframe{width:100%;height:100%;border:0}
.meta{display:flex;gap:8px;flex-wrap:wrap;font-size:12px;color:#5a6d80;margin:10px 0}
.meta span{background:#f1f5f9;padding:5px 10px;border-radius:20px}

/* contact.css */
/* front/contact.css â€” modern contact page */
.contact-page{max-width:1180px; margin:0 auto; padding:14px 14px 28px; width:100%; box-sizing:border-box}
@media(min-width:768px){ .contact-page{padding:18px 18px 32px} }
.contact-crumb{display:flex; flex-wrap:wrap; gap:6px; align-items:center; font:600 12.5px var(--mh-font); color:#64748b; margin:2px 0 14px}
.contact-crumb a{display:inline-flex; align-items:center; gap:6px; background:#fff; border:1px solid #e2e8f0; padding:6px 12px; border-radius:999px; color:#0f3a4f; text-decoration:none; font-weight:700; transition:.15s; box-shadow:0 1px 2px rgba(0,0,0,.04)}
.contact-crumb a:hover{background:#f8fafc; border-color:#cbd5e1}
.contact-crumb .sep{color:#94a3b8}
.contact-crumb .cur{background:linear-gradient(135deg,#0f3a4f,#134e66); color:#fff; padding:6px 13px; border-radius:999px; font:800 12px var(--mh-font); box-shadow:0 4px 12px rgba(15,58,79,.18)}
.contact-hero{position:relative; overflow:hidden; border-radius:20px; background:linear-gradient(135deg,#0f3a4f 0%, #134e66 45%, #0e7490 100%); color:#fff; padding:22px 18px; display:flex; gap:18px; align-items:center; justify-content:space-between; isolation:isolate; box-shadow:0 10px 30px rgba(15,58,79,.22); border:1px solid rgba(255,255,255,.12)}
@media(min-width:768px){ .contact-hero{padding:26px 24px} }
.contact-hero__content{flex:1; min-width:0; z-index:1}
.contact-hero__eyebrow{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px}
.contact-hero__eyebrow .pill{display:inline-flex; align-items:center; gap:6px; font:700 11.8px var(--mh-font); padding:6px 10px; border-radius:999px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.18); color:#fff; backdrop-filter:blur(6px)}
.contact-hero__eyebrow .pill--accent{background:#fff; color:#0f3a4f; border-color:#fff}
.contact-hero__title{margin:0; font:800 clamp(22px,3.6vw,28px)/1.25 var(--mh-font)}
.contact-hero__desc{margin:8px 0 0; font:500 13.6px/1.75 var(--mh-font); color:#e2f0f7; max-width:62ch; opacity:.95}
.contact-hero__meta{display:flex; flex-wrap:wrap; gap:8px; margin-top:14px}
.contact-hero__meta .cm{display:inline-flex; align-items:center; gap:6px; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.18); padding:7px 11px; border-radius:999px; font:700 12.2px var(--mh-font); backdrop-filter:blur(6px)}
.contact-hero__art{display:none; flex-direction:column; align-items:center; gap:10px; z-index:1}
@media(min-width:880px){ .contact-hero__art{display:flex} }
.contact-hero__icon{width:72px; height:72px; border-radius:18px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.18); display:grid; place-items:center; font-size:34px; backdrop-filter:blur(8px)}
.contact-hero__lines{display:grid; gap:6px}
.contact-hero__lines span{width:56px; height:8px; border-radius:999px; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.18); display:block}
.contact-hero__lines span:nth-child(2){width:40px; opacity:.8}
.contact-hero__lines span:nth-child(3){width:48px; opacity:.9}
.contact-alert{margin-top:14px; padding:12px 14px; border-radius:12px; font:600 13px var(--mh-font); border:1px solid}
.contact-alert--success{background:#ecfdf5; border-color:#a7f3d0; color:#065f46}
.contact-alert--error{background:#fef2f2; border-color:#fecaca; color:#7f1d1d}
.contact-layout{display:grid; grid-template-columns:1fr; gap:14px; margin-top:14px; align-items:start}
@media(min-width:980px){ .contact-layout{grid-template-columns: minmax(0,1fr) 340px} }
.contact-main{background:#fff; border:1px solid #e2e8f0; border-radius:18px; box-shadow:0 8px 30px rgba(15,58,79,.08); padding:18px}
@media(min-width:768px){ .contact-main{padding:22px} }
.contact-form{display:block}
.contact-aside{display:flex; flex-direction:column; gap:12px}
.contact-card{background:#fff; border:1px solid #e2e8f0; border-radius:18px; box-shadow:0 8px 30px rgba(15,58,79,.08); overflow:hidden}
.contact-card__title{margin:0; padding:14px 16px; font:800 13.5px var(--mh-font); color:#0f2e44; border-bottom:1px solid #eef2f7; background:linear-gradient(180deg,#f8fafc,#fff); display:flex; align-items:center; gap:8px}
.contact-card__body{padding:14px 16px; display:grid; gap:10px}
.contact-info-row{display:flex; align-items:center; justify-content:space-between; gap:10px; background:#f8fafc; border:1px solid #eef2f7; padding:9px 11px; border-radius:12px; font:600 12.5px var(--mh-font); color:#334155}
.contact-info-row .k{color:#64748b; font-weight:700}
.contact-info-row .v{color:#0f3a4f; font-weight:800}
.contact-tip{background:#fffbeb; border:1px solid #fde68a; border-radius:12px; padding:10px 12px; font:500 12.5px/1.7 var(--mh-font); color:#92400e}
.contact-card--muted .contact-card__body{background:#f8fafc}
.contact-muted-text{margin:0; font:500 12.8px/1.8 var(--mh-font); color:#475569}


/* comment-form.css */
/* front/comment-form.css â€” BEM for comment form, replaces inline style="" */
.mhdi-grid-2{display:grid; grid-template-columns:1fr 1fr; gap:14px}
@media(max-width:640px){ .mhdi-grid-2{grid-template-columns:1fr !important} }
[id^="mhdi-comment-form-"] input:focus, [id^="mhdi-comment-form-"] textarea:focus{border-color:#0e7490 !important; box-shadow:0 0 0 4px rgba(14,116,144,.14) !important}

/* Extracted from Blade inline */
.cf-wrap{clear:both; display:block; width:100%; box-sizing:border-box; background:#ffffff; border:1px solid #e2e8f0; border-radius:14px; padding:20px 16px 26px 16px; margin:18px 0 32px 0; box-shadow:0 4px 16px rgba(15,58,79,.07); scroll-margin-top:24px; overflow:visible; height:auto; font-family:var(--mh-font, Tajawal, sans-serif); position:relative; z-index:10; isolation:isolate}
.cf-header{display:flex; align-items:center; gap:10px; margin-bottom:14px; flex-wrap:wrap}
.cf-title{margin:0; font:800 15px var(--mh-font, Tajawal, sans-serif); color:#0f3a4f; display:flex; align-items:center; gap:8px}
.cf-badge{font:500 11px var(--mh-font); color:#64748b; background:#f1f5f9; padding:4px 8px; border-radius:999px}
.cf-alert-success{background:#ecfdf5; border:1px solid #a7f3d0; color:#065f46; padding:11px 12px; border-radius:10px; font:500 13px var(--mh-font); margin-bottom:12px; display:flex; gap:8px; align-items:center}
.cf-alert-error{background:#fef2f2; border:1px solid #fecaca; color:#7f1d1d; padding:11px 12px; border-radius:10px; font:500 13px var(--mh-font); margin-bottom:12px}
.cf-form{display:block; width:100%; height:auto; min-height:0; overflow:visible; position:relative; z-index:1}
.cf-honeypot{position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; clip-path:inset(50%) !important; white-space:nowrap !important; border:0 !important; opacity:0 !important; pointer-events:none !important}
.cf-grid{display:grid; gap:14px; width:100%}
.cf-field{min-width:0}
.cf-label{font:700 12px var(--mh-font); color:#1e293b}
.cf-label .req{color:#dc2626}
.cf-label .opt{font:400 11px; color:#94a3b8}
.cf-input{width:100%; margin-top:6px; padding:11px 12px; border:1px solid #cbd5e1; border-radius:10px; font:500 14px var(--mh-font); background:#ffffff; outline:none; transition:border .15s, box-shadow .15s; box-sizing:border-box}
.cf-input--email{direction:ltr; text-align:left}
.cf-hint{font:400 11px var(--mh-font); color:#94a3b8; margin-top:4px}
.cf-textarea{width:100%; margin-top:6px; padding:12px; border:1px solid #cbd5e1; border-radius:10px; font:500 14px var(--mh-font); background:#ffffff; resize:vertical; line-height:1.8; outline:none; transition:border .15s; box-sizing:border-box; min-height:120px}
.cf-counter-row{display:flex; justify-content:space-between; gap:10px; margin-top:6px; font:400 11px var(--mh-font); color:#64748b}
.cf-counter{background:#f1f5f9; padding:3px 8px; border-radius:999px; direction:ltr; font:700 11px var(--mh-font); flex-shrink:0}
.cf-captcha{background:#fffbeb; border:1px solid #fde68a; border-radius:12px; padding:14px; display:grid; gap:10px; width:100%; box-sizing:border-box}
.cf-captcha__head{display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.cf-captcha__title{font:800 13px var(--mh-font); color:#92400e}
.cf-captcha__sub{font:400 12px var(--mh-font); color:#6b7280}
.cf-captcha__row{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.cf-captcha__question{background:#ffffff; border:1px solid #fcd34d; padding:10px 14px; border-radius:10px; font:800 16px var(--mh-font); color:#78350f; min-width:140px; text-align:center; letter-spacing:.5px; flex-shrink:0}
.cf-captcha__eq{color:#92400e; font:800 16px var(--mh-font); flex-shrink:0}
.cf-captcha__input{width:110px; padding:10px; border:1px solid #fcd34d; border-radius:10px; font:700 15px var(--mh-font); background:#ffffff; outline:none; text-align:center; transition:border .15s; box-sizing:border-box; flex-shrink:0}
.cf-captcha__reload{font:500 11px var(--mh-font); color:#0f3a4f; background:#fff; border:1px solid #e2e8f0; padding:6px 10px; border-radius:999px; cursor:pointer; flex-shrink:0}
.cf-captcha__hint{font:400 11px var(--mh-font); color:#92400e}
.cf-submit-row{display:flex; gap:10px; align-items:center; flex-wrap:wrap; padding-top:14px; margin-top:4px; border-top:1px solid #f1f5f9}
.cf-submit{background:linear-gradient(180deg, #0f3a4f, #134e66); color:#ffffff; padding:12px 20px; border-radius:999px; border:0; font:800 14px var(--mh-font); cursor:pointer; display:inline-flex; align-items:center; gap:8px; box-shadow:0 4px 12px rgba(15,58,79,.22); transition:transform .12s, opacity .12s; flex-shrink:0}
.cf-submit__note{font:400 12px var(--mh-font); color:#64748b}
.cf-submit__note strong{color:#0e7490; font-weight:700}


/* comments.css */
/* front/comments.css â€” BEM for comments list, replaces inline style="" */
.mh-comments{clear:both;position:relative;z-index:0;margin-top:16px;scroll-margin-top:20px;overflow:visible}
.mh-comments__header{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.mh-comments__title{margin:0;font-size:16px;color:#0f2e44;display:flex;align-items:center;gap:8px}
.mh-comments__count-badge{background:#00314c;color:#fff;font-size:12px;padding:3px 10px;border-radius:20px}
.mh-comments__meta{font-size:12px;color:#5a6d80;background:#f1f5f9;padding:4px 10px;border-radius:20px}
.mh-comments__add{margin-right:auto;background:#00314c;border:1px solid #00314c;color:#fff !important;padding:6px 12px;border-radius:8px;font-size:13px;text-decoration:none}.mh-comments__add:visited,.mh-comments__add:hover,.mh-comments__add:active,.mh-comments__add:focus{color:#fff !important;background:#00314c}a[href^="#comment-form-"]{color:#fff !important}a[href^="#comment-form-"]:visited,a[href^="#comment-form-"]:hover,a[href^="#comment-form-"]:active{color:#fff !important}
.mh-comments__pages{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-bottom:12px;font-size:13px}
.mh-comments__pages-label{color:#6b7c8d}
.mh-comments__page--active{background:#00314c;color:#fff;padding:4px 10px;border-radius:6px;font-weight:700}
.mh-comments__page{ background:#fff;border:1px solid #dde6ee;padding:4px 10px;border-radius:6px;color:#0b4a6e;text-decoration:none}
.mh-comment{background:#fff;border:1px solid #eef2f7;border-radius:12px;padding:14px 16px;margin-bottom:12px;box-shadow:0 1px 6px rgba(0,0,0,.04)}
.mh-comment__row{display:flex;gap:12px;align-items:flex-start}
.mh-comment__avatar{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#00314c 0%,#0e6a9a 100%);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:16px;flex-shrink:0}
.mh-comment__body{flex:1;min-width:0}
.mh-comment__head{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.mh-comment__name{font-weight:800;font-size:14px;color:#0f2e44}
.mh-comment__title{color:#0e6a9a;font-size:13px}
.mh-comment__badge{margin-right:auto;font-size:11px;background:#e8f5e9;color:#1a7a3a;padding:3px 8px;border-radius:20px;white-space:nowrap}
.mh-comment__meta{font-size:12px;color:#8aa0b3;margin-top:2px;display:flex;gap:8px;flex-wrap:wrap}
.mh-comment__mail{direction:ltr}
.mh-comment__text{margin-top:10px;font-size:14.5px;line-height:1.85;color:#1e3346;white-space:pre-wrap;word-break:break-word;background:#f8fafc;border-radius:8px;padding:10px 12px;border-right:3px solid #e2e8f0}
.mh-comments__empty{background:#f8fafc;border:1px dashed #cbd9e6;border-radius:12px;padding:28px 20px;text-align:center;color:#6b7c8d}
.mh-comments__empty-icon{font-size:32px;margin-bottom:8px}
.mh-comments__empty-title{font-size:15px;font-weight:600;color:#334155}
.mh-comments__empty-hint{font-size:13px;margin-top:6px}
.mh-comments__empty-btn{display:inline-block;margin-top:12px;background:#00314c;color:#fff !important;padding:8px 16px;border-radius:8px;font-size:13px;text-decoration:none}.mh-comments__empty-btn:visited,.mh-comments__empty-btn:hover,.mh-comments__empty-btn:active,.mh-comments__empty-btn:focus{color:#fff !important}
.mh-comments__nav{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:14px;font-size:13px;justify-content:center}
.mh-comments__nav-btn{background:#fff;border:1px solid #dde6ee;padding:6px 14px;border-radius:8px;color:#0b4a6e;text-decoration:none}
.mh-comments__nav-btn--disabled{background:#f1f5f9;color:#94a3b8;padding:6px 14px;border-radius:8px}
.mh-comments__nav-info{color:#6b7c8d;font-size:12px}
.mh-comments__nav-btn--primary{background:#00314c;color:#fff;padding:6px 14px;border-radius:8px;text-decoration:none}


/* search-page.css */
/* front/search-page.css â€” extracted from search/index inline */
.search-head__count{font:700 13px var(--mh-font); color:var(--mh-muted); background:#f1f5f9; padding:6px 12px; border-radius:999px}
.search-form-wrap{padding:16px 16px 0}
.search-form{display:flex; gap:8px; flex-wrap:wrap; align-items:center}
.search-input{flex:1; min-width:200px; padding:10px 14px; border:1px solid #e2e8f0; border-radius:999px; background:#f8fafc; font:500 14px var(--mh-font); outline:0}
.search-btn{padding:10px 18px; border-radius:999px; border:0; background:var(--mh-primary); color:#fff; font:800 13px var(--mh-font); cursor:pointer}
.search-clear{padding:10px 14px; border-radius:999px; border:1px solid #e2e8f0; background:#fff; color:var(--mh-muted); text-decoration:none; font:700 13px var(--mh-font)}
.search-hint{margin:12px 0 0; color:var(--mh-muted); font:400 13px/1.7 var(--mh-font)}
.search-no-results{margin:14px 0 0; padding:12px; background:#fff7ed; border:1px solid #fed7aa; border-radius:10px; color:#9a3412; font:500 13px var(--mh-font)}
.search-results{list-style:none; margin:16px 0 0; padding:0 16px 8px; border-top:1px solid #e2e8f0}
.search-item{padding:14px 0; border-bottom:1px dashed #e2e8f0; display:flex; gap:12px; align-items:flex-start}
.search-item__icon{flex:0 0 36px; height:36px; border-radius:10px; background:#eef4f8; color:var(--mh-primary); display:inline-flex; align-items:center; justify-content:center; font-size:16px}
.search-item__meta{display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:4px}
.search-item__badge{font:700 11px var(--mh-font); color:#fff; background:var(--mh-accent); padding:2px 8px; border-radius:999px}
.search-item__date{font:400 12px var(--mh-font); color:var(--mh-muted)}
.search-item__title{font:800 14px/1.5 var(--mh-font); color:var(--mh-primary); text-decoration:none; display:inline}
.search-item__excerpt{margin:6px 0 0; color:var(--mh-muted); font:400 13px/1.7 var(--mh-font); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.search-pagination{padding:14px 16px 16px; display:flex; gap:8px; flex-wrap:wrap; justify-content:center; border-top:1px solid #f1f5f9}
.search-page-num{min-width:36px; text-align:center; padding:8px 12px; border-radius:999px; text-decoration:none; font:800 13px var(--mh-font)}
.search-page-num--active{background:var(--mh-primary); color:#fff; border:1px solid var(--mh-primary)}
.search-page-num--inactive{background:#fff; color:var(--mh-primary); border:1px solid #e2e8f0}
.search-quicklinks{margin:8px 16px 16px; display:flex; gap:8px; flex-wrap:wrap; padding-top:14px; border-top:1px solid #f1f5f9}
.search-pill{padding:6px 12px; background:#fff; border:1px solid #e2e8f0; border-radius:999px; color:var(--mh-primary); text-decoration:none; font:700 13px var(--mh-font)}


/* sitemap.css */
/* front/sitemap.css â€” extracted from sitemap/index inline */
.sitemap-grid{padding:18px; display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:18px}
.sitemap-section{background:#f8fafc; border:1px solid #e2e8f0; border-radius:12px; padding:14px}
.sitemap-section__head{margin:0 0 10px; font:800 14px var(--mh-font); color:var(--mh-primary); display:flex; align-items:center; gap:8px}
.sitemap-dot{width:6px; height:6px; background:var(--mh-accent); border-radius:50%; display:inline-block}
.sitemap-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px}
.sitemap-link{display:flex; align-items:center; gap:8px; padding:8px 10px; background:#fff; border:1px solid #eef2f7; border-radius:8px; color:#1e293b; text-decoration:none; font:500 13px var(--mh-font); transition:.15s}
.sitemap-link:hover{background:#f8fafc; border-color:#e2e8f0}
.sitemap-arrow{color:var(--mh-accent)}
.sitemap-footer{padding:12px 18px; border-top:1px solid #e2e8f0; background:#f8fafc; display:flex; gap:8px; flex-wrap:wrap}
.sitemap-pill{padding:6px 12px; background:#fff; border:1px solid #e2e8f0; border-radius:999px; color:var(--mh-primary); text-decoration:none; font:700 13px var(--mh-font)}


/* final-inline.css */
/* front/final-inline.css â€” auto-generated from remaining inline style="" â€” BEM utilities */
.mh-inline-1{display:none;}
.mh-inline-2{margin:0;font-size:22px;}
.mh-inline-3{margin:6px 0 0;opacity:.9;font-size:13px;}
.mh-inline-4{text-decoration:none;color:inherit;}
.mh-inline-5{padding:12px;}
.mh-inline-6{margin:0;font-size:14px;color:#0f2e44;line-height:1.4;}
.mh-inline-7{font-size:12px;color:#6b7c8d;margin-top:6px;}
.mh-inline-8{grid-column:1/-1;background:#fff;padding:30px;text-align:center;border-radius:10px;}
.mh-inline-9{font-size:12px;color:#6b7c8d;margin-bottom:8px;}
.mh-inline-10{color:#0b4a6e;}
.mh-inline-11{flex:1;min-width:240px;}
.mh-inline-12{margin:0;font-size:18px;color:#0f2e44;}
.mh-inline-13{font-size:14px;line-height:1.8;color:#1e3346;}
.mh-inline-14{margin-top:12px;display:flex;gap:10px;flex-wrap:wrap;}
.mh-inline-15{background:#00314c;color:#fff !important;padding:8px 16px;border-radius:8px;font-size:13px;text-decoration:none;}.mh-inline-15:visited,.mh-inline-15:hover,.mh-inline-15:active,.mh-inline-15:focus{color:#fff !important;background:#00314c}
.mh-inline-16{border:1px solid #cbd9e6;color:#0b4a6e;background:#fff;padding:8px 16px;border-radius:8px;font-size:13px;text-decoration:none;}
.mh-inline-17{margin-top:14px;}
.mh-inline-18{clear:both; position:relative; z-index:10; isolation:isolate; margin-top:16px; margin-bottom:32px; padding:14px 14px 24px 14px; border-radius:10px; border:1px solid #eef2f7; background:#f8fafc; overflow:visible; display:block; width:100%; box-sizing:border-box; height:auto; min-height:0;}
.mh-inline-19{display:block; width:100%; height:auto; overflow:visible; position:relative; z-index:1;}
.mh-inline-20{clear:both; display:block; height:24px; overflow:hidden;}
.mh-inline-21{grid-column:1/-1;display:flex;align-items:center;justify-content:center;color:#8aa0b3;}
.mh-inline-22{font-size:13px;color:#4a5d6e;margin-top:6px;line-height:1.5;}
.mh-inline-23{padding:16px;}
.mh-inline-24{font-size:14px;line-height:1.8;color:#1e3346;background:#f8fafc;padding:12px;border-radius:8px;border-right:4px solid #8B5A2B;}
.mh-inline-25{padding:0 16px 16px;}
.mh-inline-26{margin-top:10px;}
.mh-inline-27{font-size:12px;color:#8aa0b3;}
.mh-inline-28{clear:both; position:relative; z-index:10; isolation:isolate; background:#f8fafc; margin-bottom:32px; padding:14px 14px 24px 14px; overflow:visible; display:block; width:100%; box-sizing:border-box; height:auto; min-height:0;}
.mh-inline-29{clear:both; display:block; height:24px; overflow:hidden; position:relative; z-index:1;}
.mh-inline-30{clear:both; display:block; margin-top:0; position:relative; z-index:1; background:#ffffff; border:1px solid #eef2f7; border-radius:12px; padding:16px; box-sizing:border-box; height:auto; overflow:visible;}
.mh-inline-31{font-size:15px;color:#0f2e44;}
.mh-inline-32{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;}
.mh-inline-33{background:#fff;border:1px solid #eef2f7;border-radius:10px;overflow:hidden;text-decoration:none;color:inherit;}
.mh-inline-34{width:100%;height:110px;object-fit:cover;}
.mh-inline-35{padding:10px;font-size:13px;line-height:1.5;}
.mh-inline-36{color:var(--mh-primary); text-decoration:underline;}
.mh-inline-37{margin:12px 0 0; color:var(--mh-muted); font:400 13px var(--mh-font);}
.mh-inline-38{color:var(--mh-primary);}
.mh-inline-39{min-width:36px; text-align:center; padding:8px 12px; border-radius:999px; text-decoration:none; font:800 13px var(--mh-font); {{ $i==$page ? 'background:var(--mh-primary); color:#fff; border:1px solid var(--mh-primary);' : 'background:#fff; color:var(--mh-primary); border:1px solid #e2e8f0;' }};}
.mh-inline-40{padding:0; overflow:hidden;}
.mh-inline-41{color:#94a3b8;}
.mh-inline-42{background:#0f3a4f; color:#fff; padding:4px 10px; border-radius:999px; font:800 12px var(--mh-font);}
.mh-inline-43{display:block; color:#0f3a4f; margin-bottom:6px;}
.mh-inline-44{background:rgba(255,255,255,.95); color:#0f3a4f; border-color:#fff;}
.mh-inline-45{margin:0;}
.mh-inline-46{font:500 12px var(--mh-font); color:#94a3b8;}
.mh-inline-47{margin-top:14px;}
.mh-inline-48{background:#0f3a4f; color:#fff; border-color:#0f3a4f; display:inline-flex;}
.mh-inline-49{display:none; margin-top:2px;}
.mh-inline-50{display:flex;gap:12px;padding:14px;align-items:center;}
.mh-inline-51{flex:1;}
.mh-inline-52{padding:0 14px 14px;font-size:13px;color:#4a5d6e;line-height:1.6;}
.mh-inline-53{margin:0;font-size:18px;}
.mh-inline-54{background:#fff;color:#0f4c0f;padding:6px 14px;border-radius:20px;font-size:13px;text-decoration:none;}
.mh-inline-55{font-size:12px;color:#6b7c8d;margin-top:6px;display:flex;gap:8px;}
.mh-inline-56{color:#fff;}
.mh-inline-57{background:#00314c;color:#fff;padding:6px 14px;border-radius:20px;font-size:13px;text-decoration:none;}
.mh-inline-58{display:flex; justify-content:center; padding:14px 0; font-family:var(--mh-font, Tajawal, sans-serif);}
.mh-inline-59{display:flex; gap:6px; flex-wrap:wrap; align-items:center; direction:ltr;}
.mh-inline-60{padding:8px 12px; border-radius:999px; border:1px solid #e2e8f0; background:#f8fafc; color:#94a3b8; font:700 13px var(--mh-font); opacity:.6;}
.mh-inline-61{padding:8px 12px; border-radius:999px; border:1px solid #e2e8f0; background:#fff; color:var(--mh-primary, #0f3a4f); text-decoration:none; font:700 13px var(--mh-font); transition:.15s;}
.mh-inline-62{min-width:36px; text-align:center; padding:8px 12px; border-radius:999px; border:1px solid #e2e8f0; background:#fff; color:var(--mh-primary); text-decoration:none; font:800 13px var(--mh-font);}
.mh-inline-63{padding:8px 4px; color:#94a3b8;}
.mh-inline-64{min-width:36px; text-align:center; padding:8px 12px; border-radius:999px; background:var(--mh-primary, #0f3a4f); color:#fff; border:1px solid var(--mh-primary); font:800 13px var(--mh-font);}
.mh-inline-65{padding:8px 12px; border-radius:999px; border:1px solid #e2e8f0; background:#fff; color:var(--mh-primary); text-decoration:none; font:700 13px var(--mh-font);}
.mh-inline-66{display:flex;justify-content:center;align-items:center;gap:10px;flex-wrap:wrap;padding:6px 12px;font-family:Tahoma,Geneva,sans-serif;font-size:9pt;color:#d6e6f0;font-weight:700;line-height:1;}
.mh-inline-67{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.13);padding:6px 12px;border-radius:20px;border:1px solid rgba(255,255,255,.18);}
.mh-inline-68{font-size:13px;}
.mh-inline-69{color:#ffd166;}
.mh-inline-70{opacity:.45;}
.mh-inline-71{display:inline-flex;align-items:center;gap:6px;background:#0e7a3a;padding:6px 12px;border-radius:20px;border:1px solid rgba(255,255,255,.22);box-shadow:0 1px 4px rgba(0,0,0,.18);}
.mh-inline-72{width:8px;height:8px;background:#7CFC8A;border-radius:50%;display:inline-block;box-shadow:0 0 6px #7CFC8A;animation:pulse 1.6s infinite;}
.mh-inline-73{font-size:8pt;opacity:.9;background:rgba(0,0,0,.18);padding:4px 8px;border-radius:20px;}
.mh-inline-74{margin-top:8px;}
.mh-inline-75{margin-top:6px;}




/* editor-fonts.css — Arabic fonts for rich-editor output (Quill) */
.ql-font-tajawal{font-family:"Tajawal",sans-serif !important}
.ql-font-amiri{font-family:"Amiri",serif !important}
.ql-font-cairo{font-family:"Cairo",sans-serif !important}
.ql-font-noto-naskh{font-family:"Noto Naskh Arabic",serif !important}
.ql-font-noto-kufi{font-family:"Noto Kufi Arabic",sans-serif !important}
.ql-font-ibm-plex{font-family:"IBM Plex Sans Arabic",sans-serif !important}
.ql-font-scheherazade{font-family:"Scheherazade New",serif !important}
.ql-font-lateef{font-family:"Lateef",serif !important}
.ql-size-small{font-size:.75em}
.ql-size-large{font-size:1.35em}
.ql-size-huge{font-size:1.7em}
.art-text .ql-font-tajawal,.art-text .ql-font-amiri,.art-text .ql-font-cairo,.art-text .ql-font-noto-naskh,.art-text .ql-font-noto-kufi,.art-text .ql-font-ibm-plex,.art-text .ql-font-scheherazade,.art-text .ql-font-lateef,.art-text .ql-font-tahoma,.art-text .ql-font-traditional,.art-text .ql-font-khaled{line-height:1.9}

.ql-font-tahoma{font-family:Tahoma,Geneva,sans-serif !important}
.ql-font-traditional{font-family:"Traditional Arabic","Arabic Typesetting",serif !important}
.ql-font-khaled{font-family:"Khaled Art","Traditional Arabic",serif !important}
@font-face{font-family:"Khaled Art";src:url("/fonts/khaled-art.woff2") format("woff2"),url("/fonts/KhaledArt.woff2") format("woff2");font-weight:400 700;font-style:normal;font-display:swap}

