/* ===== Đội ngũ lãnh đạo ===== */
.ld-section,.ld-modal{
  --ld-line:#98854E;        /* màu các đường border */
  --ld-gold:#98854E;
  --ld-text:#2b2b2b;
  --ld-muted:#6f6f6f;
  --ld-photo-bg:#e3e3f1;
  --ld-stem:60px;           /* chiều dài các đường nối dọc */
}
.ld-section,.ld-modal{color:var(--ld-text)}

.ld-section{padding:0 0 80px}
.ld-section .container{max-width:1400px}

/* ===== Item lãnh đạo ===== */
.leader{cursor:pointer;outline:0}
.leader__photo{
  background:var(--ld-photo-bg);
  overflow:hidden;
}
.leader__photo img{
  width:100%;height:100%;object-fit:cover;object-position:top center;display:block;
  transition:transform .6s ease;
}
.leader:hover .leader__photo img,
.leader:focus-visible .leader__photo img{transform:scale(1.05)}
.leader:focus-visible .leader__photo{outline:2px solid var(--ld-gold);outline-offset:3px}

.leader__pos{
  font-size:14px;line-height:1.45;color:var(--ld-muted);
  margin:28px 0 8px;
}
.leader__name{
  font-size:18px;font-weight:700;letter-spacing:.3px;line-height:1.3;
  text-transform:uppercase;margin:0;
  transition:color .25s;
}
.leader:hover .leader__name{color:var(--ld-gold)}

.leader--top .leader__photo{aspect-ratio:322/340}
.leader--sub .leader__photo{aspect-ratio:1/1}

/* Nội dung chi tiết ẩn – JS đổ vào modal */
.leader__bio{display:none}

/* ===== Sơ đồ đường nối (desktop) ===== */
@media (min-width:992px){
  /* Đường dọc từ hàng trên xuống */
  .ld-tree{position:relative;margin-top:60px;padding-top:var(--ld-stem)}
  .ld-tree::before{
    content:"";position:absolute;left:50%;top:calc(var(--ld-stem) * -1);
    width:1px;height:var(--ld-stem);
    background:var(--ld-line);
  }
  /* Đường ngang, mờ dần 2 đầu */
  .ld-tree::after{
    content:"";position:absolute;left:0;right:0;top:0;height:1px;
    background:linear-gradient(90deg,transparent 0%,var(--ld-line) 6%,var(--ld-line) 94%,transparent 100%);
    opacity:.55;
  }
  /* Đường dọc xuống từng item */
  .ld-tree .leader--sub{position:relative}
  .ld-tree .leader--sub::before{
    content:"";position:absolute;left:50%;top:calc(var(--ld-stem) * -1);
    width:1px;height:var(--ld-stem);
    background:var(--ld-line);
    opacity:.55;
  }
}
/* Không có hàng trên: bỏ đường nối */
.ld-tree--alone{margin-top:0 !important;padding-top:0 !important}
.ld-tree--alone::before,.ld-tree--alone::after,
.ld-tree--alone .leader--sub::before{display:none}

@media (max-width:991.98px){
  .ld-tree{margin-top:48px}
  .leader__pos{margin-top:16px}
  .leader__name{font-size:16px}
}

/* ===== Modal ===== */
.ld-modal .modal-dialog{max-width:1110px}
.ld-modal .modal-content{border:0;border-radius:0;padding:0}
.ld-modal__close{
  position:absolute;top:14px;right:14px;z-index:3;
  width:32px;height:32px;border:0;background:none;padding:0;
  color:var(--ld-text);line-height:0;
  transition:transform .25s,color .25s;
}
.ld-modal__close:hover{transform:rotate(90deg);color:var(--ld-gold)}

.ld-modal__photo{
  height:100%;min-height:340px;
  background:var(--ld-photo-bg);
}
.ld-modal__photo img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}

.ld-modal__head{
  position:relative;
  padding:44px 120px 22px 60px;
  border-bottom:1px solid var(--ld-line);
}
.ld-modal__name{ 
}
.ld-modal__pos{font-size:15px;color:var(--ld-muted);margin:0}

.ld-modal__nav{
  position:absolute;right:40px;bottom:0;
  display:flex;gap:1px;
}
.ld-modal__nav button{
  width:40px;height:40px;border:0;padding:0;
  background:var(--ld-gold);color:#fff;line-height:0;
  transition:background .2s;
}
.ld-modal__nav button:hover{background:#7e6d3d}

.ld-modal__body{padding:26px 60px 40px}
.ld-modal__label{
  font-size:16px;font-weight:700;text-transform:uppercase;
  margin:0 0 22px;
}
.ld-modal__bio{font-size:16px;line-height:1.6;color:#444}
.ld-modal__bio p:last-child{margin-bottom:0}

/* Chuyển nội dung mượt khi bấm prev/next */
.ld-modal__swap{transition:opacity .25s ease}
.ld-modal__swap.is-fading{opacity:0}

@media (max-width:767.98px){
  .ld-modal__photo{min-height:0;aspect-ratio:322/340;height:auto}
  .ld-modal__head{padding:24px 100px 18px 20px}
  .ld-modal__nav{right:20px}
  .ld-modal__body{padding:22px 20px 30px}
}