:root {
  --forest:   #0a1f13;
  --deep:     #0f2d1c;
  --emerald:  #1a5c38;
  --jade:     #2d8653;
  --green:    #3aaa6d;
  --mint:     #6fcf97;
  --pale:     #c8f0d8;
  --cream:    #f7f3ec;
  --warm:     #fdf8f0;
  --gold:     #d4a843;
  --gold-lt:  #f0c96a;
  --text:     #0f1e14;
  --text-mid: #3d5247;
  --text-lt:  #7a9486;
  --border:   #dceee4;
  --white:    #ffffff;
  --r:        16px;
  --r-sm:     10px;
  --shadow:   0 4px 24px rgba(15,45,28,.09);
  --shadow-lg:0 16px 60px rgba(15,45,28,.16);
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'DM Sans',sans-serif;
  background:var(--warm);
  color:var(--text);
  overflow-x:hidden;
}

/* ============================================
   TOPNAV
   ============================================ */
.topnav{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  padding:0 40px;
  height:68px;
  display:flex;align-items:center;justify-content:space-between;
  background:rgba(10,31,19,.85);
  backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(255,255,255,.06);
  transition:all .3s;
}
.topnav.scrolled{
  background:rgba(10,31,19,.97);
  box-shadow:0 4px 30px rgba(0,0,0,.3);
}
.nav-brand{display:flex;align-items:center;gap:12px;text-decoration:none;}
.nav-brand-icon{
  width:40px;height:40px;
  background:linear-gradient(135deg,var(--jade),var(--mint));
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
}
.nav-brand-icon i{color:#fff;font-size:18px;}
.nav-brand-text{display:flex;flex-direction:column;}
.nav-brand-name{color:#fff;font-size:15px;font-weight:700;line-height:1.1;letter-spacing:.2px;}
.nav-brand-sub{color:rgba(255,255,255,.4);font-size:10.5px;font-weight:400;letter-spacing:.5px;}

.nav-links{display:flex;align-items:center;gap:6px;}
.nav-link-item{
  color:rgba(255,255,255,.65);
  text-decoration:none;
  font-size:13.5px;
  font-weight:500;
  padding:7px 14px;
  border-radius:8px;
  transition:all .2s;
}
.nav-link-item:hover{color:#fff;background:rgba(255,255,255,.08);}
.nav-login-btn{
  background:linear-gradient(135deg,var(--jade),var(--green));
  color:#fff !important;
  padding:8px 20px !important;
  border-radius:8px;
  font-weight:600 !important;
}
.nav-login-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 6px 20px rgba(58,170,109,.4);
}
.nav-search-form{
  display:flex;align-items:center;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.1);
  border-radius:9px;
  overflow:hidden;
  margin-right:8px;
}
.nav-search-input{
  background:none;border:none;outline:none;
  color:#fff;font-family:'DM Sans',sans-serif;
  font-size:13px;padding:8px 14px;
  width:200px;
}
.nav-search-input::placeholder{color:rgba(255,255,255,.35);}
.nav-search-btn{
  background:none;border:none;
  color:rgba(255,255,255,.5);
  padding:8px 12px;cursor:pointer;
  transition:color .2s;
}
.nav-search-btn:hover{color:var(--mint);}

/* ============================================
   HERO SECTION
   ============================================ */
.hero{
  min-height:100vh;
  position:relative;
  display:flex;align-items:center;
  overflow:hidden;
  background:var(--forest);
}
.hero-bg{
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse 120% 80% at 60% 40%, rgba(45,134,83,.25) 0%,transparent 60%),
    radial-gradient(ellipse 60% 60% at 10% 80%, rgba(26,92,56,.4) 0%,transparent 50%),
    radial-gradient(ellipse 40% 40% at 90% 10%, rgba(212,168,67,.08) 0%,transparent 50%),
    linear-gradient(160deg, #061410 0%, #0a1f13 40%, #0d2818 100%);
}
.hero-grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:60px 60px;
  mask-image:radial-gradient(ellipse 80% 80% at 50% 50%,black 20%,transparent 80%);
}
/* Floating orbs */
.orb{
  position:absolute;
  border-radius:50%;
  filter:blur(60px);
  animation:float 8s ease-in-out infinite;
  pointer-events:none;
}
.orb-1{width:400px;height:400px;background:rgba(45,134,83,.15);top:-100px;right:10%;animation-delay:0s;}
.orb-2{width:300px;height:300px;background:rgba(212,168,67,.07);bottom:20%;left:5%;animation-delay:3s;}
.orb-3{width:250px;height:250px;background:rgba(111,207,151,.1);top:40%;right:30%;animation-delay:5s;}

