
/* ===========================
   ELARA — RESPONSIVE TUNING
   v1.2.1 (PC / TABLET / MOBILE)
   =========================== */

/* Lưới đội ngũ */
.elara-lawyer-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: clamp(16px, 2.2vw, 32px);
  align-items:start;
}
/* Card */
.elara-card{ display:flex; flex-direction:column; text-align:center; }
.elara-photo{ width:100%; aspect-ratio:5/6; overflow:hidden; border-radius:12px; background:#f4f6f8; }
.elara-photo img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .25s ease; }
@media(hover:hover){ .elara-photo:hover img{ transform:scale(1.03); } }
.elara-name{ margin-top:.6rem; font-weight:800; font-size:clamp(1rem,1.2vw,1.15rem); line-height:1.3; letter-spacing:.01em; word-break:keep-all; min-height:2.6em; }
.elara-role{ margin-top:.25rem; color:#a98922; font-weight:700; font-size:clamp(.9rem,.95vw,1rem); }
.elara-excerpt{ font-size:.95rem; }
/* Load more & pagination */
.elara-loadmore-wrap{ text-align:center; margin-top:18px; }
.elara-loadmore{ padding:10px 18px; border:0; border-radius:10px; font-weight:700; min-height:44px; cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,.06); }
.elara-pagination{ margin-top:22px; }
.elara-pagination ul{ display:flex; flex-wrap:wrap; gap:8px; list-style:none; padding:0; margin:0; }
.elara-pagination a,.elara-pagination span{ display:block; padding:8px 12px; border-radius:8px; background:#f4f6f8; }
/* Single layout */
.elara-single.wrap{ display:grid; grid-template-columns:1fr 320px; gap:clamp(20px,3vw,40px); margin:36px auto; max-width:1200px; padding:0 15px; }
@media(max-width:1024px){ .elara-single.wrap{ grid-template-columns:1fr; } .elara-sidebar{ order:2; } }
.elara-profile__header{ display:grid; grid-template-columns:220px 1fr; align-items:center; gap:24px; margin-bottom:18px; }
@media(max-width:640px){ .elara-profile__header{ grid-template-columns:1fr; } }
.elara-profile__photo img{ width:100%; height:auto; object-fit:cover; border-radius:10px; }
.elara-profile__name{ font-size:clamp(1.4rem,2.6vw,2rem); margin:0 0 .4rem; }
.elara-profile__role{ font-size:clamp(1rem,1.4vw,1.15rem); font-weight:700; color:#a98922; }
.elara-profile__meta{ list-style:none; margin:0; padding:0; }
.elara-profile__meta li{ margin-bottom:.25rem; }
/* Related */
.single-lawyer .elara-related__list{ list-style:none; padding:0; margin:0; display:grid; gap:14px; }
.single-lawyer .elara-related__item{ display:block; }
.single-lawyer .elara-related__link{ display:flex; flex-direction:column; align-items:center; gap:8px; text-decoration:none; }
.single-lawyer .elara-related__thumb{width:100%; height:auto; border-radius:10px; object-fit:cover; display:block; }
.single-lawyer .elara-related__text{ text-align:center; width:100%;}
@media(max-width:640px){ .elara-related__text{ max-width:100%; } }
.single-lawyer .elara-related__name{ font-weight:700; line-height:1.25; white-space:normal; overflow:hidden; text-overflow:ellipsis; }
.single-lawyer .elara-related__intro{ font-size:.93rem; color:#555; line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
/* v1.2.0 mobile header reflow */
@media (max-width: 768px){
  .elara-profile__header{ grid-template-columns:1fr !important; justify-items:center; gap:16px; }
  .elara-profile__photo{ order:1; }
  .elara-profile__headings{ order:2; width:100%; }
  .elara-profile__name{ text-align:center; }
  .elara-profile__role{ text-align:center; margin-bottom:10px; }
  .elara-profile__meta{ list-style:none !important; padding:0; margin:0; }
  .elara-profile__meta li{ display:flex; gap:6px; align-items:baseline; flex-wrap:wrap; margin:4px 0; }
  .elara-profile__meta li strong{ font-weight:700; }
  .elara-profile__meta a, .elara-profile__meta span{ word-break:break-word; }
}
/* v1.2.1 — Mobile: căn giữa hình + chữ trong Nhân sự liên quan */
@media (max-width: 768px){
  .single-lawyer .elara-related__list{ justify-items: center; }
  .single-lawyer .elara-related__item{ text-align: center; width: 100%; }
  .single-lawyer .elara-related__link{ align-items: center; }
  .single-lawyer .elara-related__thumb{ display: block; margin: 0 auto; }
  .single-lawyer .elara-related__text{ text-align: center; max-width: 280px; margin: 0 auto; }
}
