/* Bản đồ người Nghệ — 37FTU */
.bd-khung{display:grid;gap:18px;margin-top:20px}
@media(min-width:1000px){.bd-khung{grid-template-columns:1.45fr 1fr;align-items:start}}

.bd-map{padding:18px}
.bd-tren{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;margin-bottom:12px}
.bd-tong b{font-family:var(--font-tieu-de);font-size:1.9rem;color:var(--cam);line-height:1}
.bd-tong span{font-weight:600}
.bd-phu{font-size:.83rem;color:var(--muc-nhat);margin-top:2px}
.thang{display:flex;align-items:center;gap:4px;font-size:.75rem;color:var(--muc-nhat)}
.thang i{width:20px;height:10px;border-radius:2px;display:block}

.bd-svg-boc{position:relative}
#bd-svg{width:100%;height:auto;display:block;touch-action:manipulation}
#bd-svg path{
  stroke:#fff;stroke-width:1.1;stroke-linejoin:round;cursor:pointer;
  transition:fill .18s ease, opacity .18s ease;
}
#bd-svg path:hover{opacity:.82}
/* path có tabindex nên trình duyệt vẽ viền focus quanh KHUNG BAO của nó — ra một
   hình chữ nhật đen chình ình giữa bản đồ. Bỏ viền đó, nhưng người dùng bàn phím
   (:focus-visible) vẫn phải thấy mình đang ở đâu. */
#bd-svg path:focus{outline:none}
#bd-svg path:focus-visible{outline:none;stroke:var(--muc);stroke-width:2.4}
#bd-svg path.dang-chon{stroke:var(--muc);stroke-width:2.2}
#bd-svg text{
  font-family:var(--font);font-size:15px;font-weight:600;fill:#3A2A22;
  pointer-events:none;paint-order:stroke;stroke:rgba(255,255,255,.85);stroke-width:3px;
}
#bd-svg text.nhat{fill:#fff;stroke:rgba(0,0,0,.28)}
#bd-svg text#nhan-dang-chon{font-size:17px;font-weight:800}
/* Màn hình hẹp: nhãn co lại còn vài pixel nên bỏ hẳn, chạm vào vùng để xem tên */
@media(max-width:760px){
  #bd-svg text{display:none}
  #bd-svg text#nhan-dang-chon{display:block;font-size:30px}
}
.nhac-cham{display:none;font-size:.83rem;color:var(--muc-nhat);margin-top:10px;text-align:center}
@media(max-width:760px){.nhac-cham{display:block}}

.tim-que{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:14px}
.tim-que label{margin:0;font-size:.85rem;white-space:nowrap}
.tim-que select{width:auto;min-width:210px;max-width:320px;flex:1 1 210px;padding:9px 12px;font-size:.92rem}

/* Bộ lọc thế hệ */
.bo-loc{display:flex;flex-wrap:wrap;gap:8px}
.bo-loc button{
  padding:8px 16px;border-radius:999px;border:1.5px solid var(--vien-dam);background:var(--trang);
  font-family:var(--font);font-size:.88rem;font-weight:700;color:var(--muc-nhat);cursor:pointer;
  transition:all .15s ease
}
.bo-loc button:hover{border-color:var(--cam);color:var(--cam-dam)}
.bo-loc button[aria-pressed="true"]{background:var(--cam);border-color:var(--cam);color:#fff}

/* Bảng bên phải */
.bd-panel{padding:24px;position:sticky;top:84px}
.bd-panel h3{font-size:1.5rem;margin-bottom:8px}
.xep-hang{margin-top:22px;display:grid;gap:9px}
.xh-dong{display:grid;grid-template-columns:20px 1fr auto;gap:10px;align-items:center;font-size:.92rem;
  background:none;border:none;padding:6px 0;cursor:pointer;text-align:left;font-family:var(--font);color:inherit}
.xh-dong:hover .xh-ten{color:var(--cam-dam)}
.xh-hang{color:var(--muc-nhat);font-variant-numeric:tabular-nums;font-size:.85rem}
.xh-ten{font-weight:600}
.xh-thanh{height:6px;border-radius:99px;background:var(--cam);min-width:4px}
.xh-so{font-weight:700;font-variant-numeric:tabular-nums}

.ct-dau{display:flex;align-items:flex-start;gap:12px;justify-content:space-between}
.ct-ten{font-family:var(--font-tieu-de);font-size:1.8rem;line-height:1.05}
.ct-loai{font-size:.8rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--cam-dam)}
.ct-dong{width:34px;height:34px;border-radius:50%;border:1.5px solid var(--vien-dam);background:var(--trang);
  cursor:pointer;font-size:1.1rem;line-height:1;color:var(--muc-nhat);flex:none}