@keyframes float{
  0%,100%{transform:translateY(0) scale(1);}
  50%{transform:translateY(-30px) scale(1.05);}
}

.hero-content{
  position:relative;z-index:2;
  padding:140px 0 80px;
  width:100%;
}
.hero-badge{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(212,168,67,.12);
  border:1px solid rgba(212,168,67,.3);
  color:var(--gold-lt);
  font-size:11.5px;font-weight:600;
  letter-spacing:2px;text-transform:uppercase;
  padding:7px 18px;border-radius:50px;
  margin-bottom:24px;
  animation:fadeUp .8s ease forwards;
}
.hero-badge i{font-size:10px;}

.hero-title{
  font-family:'Playfair Display',serif;
  font-size:clamp(44px,6vw,80px);
  font-weight:900;
  color:#fff;
  line-height:1.08;
  margin-bottom:20px;
  animation:fadeUp .8s .1s ease both;
}
.hero-title .accent{
  background:linear-gradient(135deg,var(--gold-lt),var(--gold));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
.hero-title .green-accent{
  background:linear-gradient(135deg,var(--mint),var(--green));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

.hero-subtitle{
  font-size:17px;color:rgba(255,255,255,.55);
  line-height:1.8;max-width:560px;
  margin-bottom:36px;
  animation:fadeUp .8s .2s ease both;
  font-weight:400;
}

.hero-actions{
  display:flex;gap:14px;flex-wrap:wrap;
  animation:fadeUp .8s .3s ease both;
  margin-bottom:60px;
}
.btn-hero-primary{
  display:inline-flex;align-items:center;gap:9px;
  background:linear-gradient(135deg,var(--jade),var(--green));
  color:#fff;text-decoration:none;
  padding:14px 30px;border-radius:12px;
  font-size:15px;font-weight:600;
  font-family:'DM Sans',sans-serif;
  transition:all .3s;border:none;cursor:pointer;
  box-shadow:0 8px 30px rgba(45,134,83,.35);
}
.btn-hero-primary:hover{
  transform:translateY(-3px);
  box-shadow:0 14px 40px rgba(45,134,83,.5);
  color:#fff;text-decoration:none;
}
.btn-hero-secondary{
  display:inline-flex;align-items:center;gap:9px;
  background:rgba(255,255,255,.06);
  border:1.5px solid rgba(255,255,255,.15);
  color:rgba(255,255,255,.8);
  text-decoration:none;
  padding:13px 28px;border-radius:12px;
  font-size:15px;font-weight:500;
  font-family:'DM Sans',sans-serif;
  transition:all .3s;
}
.btn-hero-secondary:hover{
  background:rgba(255,255,255,.1);
  border-color:rgba(255,255,255,.25);
  color:#fff;text-decoration:none;
}

/* Hero Stats */
.hero-stats{
  display:flex;gap:32px;flex-wrap:wrap;
  animation:fadeUp .8s .4s ease both;
}
.hero-stat{
  display:flex;flex-direction:column;
}
.hero-stat-num{
  font-family:'Playfair Display',serif;
  font-size:38px;font-weight:900;
  color:#fff;line-height:1;
}
.hero-stat-num span{color:var(--gold-lt);}
.hero-stat-label{
  font-size:12px;color:rgba(255,255,255,.4);
  text-transform:uppercase;letter-spacing:1px;
  margin-top:4px;
}
.hero-divider{
  width:1px;background:rgba(255,255,255,.1);
  align-self:stretch;
}

/* Hero visual card */
.hero-visual{
  position:relative;
  animation:fadeUp .8s .2s ease both;
}
.hero-card-stack{
  position:relative;
  width:100%;max-width:480px;
  margin:0 auto;
}
.hero-card{
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius:20px;
  backdrop-filter:blur(20px);
  padding:28px;
}
.hero-card-header{
  display:flex;align-items:center;gap:12px;margin-bottom:20px;
}
.hero-card-dot{width:10px;height:10px;border-radius:50%;}
.hero-card-row{
  display:flex;align-items:center;gap:12px;
  padding:11px 14px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.05);
  border-radius:10px;
  margin-bottom:8px;
  transition:all .3s;
}
.hero-card-row:hover{background:rgba(255,255,255,.07);}
.hero-card-icon{
  width:34px;height:34px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;font-size:14px;
  flex-shrink:0;
}
.hero-card-info{flex:1;}
.hero-card-name{font-size:13px;color:rgba(255,255,255,.8);font-weight:500;}
.hero-card-meta{font-size:11.5px;color:rgba(255,255,255,.3);margin-top:1px;}
.hero-card-badge{
  font-size:11px;font-weight:600;
  padding:3px 10px;border-radius:20px;
}
/* Floating mini cards */
.float-card{
  position:absolute;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1);
  border-radius:14px;
  backdrop-filter:blur(20px);
  padding:14px 18px;
  white-space:nowrap;
}
.float-card-1{top:-28px;right:-20px;animation:floatCard 5s ease-in-out infinite;}
.float-card-2{bottom:-24px;left:-20px;animation:floatCard 6s 2s ease-in-out infinite;}
@keyframes floatCard{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-10px);}
}
.float-card-icon{font-size:18px;margin-bottom:4px;}
.float-card-label{font-size:11px;color:rgba(255,255,255,.45);text-transform:uppercase;letter-spacing:.8px;}
.float-card-value{font-size:22px;font-weight:700;color:#fff;line-height:1;}

@keyframes fadeUp{
  from{opacity:0;transform:translateY(24px);}
  to{opacity:1;transform:translateY(0);}
}

/* ============================================
   WAVE DIVIDER
   ============================================ */
.wave-divider{
  position:relative;background:var(--forest);
  height:80px;overflow:hidden;
}
.wave-divider svg{
  position:absolute;bottom:0;width:100%;height:100%;
}

/* ============================================
   SECTION SHARED
   ============================================ */
.section{padding:80px 0;}
.section-alt{background:#fff;}
.section-warm{background:var(--warm);}

.section-eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  color:var(--jade);font-size:12px;font-weight:700;
  letter-spacing:2px;text-transform:uppercase;
  margin-bottom:12px;
}
.section-eyebrow::before{
  content:'';
  width:24px;height:2px;
  background:linear-gradient(90deg,var(--jade),var(--mint));
  border-radius:2px;
}
.section-title{
  font-family:'Playfair Display',serif;
  font-size:clamp(30px,4vw,48px);
  font-weight:800;
  color:var(--text);
  line-height:1.15;
  margin-bottom:12px;
}
.section-subtitle{
  font-size:16px;color:var(--text-lt);
  max-width:600px;line-height:1.8;
}

/* ============================================
   CATEGORIES GRID
   ============================================ */
.cat-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(280px,1fr));
  gap:24px;
  margin-top:48px;
}
.cat-card-public{
  position:relative;
  background:#fff;
  border-radius:20px;
  padding:32px 28px;
  border:1.5px solid var(--border);
  cursor:pointer;
  transition:all .35s cubic-bezier(.4,0,.2,1);
  text-decoration:none;
  display:block;
  overflow:hidden;
  color:inherit;
}
.cat-card-public::before{
  content:'';
  position:absolute;top:0;left:0;right:0;
  height:4px;
  background:var(--cat-color, var(--jade));
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .35s;
}
.cat-card-public::after{
  content:'';
  position:absolute;inset:0;
  background:radial-gradient(ellipse 80% 80% at 80% 20%, var(--cat-color-pale, rgba(45,134,83,.06)) 0%,transparent 70%);
  opacity:0;
  transition:opacity .35s;
}
.cat-card-public:hover{
  transform:translateY(-6px);
  box-shadow:0 20px 60px rgba(15,45,28,.12);
  border-color:transparent;
  text-decoration:none;color:inherit;
}
.cat-card-public:hover::before{transform:scaleX(1);}
.cat-card-public:hover::after{opacity:1;}

.cat-icon-wrap{
  width:64px;height:64px;
  border-radius:18px;
  display:flex;align-items:center;justify-content:center;
  font-size:26px;
  margin-bottom:18px;
  position:relative;z-index:1;
  transition:transform .3s;
}
.cat-card-public:hover .cat-icon-wrap{transform:scale(1.08) rotate(-3deg);}

.cat-card-title{
  font-family:'Playfair Display',serif;
  font-size:20px;font-weight:700;
  color:var(--text);margin-bottom:6px;
  position:relative;z-index:1;
}
.cat-card-desc{
  font-size:13.5px;color:var(--text-lt);
  line-height:1.6;margin-bottom:18px;
  position:relative;z-index:1;
}
.cat-card-meta{
  display:flex;align-items:center;gap:16px;
  position:relative;z-index:1;
}
.cat-meta-item{
  display:flex;align-items:center;gap:5px;
  font-size:12.5px;color:var(--text-lt);font-weight:500;
}
.cat-meta-item i{font-size:11px;color:var(--jade);}
.cat-card-arrow{
  position:absolute;bottom:28px;right:24px;
  width:36px;height:36px;
  background:var(--cat-color, var(--jade));
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:13px;
  opacity:0;
  transform:translateX(-8px);
  transition:all .3s;
}
.cat-card-public:hover .cat-card-arrow{opacity:1;transform:translateX(0);}