.ct-dong:hover{border-color:var(--cam);color:var(--cam-dam)}
.ct-so{display:flex;align-items:baseline;gap:8px;margin:18px 0 6px}
.ct-so b{font-family:var(--font-tieu-de);font-size:3rem;color:var(--cam);line-height:1}
.ct-so span{font-weight:600;color:var(--muc-nhat)}
.ct-cot{display:grid;gap:8px;margin-top:20px}
.ct-cot .d{display:grid;grid-template-columns:42px 1fr auto;gap:10px;align-items:center;font-size:.9rem}
.ct-cot .g{font-weight:700;color:var(--muc-nhat)}
.ct-cot .t{height:8px;border-radius:99px;background:var(--cam-nhat);overflow:hidden}
.ct-cot .t i{display:block;height:100%;background:var(--cam);border-radius:99px}
.ct-trong{background:var(--cam-nhat);border-radius:var(--r);padding:18px;margin-top:18px}
.ct-trong p{font-size:.95rem;color:var(--cam-dam);font-weight:600;margin:0 0 14px}

.bao-mau{
  margin-top:22px;padding:14px 16px;border-radius:var(--r);font-size:.9rem;font-weight:600;
  background:#FFF4CC;border:1px solid #E8C55A;color:#7A5A00
}

/* =====================================================================
   NGƯỜI NGHỆ Ở NGOẠI THƯƠNG — mở đầu, thẻ người trong huyện
   ===================================================================== */
.neo{display:block;position:relative;top:-90px;height:0;visibility:hidden}

.nn-dau{padding:clamp(40px,6vw,72px) 0 clamp(26px,4vw,40px)}
.nn-dau h1{font-size:clamp(1.9rem,4.4vw,3.2rem);letter-spacing:-.025em;max-width:34ch}

.nn-so{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--vien);
  border:1px solid var(--vien);border-radius:var(--r-lon);overflow:hidden;margin-top:30px}
.nn-so div{background:var(--trang);padding:18px 16px}
.nn-so b{display:block;font-family:var(--font-tieu-de);font-size:clamp(1.5rem,4vw,2.1rem);color:var(--cam);line-height:1.1}
.nn-so span{font-size:.82rem;color:var(--muc-nhat);line-height:1.35;display:block;margin-top:4px}
@media(min-width:760px){.nn-so{grid-template-columns:repeat(4,1fr)}}
/* =====================================================================
   DANH SÁCH NGƯỜI TRONG PANEL HUYỆN
   ===================================================================== */
.xh-dau{font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--muc-nhat);margin-bottom:4px}
.ct-nguoi{margin-top:22px;display:grid;gap:10px}
.ct-xem-them{padding:11px 18px;font-size:.9rem}

/* Màu theo cấp bậc — vàng cho người sáng lập, cam cho lãnh đạo */
.ng-sl{--bac:#B4841C;--bac-nen:#FFF6E0}
.ng-ld{--bac:var(--cam-dam);--bac-nen:var(--cam-nhat)}
.ng-ch{--bac:#3F6B5A;--bac-nen:#EAF3EE}
.ng-tv{--bac:#5B6470;--bac-nen:#EFF1F4}

.ng-nho{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;
  padding:8px 10px;border-radius:12px;transition:background .15s ease}
.ng-nho:hover{background:var(--giay)}
.ng-nho-chu{display:grid;line-height:1.3;min-width:0}
.ng-nho-chu b{font-size:.95rem}
.ng-nho-chu span{font-size:.79rem;color:var(--muc-nhat)}
.ng-chu-nho{
  width:34px;height:34px;flex:none;border-radius:50%;display:grid;place-items:center;
  font-family:var(--font-tieu-de);font-size:1rem;font-weight:800;
  background:var(--bac-nen,var(--cam-nhat));color:var(--bac,var(--cam-dam))
}
.ng-nho-gen{font-size:.72rem;font-weight:800;color:var(--bac,var(--muc-nhat));
  background:var(--bac-nen,var(--giay));padding:3px 8px;border-radius:99px;white-space:nowrap}

/* Phần thêm của thẻ: thành tích, lời nhắn, link — nằm dưới tên, thẳng hàng với tên */
.ng-nho-them{grid-column:2 / -1;display:grid;gap:6px;font-size:.83rem;line-height:1.45;margin-top:-2px}
.ng-tt{list-style:none;margin:0;padding:0;display:grid;gap:3px}
.ng-tt li{position:relative;padding-left:17px;color:var(--muc)}
.ng-tt li::before{content:"★";position:absolute;left:0;top:0;font-size:.78rem;color:var(--bac,var(--cam))}
.ng-ln{margin:0;font-style:italic;color:var(--muc-nhat);padding-left:9px;
  border-left:2px solid var(--vien);border-left-color:color-mix(in srgb,var(--bac,var(--cam)) 40%,transparent)}
.ng-lk{justify-self:start;font-weight:700;font-size:.8rem;color:var(--bac,var(--cam-dam));text-decoration:none}
.ng-lk:hover{text-decoration:underline}