/* ============================================
   BREADCRUMB HERO (category/sub page)
   ============================================ */
.inner-hero{
  background:var(--deep);
  padding:120px 0 60px;
  position:relative;
  overflow:hidden;
}
.inner-hero::before{
  content:'';
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse 70% 80% at 80% 50%, rgba(45,134,83,.18) 0%,transparent 60%),
    radial-gradient(ellipse 40% 60% at 0% 0%, rgba(212,168,67,.06) 0%,transparent 50%);
}
.inner-hero-content{position:relative;z-index:2;}
.breadcrumb-custom{
  display:flex;align-items:center;gap:6px;
  margin-bottom:16px;
}
.bc-item{
  font-size:13px;color:rgba(255,255,255,.4);
  text-decoration:none;transition:color .2s;
}
.bc-item:hover{color:var(--mint);}
.bc-sep{color:rgba(255,255,255,.2);font-size:12px;}
.bc-current{color:rgba(255,255,255,.75);font-weight:500;}

.inner-hero-title{
  font-family:'Playfair Display',serif;
  font-size:clamp(28px,4vw,50px);
  font-weight:800;color:#fff;
  margin-bottom:10px;line-height:1.15;
}
.inner-hero-sub{
  font-size:15px;color:rgba(255,255,255,.5);
  max-width:500px;line-height:1.7;
}
.inner-hero-badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 16px;border-radius:50px;
  font-size:12px;font-weight:600;letter-spacing:.5px;
  margin-bottom:16px;
}

/* ============================================
   SUBCATEGORY CARDS
   ============================================ */
.subcat-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:18px;
  margin-top:40px;
}
.subcat-card-public{
  background:#fff;
  border-radius:var(--r);
  border:1.5px solid var(--border);
  padding:22px 20px;
  display:flex;align-items:center;gap:16px;
  text-decoration:none;color:inherit;
  transition:all .3s;
  cursor:pointer;
}
.subcat-card-public:hover{
  border-color:var(--mint);
  transform:translateY(-3px);
  box-shadow:0 12px 40px rgba(15,45,28,.1);
  text-decoration:none;color:inherit;
}
.subcat-icon-wrap{
  width:46px;height:46px;
  background:var(--pale);
  border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  color:var(--jade);font-size:18px;
  flex-shrink:0;
  transition:all .3s;
}
.subcat-card-public:hover .subcat-icon-wrap{
  background:var(--jade);color:#fff;
}
.subcat-card-info{flex:1;}
.subcat-card-name{font-size:15px;font-weight:600;color:var(--text);margin-bottom:3px;}
.subcat-card-count{font-size:12.5px;color:var(--text-lt);}
.subcat-card-arrow{color:var(--text-lt);font-size:12px;transition:transform .2s;}
.subcat-card-public:hover .subcat-card-arrow{transform:translateX(4px);color:var(--jade);}

/* ============================================
   DOCUMENTS TABLE SECTION
   ============================================ */
.doc-filter-bar{
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:14px;
  margin-bottom:24px;
  padding:18px 24px;
  background:#fff;
  border-radius:var(--r);
  border:1.5px solid var(--border);
}
.doc-filter-search{
  display:flex;align-items:center;gap:10px;
  background:var(--warm);
  border:1.5px solid var(--border);
  border-radius:var(--r-sm);
  padding:9px 16px;
  min-width:280px;
}
.doc-filter-search input{
  border:none;background:none;outline:none;
  font-family:'DM Sans',sans-serif;
  font-size:14px;color:var(--text);flex:1;
}
.doc-filter-search input::placeholder{color:var(--text-lt);}
.doc-filter-search i{color:var(--text-lt);}

.doc-table-wrap{
  background:#fff;
  border-radius:20px;
  border:1.5px solid var(--border);
  overflow:hidden;
  box-shadow:var(--shadow);
}
.doc-table{width:100%;border-collapse:collapse;}
.doc-table thead th{
  background:var(--warm);
  padding:14px 20px;
  font-size:11.5px;
  font-weight:700;
  color:var(--text-lt);
  text-transform:uppercase;
  letter-spacing:.8px;
  border-bottom:1.5px solid var(--border);
  white-space:nowrap;
}
.doc-table tbody tr{
  border-bottom:1px solid #f5f7f5;
  transition:background .15s;
}
.doc-table tbody tr:last-child{border-bottom:none;}
.doc-table tbody tr:hover{background:#fafcfa;}
.doc-table tbody td{padding:15px 20px;font-size:14px;vertical-align:middle;}

.doc-title-cell{font-weight:600;color:var(--text);}
.doc-desc-cell{font-size:12.5px;color:var(--text-lt);margin-top:2px;max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

.status-pill{
  display:inline-flex;align-items:center;gap:5px;
  padding:4px 12px;border-radius:50px;
  font-size:12px;font-weight:600;
}
.status-pending  {background:#fff8e1;color:#b76e00;}
.status-completed{background:#e8f5e9;color:#1b6b33;}
.status-archived {background:#e8eaf6;color:#3949ab;}

.doc-actions{display:flex;gap:6px;align-items:center;}
.doc-action-btn{
  width:32px;height:32px;border-radius:8px;
  border:none;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:13px;transition:all .2s;
  text-decoration:none;
}
.doc-btn-view{background:#e3f0ff;color:#2563eb;}
.doc-btn-download{background:#e8f5e9;color:#1b6b33;}
.doc-btn-view:hover{background:#2563eb;color:#fff;}
.doc-btn-download:hover{background:#1b6b33;color:#fff;}

/* Empty state */
.empty-pub{
  text-align:center;padding:80px 20px;
  color:var(--text-lt);
}
.empty-pub i{font-size:52px;opacity:.25;margin-bottom:16px;display:block;}
.empty-pub h4{font-size:18px;font-weight:700;color:var(--text-mid);margin-bottom:8px;}
.empty-pub p{font-size:14px;}

/* ============================================
   SEARCH SECTION
   ============================================ */
.search-result-count{
  font-size:14px;color:var(--text-lt);margin-bottom:20px;
}
.search-result-count strong{color:var(--jade);}

/* ============================================
   FOOTER
   ============================================ */
.site-footer{
  background:var(--forest);
  padding:60px 0 30px;
  color:rgba(255,255,255,.5);
}
.footer-brand{
  display:flex;align-items:center;gap:12px;
  margin-bottom:16px;
}
.footer-brand-icon{
  width:44px;height:44px;
  background:linear-gradient(135deg,var(--jade),var(--mint));
  border-radius:11px;
  display:flex;align-items:center;justify-content:center;
}
.footer-brand-icon i{color:#fff;font-size:20px;}
.footer-brand-name{color:#fff;font-size:16px;font-weight:700;}
.footer-brand-sub{font-size:11.5px;color:rgba(255,255,255,.35);margin-top:1px;}
.footer-desc{font-size:13.5px;line-height:1.8;max-width:300px;margin-bottom:24px;}
.footer-divider{border:none;border-top:1px solid rgba(255,255,255,.07);margin:30px 0;}
.footer-bottom{
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:10px;
  font-size:12.5px;
}
.footer-col-title{
  color:#fff;font-size:13px;font-weight:700;
  margin-bottom:16px;letter-spacing:.3px;
}
.footer-links{list-style:none;}
.footer-links li{margin-bottom:9px;}
.footer-links a{
  color:rgba(255,255,255,.4);
  text-decoration:none;font-size:13.5px;
  transition:color .2s;
}
.footer-links a:hover{color:var(--mint);}

/* ============================================
   DOCUMENT MODAL
   ============================================ */
.modal-content{border-radius:20px!important;border:none!important;box-shadow:0 24px 80px rgba(0,0,0,.18)!important;}
.modal-header{
  background:linear-gradient(135deg,var(--deep),var(--emerald));
  border-radius:20px 20px 0 0!important;padding:22px 28px!important;
}
.modal-title{color:#fff!important;font-family:'Playfair Display',serif!important;font-size:18px!important;}
.modal-header .btn-close{filter:invert(1) brightness(2);}
.modal-body{padding:28px!important;}
.modal-footer{padding:16px 28px!important;border-top:1px solid var(--border)!important;}
.detail-row{display:flex;gap:16px;padding:12px 0;border-bottom:1px solid #f5f7f5;}
.detail-row:last-child{border-bottom:none;}
.detail-lbl{width:140px;font-size:12px;font-weight:700;color:var(--text-lt);text-transform:uppercase;letter-spacing:.5px;flex-shrink:0;padding-top:2px;}
.detail-val{font-size:14px;color:var(--text);font-weight:500;}

/* ============================================
   SCROLL ANIMATIONS
   ============================================ */
.reveal{
  opacity:0;transform:translateY(30px);
  transition:opacity .7s ease, transform .7s ease;
}
.reveal.visible{opacity:1;transform:none;}
.reveal-delay-1{transition-delay:.1s;}
.reveal-delay-2{transition-delay:.2s;}
.reveal-delay-3{transition-delay:.3s;}

/* ============================================
   RESPONSIVE
   ============================================ */
@media(max-width:991px){
  .topnav{padding:0 20px;}
  .nav-search-form{display:none;}
  .hero-visual{display:none;}
  .hero-content{padding-top:110px;}
  .section{padding:60px 0;}
}
@media(max-width:768px){
  .nav-links .nav-link-item:not(.nav-login-btn){display:none;}
  .hero-stats{gap:20px;}
  .hero-divider{display:none;}
  .cat-grid{grid-template-columns:1fr;}
  .subcat-grid{grid-template-columns:1fr;}
  .doc-filter-bar{flex-direction:column;align-items:stretch;}
  .doc-filter-search{min-width:unset;}
  .doc-table thead{display:none;}
  .doc-table tbody td{display:block;padding:8px 16px;}
  .doc-table tbody td:first-child{padding-top:16px;}
  .doc-table tbody td:last-child{padding-bottom:16px;}
  .footer-bottom{flex-direction:column;text-align:center;}
}

/* ── Record Preview Modal ── */
#recordPreviewModal .modal-dialog {
    max-width: 92vw;
    width: 1160px;
    margin: 1.5rem auto;
}
#recordPreviewModal .modal-content {
    border: none;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(0,0,0,.22);
    height: 90vh;
    display: flex;
    flex-direction: column;
}
#recordPreviewModal .modal-header {
    background: #1a1a2e;
    border-bottom: none;
    padding: 14px 22px;
    flex-shrink: 0;
}
#recordPreviewModal .modal-title {
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: .3px;
}
#recordPreviewModal .btn-close {
    filter: invert(1) grayscale(1);
    opacity: .6;
}
#recordPreviewModal .btn-close:hover { opacity: 1; }

/* ── Split body ── */
.rp-body {
    display: flex;
    flex: 1;
    overflow: hidden;
}

/* ── LEFT PANEL — record details ── */
.rp-left {
    width: 320px;
    min-width: 280px;
    background: #f4f4f4;
    border-right: 1px solid #ddd;
    overflow-y: auto;
    padding: 28px 24px 24px;
    display: flex;
    flex-direction: column;
    gap: 0;
}
.rp-category-label {
    color: var(--jade);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .3px;
    margin-bottom: 2px;
}
.rp-category-sub {
    color: var(--text-lt);
    font-size: 12px;
    margin-bottom: 18px;
}
.rp-divider {
    height: 1px;
    background: #dde8e2;
    margin: 0 0 18px;
}
.rp-field {
    margin-bottom: 16px;
}
.rp-field-label {
    font-size: 11.5px;
    font-weight: 700;
    color: #666;
    text-transform: uppercase;
    letter-spacing: .8px;
    margin-bottom: 4px;
}
.rp-field-value {
    font-size: 14px;
    color: var(--text);
    font-weight: 400;
    line-height: 1.5;
    word-break: break-word;
}
.rp-field-value.code {
    font-size: 13px;
    color: var(--text-mid);
    font-style: italic;
}
.rp-field-value.empty {
    color: #bbb;
    font-style: italic;
}

/* attachments */
.rp-attachments {
    margin-top: auto;
    padding-top: 18px;
    border-top: 1px solid #dde8e2;
}
.rp-attach-label {
    font-size: 11.5px;
    font-weight: 700;
    color: #666;
    text-transform: uppercase;
    letter-spacing: .8px;
    margin-bottom: 10px;
}
.rp-attach-item {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}
.rp-attach-icon {
    color: #e53935;
    font-size: 18px;
    flex-shrink: 0;
}
.rp-attach-name {
    font-size: 13px;
    color: var(--jade);
    text-decoration: none;
    font-weight: 500;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.rp-attach-name:hover { text-decoration: underline; }
.rp-download-all {
    display: inline-block;
    margin-top: 6px;
    font-size: 12px;
    font-weight: 700;
    color: #e53935;
    text-decoration: none;
    letter-spacing: .3px;
}
.rp-download-all:hover { text-decoration: underline; }
.rp-no-file {
    font-size: 13px;
    color: #bbb;
    font-style: italic;
}

/* ── RIGHT PANEL — PDF viewer ── */
.rp-right {
    flex: 1;
    background: #525659;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    position: relative;
}
.rp-viewer-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: rgba(255,255,255,.35);
    gap: 12px;
}
.rp-viewer-placeholder i { font-size: 56px; opacity: .3; }
.rp-viewer-placeholder p { font-size: 14px; }
#rp-pdf-iframe {
    width: 100%;
    height: 100%;
    border: none;
    display: none;
}
/* loading spinner */
.rp-loader {
    position: absolute;
    inset: 0;
    background: #525659;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 5;
}
.rp-loader .spinner-border { width: 2.5rem; height: 2.5rem; color: var(--mint); }