/* ════════════════════════════════════════════════════════════════
   NBRE · estate-detail.css — trang chi tiết toàn màn hình + contact social + back-to-top
   Tách từ styles.css. THỨ TỰ NỐI (cascade): base → layout → components
   → estate-detail → editorial → detail-modules → overlays → theme-light.
   theme-light.css PHẢI nạp cuối. Đừng đảo thứ tự <link>.
   ════════════════════════════════════════════════════════════════ */
/* ── ESTATE DETAIL — "trang riêng" cho từng tài sản ──────────── */
/* khóa nền iOS-proof: position:fixed giữ Safari iPhone không cuộn lớp dưới
   (top được JS gán = -scrollY để khôi phục đúng vị trí khi đóng) */
body.no-scroll {
  position: fixed;
  inset: 0;
  width: 100%;
  overflow: hidden;
}
/* trang đích toàn màn hình — theo được cả sáng/tối qua biến token */
.estate-page {
  position: fixed;
  inset: 0;
  z-index: 800;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background: var(--ink);
  color: var(--text);
  opacity: 0;
  visibility: hidden;
  transform: translateY(28px) scale(0.985);
  transition:
    opacity 0.45s var(--ease),
    visibility 0.45s,
    transform 0.55s var(--ease);
}
.estate-page.is-open {
  opacity: 1;
  visibility: visible;
  transform: none;
}
/* nội dung trượt-lên nhẹ sau lớp nền → cảm giác "chuyển trang" sang trọng */
.estate-page .ep-hero,
.estate-page .ep-content {
  opacity: 0;
  transform: translateY(22px);
  transition:
    opacity 0.5s var(--ease) 0.08s,
    transform 0.6s var(--ease) 0.08s;
}
.estate-page .ep-content {
  transition-delay: 0.16s;
}
.estate-page.is-open .ep-hero,
.estate-page.is-open .ep-content {
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  .estate-page,
  .estate-page .ep-hero,
  .estate-page .ep-content {
    transition-duration: 0.001s;
    transform: none;
  }
}

/* thanh trên: về trang chủ · thương hiệu · sáng-tối · đóng */
.ep-bar {
  position: sticky;
  top: 0;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.85rem clamp(1rem, 4vw, 2.2rem);
  background: color-mix(in srgb, var(--ink) 85%, transparent);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--line);
}
.ep-home {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  cursor: pointer;
  background: none;
  border: none;
  color: var(--text);
  font-family: var(--sans);
  font-size: var(--fs-sm);
  letter-spacing: 0.02em;
  padding: 0.4rem 0.2rem;
  transition: color 0.25s var(--ease);
}
.ep-home:hover {
  color: var(--gold-bright);
}
.ep-home svg {
  width: 1.15rem;
  height: 1.15rem;
}
/* thanh trên trang chi tiết = wordmark NBRE (không viết tên pháp lý — tên đó chỉ ở
   dòng bản quyền footer). Wordmark tỉ lệ 6.5:1 → căn theo CHIỀU RỘNG. */
.ep-brand {
  display: flex;
  align-items: center;
  text-decoration: none;
  opacity: 0.92;
  transition: opacity var(--dur-1) var(--ease);
}
.ep-brand:hover {
  opacity: 1;
}
.ep-brand img {
  width: clamp(104px, 9vw, 128px); /* tỉ lệ hình học 6.5:1 (xem .nav__mark) */
  height: auto;
  display: block;
}
.ep-bar__tools {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.estate-page__close {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  cursor: pointer;
  flex: none;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: transparent;
  color: var(--muted);
  transition:
    border-color 0.25s var(--ease),
    color 0.25s,
    transform 0.25s var(--ease);
}
.estate-page__close:hover {
  border-color: var(--gold);
  color: var(--gold-bright);
  transform: rotate(90deg);
}
.estate-page__close svg {
  width: 16px;
  height: 16px;
}

/* hero ảnh lớn + caption (chữ luôn sáng trên ảnh, kể cả light mode) */
.ep-hero {
  position: relative;
  width: 100%;
  height: clamp(320px, 56vh, 620px);
  overflow: hidden;
}
.estate-page__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.96) brightness(0.9);
}
.ep-hero__grad {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--nbre-black) 10%, transparent) 0%,
    color-mix(in srgb, var(--nbre-black) 0%, transparent) 32%,
    color-mix(in srgb, var(--nbre-black) 50%, transparent) 72%,
    color-mix(in srgb, var(--nbre-black) 93%, transparent) 100%
  );
}
.ep-hero__cap {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 0 clamp(1.2rem, 4vw, 2rem) clamp(1.6rem, 4vw, 3rem);
}
.ep-hero__inner {
  max-width: 1040px;
  margin: 0 auto;
}
.ep-hero__row {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.2rem;
  margin-top: 1.1rem;
  flex-wrap: wrap;
}
.estate-page__tier {
  --c: var(--gold);
  display: inline-block;
  margin-bottom: 1rem;
  font-size: var(--fs-3xs);
  letter-spacing: var(--ls-ui);
  text-transform: uppercase;
  font-weight: 500;
  color: var(--c);
  padding: 0.4em 0.8em;
  border-radius: 2px;
  background: color-mix(in srgb, var(--nbre-black) 50%, transparent);
  backdrop-filter: blur(6px);
  border: 1px solid color-mix(in srgb, var(--c) 45%, transparent);
}
.estate-page__tier::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--c);
  box-shadow: 0 0 6px var(--c);
  margin-right: 0.55em;
  vertical-align: middle;
}
.estate-page__loc {
  display: block;
  font-size: var(--fs-2xs);
  letter-spacing: var(--ls-wide);
  text-transform: uppercase;
  /* ⚠️ Chữ NẰM TRÊN ẢNH tài sản. Trước để --muted (xám) → chìm hẳn vào ảnh nền
     sáng (bếp/tường trắng); gradient nền trong suốt ở vùng này. Nâng lên tông
     ivory-ngả-stone (vẫn là metadata nhạt, KHÔNG sáng bằng tít) + bóng chữ tách
     nền để đọc được trên MỌI ảnh. */
  color: color-mix(in srgb, var(--nbre-ivory) 80%, var(--nbre-stone));
  text-shadow:
    0 1px 12px rgba(0, 0, 0, 0.8),
    0 1px 3px rgba(0, 0, 0, 0.6);
}
.estate-page__name {
  font-family: var(--serif);
  font-weight: 300;
  font-size: var(--fs-display);
  line-height: var(--lh-display);
  margin: 0.5rem 0 0.35rem;
  color: var(--text);
  /* bóng chữ: bảo hiểm tít đọc được trên ảnh nền sáng (không đổi cảm giác) */
  text-shadow: 0 2px 24px rgba(0, 0, 0, 0.55);
}
.estate-page__view {
  color: var(--muted);
  font-size: var(--fs-base);
}
.estate-page__price {
  font-family: var(--serif);
  font-size: var(--fs-h1);
  color: var(--text);
  line-height: 1;
}
.estate-page__price i {
  font-style: normal;
  font-size: var(--fs-3xs);
  letter-spacing: var(--ls-ui);
  color: var(--muted);
  margin-left: 0.3em;
  text-transform: uppercase;
}

/* nội dung trang theo cột đọc thoải mái */
.ep-content {
  padding: clamp(2rem, 5vh, 3.4rem) 0 clamp(3rem, 8vh, 6rem);
}
.ep-shell {
  max-width: 1040px;
  margin: 0 auto;
  padding-inline: clamp(1.2rem, 4vw, 2rem);
}
.estate-page__score {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(1.2rem, 3vw, 2.4rem);
  align-items: center;
  margin: 1.6rem 0;
  padding: 1.5rem 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.eps__total {
  font-family: var(--serif);
  color: var(--gold-bright);
  line-height: 1;
}
.eps__total b {
  font-size: var(--fs-4xl);
  font-weight: 500;
}
.eps__total i {
  font-style: normal;
  font-size: var(--fs-base);
  color: var(--muted);
}
.eps__total span {
  display: block;
  font-family: var(--sans);
  font-size: var(--fs-3xs);
  letter-spacing: var(--ls-wide);
  color: var(--gold);
  margin-top: 0.55rem;
}
.eps__bars {
  display: grid;
  gap: 0.5rem;
  min-width: 0;
}
.eps__row {
  display: grid;
  grid-template-columns: 6.4rem 1fr auto;
  gap: 0.8rem;
  align-items: center;
  font-size: var(--fs-sm);
  color: var(--text);
}
/* thanh điểm: MỘT sắc champagne lì — KHÔNG gradient vàng (luật màu v1.0) */
.eps__track {
  height: 3px;
  border-radius: var(--r-1);
  background: color-mix(in srgb, var(--text) 12%, transparent);
  overflow: hidden;
}
.eps__track b {
  display: block;
  height: 100%;
  border-radius: var(--r-1);
  background: var(--gold);
}
.eps__row em {
  font-style: normal;
  font-size: var(--fs-xs);
  color: var(--muted-2);
}
.estate-page__attrs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem 1rem;
}
.epa {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.epa span {
  font-size: var(--fs-3xs);
  letter-spacing: var(--ls-ui);
  text-transform: uppercase;
  color: var(--muted-2);
}
.epa b {
  font-family: var(--serif);
  font-weight: 400;
  font-size: var(--fs-lg);
  color: var(--text);
}
.estate-page__cta {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 1.9rem;
}
.estate-page__appt {
  border: 1px solid var(--line);
  color: var(--muted);
}
.estate-page__appt:hover {
  border-color: var(--gold);
}

/* GỠ 2026-07-12: .estate-page__saves — "N đang quan tâm" là số do rng() sinh ra (bịa).
   Nếu cần lượt quan tâm THẬT thì lấy từ backend. */

/* tài sản tương tự (gợi ý thông minh) */
.estate-page__similar {
  margin-top: 2.4rem;
  padding-top: 1.8rem;
  border-top: 1px solid var(--line);
}
.ep-sim {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(1rem, 2vw, 1.6rem);
}
.ep-simcard {
  display: flex;
  flex-direction: column;
  text-align: left;
  cursor: pointer;
  padding: 0;
  background: var(--ink-2);
  border: 1px solid var(--line);
  border-radius: 6px;
  overflow: hidden;
  color: var(--text);
  transition:
    border-color 0.3s,
    transform 0.3s var(--ease),
    box-shadow 0.3s;
}
.ep-simcard:hover {
  border-color: var(--gold);
  transform: translateY(-4px);
  box-shadow: 0 22px 44px -24px rgba(0, 0, 0, 0.7);
}
.ep-simcard__img {
  aspect-ratio: 16/10;
  overflow: hidden;
}
.ep-simcard__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1s var(--ease);
}
.ep-simcard:hover .ep-simcard__img img {
  transform: scale(1.05);
}
.ep-simcard__loc {
  font-size: var(--fs-3xs);
  letter-spacing: var(--ls-ui);
  text-transform: uppercase;
  color: var(--muted);
  margin: 0.9rem 0.9rem 0;
}
.ep-simcard__name {
  font-family: var(--serif);
  font-size: var(--fs-lg);
  line-height: var(--lh-display);
  margin: 0.3rem 0.9rem 0;
}
.ep-simcard__foot {
  font-size: var(--fs-xs);
  color: var(--muted);
  margin: 0.55rem 0.9rem 1rem;
}
.ep-simcard__foot b {
  font-family: var(--serif);
  color: var(--muted);
  font-size: var(--fs-base);
}

/* intel: đơn giá vs trung vị khu vực + điểm khu vực */
.estate-page__intel {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: clamp(1.4rem, 4vw, 3rem);
  align-items: start;
  margin: 1.6rem 0;
  padding: 1.5rem 0;
  border-bottom: 1px solid var(--line);
}
.epi-market__lab {
  display: block;
  font-size: var(--fs-3xs);
  letter-spacing: var(--ls-ui);
  text-transform: uppercase;
  color: var(--muted-2);
}
.epi-market__val {
  display: block;
  font-family: var(--serif);
  font-size: var(--fs-3xl);
  font-weight: 500;
  line-height: var(--lh-display);
  margin: 0.3rem 0 0.35rem;
  color: var(--text);
}
.epi-market--below .epi-market__val {
  color: var(--state-ok);
}
.epi-market--above .epi-market__val {
  color: var(--text);
}
.epi-market__sub {
  display: block;
  font-size: var(--fs-xs);
  color: var(--muted);
  line-height: var(--lh-body);
  max-width: 34ch;
}
.epi-scores {
  min-width: 0;
}
.epi-scores__lab {
  display: block;
  font-size: var(--fs-3xs);
  letter-spacing: var(--ls-ui);
  text-transform: uppercase;
  color: var(--muted-2);
  margin-bottom: 0.95rem;
}
.epi-scores__list {
  display: grid;
  gap: 0.95rem;
}
.epi-score {
  display: grid;
  grid-template-columns: 2.5rem 1fr;
  column-gap: 0.7rem;
  align-items: baseline;
}
.epi-score b {
  font-family: var(--serif);
  font-size: var(--fs-lg);
  line-height: 1;
  color: var(--muted);
  font-weight: 500;
}
.epi-score span {
  font-size: var(--fs-sm);
  color: var(--text);
}
.epi-score__track {
  grid-column: 1 / -1;
  height: 3px;
  border-radius: var(--r-1);
  background: color-mix(in srgb, var(--text) 12%, transparent);
  overflow: hidden;
  margin-top: 0.5rem;
}
.epi-score__track u {
  display: block;
  height: 100%;
  border-radius: var(--r-1);
  background: var(--gold);
}

.eps-h {
  font-size: var(--fs-2xs);
  letter-spacing: var(--ls-wide);
  text-transform: uppercase;
  color: var(--gold-soft);
  margin: 0 0 1rem;
}

/* "Khu vực quanh đây" — tiện ích + khoảng cách */
.estate-page__nearby {
  margin: 1.8rem 0;
}
.nearby {
  list-style: none;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 2.4rem;
}
.nearby li {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.7rem 0;
  border-top: 1px solid var(--line);
}
.nearby__ic {
  flex: none;
  width: 1.45rem;
  height: 1.45rem;
  color: var(--gold);
  display: grid;
  place-items: center;
}
.nearby__ic svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.nearby__cat {
  flex: none;
  width: 8.4rem;
  font-size: var(--fs-2xs);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted-2);
}
.nearby__name {
  flex: 1;
  min-width: 0;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.nearby__dist {
  flex: none;
  font-style: normal;
  font-family: var(--serif);
  font-size: var(--fs-base);
  color: var(--gold-soft);
}

/* Ưu điểm / Lưu ý */
.estate-page__pc {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.6rem, 4vw, 3rem);
  margin-top: 1.8rem;
  padding-top: 1.6rem;
  border-top: 1px solid var(--line);
}
.pc ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}
.pc li {
  position: relative;
  padding-left: 1.4rem;
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: var(--text);
}
.pc li::before {
  position: absolute;
  left: 0;
  top: 0;
}
.pc--pro li::before {
  content: "✦";
  color: var(--gold);
}
.pc--con li::before {
  content: "•";
  color: var(--muted-2);
  font-size: 1.2em;
  line-height: 1;
}

/* ── Góc nhìn đầu tư + Ghi chú tư vấn (Advisor nhập tay) ──── */
.estate-page__persp,
.estate-page__advisory {
  margin-top: 1.8rem;
  padding-top: 1.6rem;
  border-top: 1px solid var(--line);
}
.estate-page__persp .eyebrow,
.estate-page__advisory .eyebrow {
  margin-bottom: 1.1rem;
}
.epersp {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.1rem, 3vw, 1.8rem) clamp(1.6rem, 4vw, 3rem);
}
.epersp__item {
  border-top: 1px solid var(--line);
  padding-top: 0.9rem;
}
.epersp__k {
  display: block;
  font-family: var(--serif);
  font-weight: 400;
  font-size: var(--fs-lg);
  line-height: var(--lh-title);
  margin-bottom: 0.4rem;
}
.epersp__v {
  color: var(--muted);
  font-size: var(--fs-sm);
  line-height: var(--lh-body);
  max-width: 46ch;
}
/* Ghi chú tư vấn = tiếng nói NBRE — serif nghiêng, 1 hairline champagne (điểm nhấn duy nhất) */
.eadvisory {
  font-family: var(--serif);
  font-weight: 300;
  font-style: italic;
  font-size: var(--fs-xl);
  line-height: var(--lh-title);
  color: var(--text);
  max-width: 62ch;
  padding-left: 1.4rem;
  border-left: 2px solid var(--gold);
}

@media (max-width: 620px) {
  .ep-hero {
    height: clamp(280px, 42vh, 420px);
  }
  .epersp {
    grid-template-columns: 1fr;
  }
  .estate-page__attrs {
    grid-template-columns: repeat(2, 1fr);
  }
  .eps__row {
    grid-template-columns: 5.4rem 1fr auto;
  }
  .estate-page__score {
    grid-template-columns: 1fr;
    gap: 1.2rem;
  }
  .estate-page__intel {
    grid-template-columns: 1fr;
  }
  .nearby,
  .estate-page__pc,
  .ep-sim {
    grid-template-columns: 1fr;
  }
  .ep-home__t {
    display: none;
  }
  .ep-brand {
    display: none;
  } /* nhường chỗ cho VI/EN + sáng-tối trên màn nhỏ */
}

/* node bản đồ đã lưu → ghim ♥ vàng nổi bật */
.nbnode.is-fav {
  z-index: 40;
}
.nbnode.is-fav .nbnode__core {
  background: radial-gradient(circle at 35% 30%, var(--text), var(--gold) 70%);
  box-shadow:
    0 0 12px 3px var(--gold),
    0 0 30px 9px color-mix(in srgb, var(--nbre-bronze) 60%, transparent);
}
.nbnode.is-fav .nbnode__ring {
  border-color: var(--gold-bright);
  opacity: 1;
}
.nbnode.is-fav::after {
  content: "♥";
  position: absolute;
  left: 50%;
  bottom: 135%;
  transform: translateX(-50%);
  font-size: var(--fs-xs);
  color: var(--gold-bright);
  pointer-events: none;
}

/* ── contact social row (ghost circles) ──────────────────── */
.contact__social {
  display: flex;
  justify-content: center;
  gap: 1rem;
  margin-top: 2.4rem;
}
.social-btn {
  position: relative;
  width: 3.2rem;
  height: 3.2rem;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: var(--muted);
  border: 1px solid var(--line);
  background: color-mix(in srgb, var(--nbre-ivory) 1.5%, transparent);
  transition:
    color 0.3s,
    border-color 0.3s,
    transform 0.25s var(--ease),
    background 0.3s;
}
.social-btn svg {
  width: 1.45rem;
  height: 1.45rem;
  fill: currentColor;
}
.social-btn--text {
  font-family: var(--serif);
  font-size: var(--fs-base);
  letter-spacing: 0.02em;
}
.social-btn:hover {
  color: var(--gold-bright);
  border-color: var(--gold);
  transform: translateY(-3px);
  background: color-mix(in srgb, var(--nbre-bronze) 8%, transparent);
}
.social-btn::after {
  content: attr(data-tip);
  position: absolute;
  bottom: calc(100% + 0.5rem);
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  background: color-mix(in srgb, var(--nbre-black) 92%, transparent);
  color: var(--text);
  font-size: var(--fs-2xs);
  letter-spacing: 0.06em;
  padding: 0.32em 0.6em;
  border-radius: 3px;
  border: 1px solid color-mix(in srgb, var(--nbre-bronze) 20%, transparent);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s;
}
.social-btn:hover::after {
  opacity: 1;
}

/* ── back to top ─────────────────────────────────────────── */
.to-top {
  position: fixed;
  right: clamp(1rem, 3vw, 2rem);
  bottom: calc(clamp(1rem, 3vw, 2rem) + 4rem);
  z-index: 500;
  width: 2.9rem;
  height: 2.9rem;
  border-radius: 50%;
  cursor: pointer;
  display: grid;
  place-items: center;
  color: var(--muted);
  background: color-mix(in srgb, var(--nbre-black) 82%, transparent);
  backdrop-filter: blur(14px);
  border: 1px solid color-mix(in srgb, var(--nbre-bronze) 34%, transparent);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition:
    opacity 0.35s,
    visibility 0.35s,
    transform 0.35s var(--ease),
    border-color 0.3s;
}
.to-top.show {
  opacity: 1;
  visibility: visible;
  transform: none;
}
.to-top:hover {
  border-color: var(--gold);
  transform: translateY(-3px);
}
.to-top svg {
  width: 1.3rem;
  height: 1.3rem;
}
@media (max-width: 560px) {
  .social-btn {
    width: 2.55rem;
    height: 2.55rem;
  }
  .social-btn svg {
    width: 1.2rem;
    height: 1.2rem;
  }
}

/* ══ MẠNG XÃ HỘI TRÊN ĐIỆN THOẠI — BỎ VÒNG TRÒN, CÒN CHỮ ═══════════════════
   Chủ đối chiếu shynhsuperluxury.vn: họ để "Follow us: Instagram Facebook Tiktok"
   bằng chữ trần — không huy hiệu tròn, không màu thương hiệu — và gọi đó là tinh tế.
   Trùng luôn luật NBRE: 5 vòng tròn viền là TRANG TRÍ, mà Design Language cấm khung.
   Nhãn lấy từ data-tip có sẵn ⇒ không phải sửa 5 thẻ <a>.
   Khổ lớn giữ nguyên dãy icon tròn (ở đó chúng cân với bố cục 3 cột).

   ⚠️ PHẢI ĐỨNG SAU cả .social-btn::after LẪN @media 560px ở trên — @media không
   cộng độ đặc hiệu, đặt trước là bị hai khối kia đè (560px kéo lại về 2,55rem). */
.sitefoot__follow { display: none; }

@media (max-width: 760px) {
  .sitefoot__social {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0 1.15rem;
  }
  .sitefoot__follow {
    display: inline;
    color: var(--muted);
    font-size: var(--fs-sm);
  }
  .social-btn {
    width: auto;
    height: auto;
    min-height: 44px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    font-family: var(--sans);
    font-size: var(--fs-sm);
    letter-spacing: normal;
    color: var(--text);
  }
  .social-btn:hover {
    transform: none;
    background: none;
  }
  .social-btn svg { display: none; }
  .social-btn::before { content: attr(data-tip); }
  /* nút Zalo đã có sẵn chữ trong thẻ ⇒ đừng in thêm lần nữa */
  .social-btn--text::before { content: none; }
  .social-btn--text {
    font-family: var(--sans);
    font-size: var(--fs-sm);
  }
  /* chú giải vốn hiện khi rê chuột — cảm ứng không có hover, mà nhãn nay in thẳng ra */
  .social-btn::after { display: none; }
}

/* Investment Dossier · Asset OS v1 (Collection 01 — Selected Assets) */
/* Panel GIẤY sáng cố định (như tờ hồ sơ in) → chữ phải TỐI ở CẢ 2 theme, không theo --text.
   Trước: không đặt color → chữ sáng (--text) trên giấy sáng = gần vô hình ở dark mode (lỗi chủ báo). */
.ep-dossier{margin:clamp(48px,7vw,92px) 0;padding:clamp(28px,5vw,58px);border:1px solid rgba(23,23,20,.14);background:#f4f0e8;color:#1c1b17}
.ep-dossier .eyebrow{color:#1c1b17}
.ep-dossier__head{display:flex;justify-content:space-between;gap:20px;padding-bottom:22px;border-bottom:1px solid color-mix(in srgb,currentColor 16%,transparent);font-size:10px;letter-spacing:.18em;text-transform:uppercase}
.ep-dossier__head p{margin:0;opacity:.68}.ep-dossier__code{font-weight:600}
.ep-dossier__summary{max-width:900px;padding:clamp(36px,5vw,64px) 0}
.ep-dossier__summary h2{font-family:var(--serif);font-size:clamp(34px,5vw,64px);font-weight:400;line-height:1.12;margin:.25em 0 .45em}
.ep-dossier__summary>p:last-child{font-size:clamp(16px,1.7vw,21px);line-height:1.8;opacity:.76}
.ep-dossier__grid{display:grid;grid-template-columns:1.45fr 1fr;gap:clamp(34px,7vw,100px)}
.ep-dossier__grid ol{list-style:none;counter-reset:thesis;margin:24px 0 0;padding:0}
.ep-dossier__grid li{counter-increment:thesis;display:grid;grid-template-columns:34px 1fr;gap:12px;padding:15px 0;border-top:1px solid color-mix(in srgb,currentColor 13%,transparent);line-height:1.55}
.ep-dossier__grid li:before{content:counter(thesis,decimal-leading-zero);font-size:10px;letter-spacing:.12em;opacity:.45;padding-top:4px}
.ep-dossier__grid dl{margin:0}.ep-dossier__grid dl>div{padding:17px 0;border-top:1px solid color-mix(in srgb,currentColor 13%,transparent)}
.ep-dossier__grid dt{font-size:10px;letter-spacing:.15em;text-transform:uppercase;opacity:.5}.ep-dossier__grid dd{margin:8px 0 0;font-family:var(--display,serif);font-size:19px}
@media(max-width:760px){.ep-dossier__grid{grid-template-columns:1fr}.ep-dossier{padding:24px 18px}.ep-dossier__head{flex-direction:column;gap:8px}}

/* ── CMA-lite · Định giá so sánh (bảng comparable như TSSS) — theme-aware trên trang chi tiết ── */
.ep-cma{margin-top:2rem;padding-top:1.6rem;border-top:1px solid var(--line)}
.ep-cma .eyebrow{margin-bottom:1rem}
.ep-cma__scroll{overflow-x:auto}
.ep-cma__tbl{width:100%;border-collapse:collapse;font-size:var(--fs-sm);min-width:520px}
.ep-cma__tbl th{text-align:right;font-weight:400;font-size:var(--fs-2xs);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding:0 0 .7rem;border-bottom:1px solid var(--line)}
.ep-cma__tbl th:first-child{text-align:left}
.ep-cma__tbl td{padding:.75rem 0;text-align:right;border-bottom:1px solid var(--line);color:var(--text);white-space:nowrap;font-variant-numeric:tabular-nums}
.ep-cma__tbl td:first-child{text-align:left;white-space:normal;color:var(--muted);padding-right:1rem}
.ep-cma__subject td{color:var(--text)}
.ep-cma__subject td:first-child{color:var(--gold-soft)}
.ep-cma__subject em{font-style:normal;font-size:var(--fs-2xs);letter-spacing:.1em;text-transform:uppercase;color:var(--gold);margin-left:.4em}
.ep-cma__ss{font-size:var(--fs-3xs);letter-spacing:.1em;color:var(--muted-2);margin-right:.4em}
.ep-cma__out{display:flex;flex-wrap:wrap;gap:1.4rem 2.6rem;margin-top:1.3rem}
.ep-cma__out span{display:block;font-size:var(--fs-2xs);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.ep-cma__out b{font-family:var(--serif);font-weight:400;font-size:var(--fs-xl);color:var(--text);font-variant-numeric:tabular-nums}
.ep-cma__note{margin-top:1.2rem;font-size:var(--fs-2xs);line-height:1.6;color:var(--muted-2);max-width:70ch}

/* ════════ TRANG ĐỊNH GIÁ SƠ BỘ (valuation-page.js) ════════
   Overlay full-screen như .estate-page. Dark-glass ⇒ đã thêm vào nhóm keep-dark ở theme-light.css. */
.val-page {
  position: fixed; inset: 0; z-index: 820; overflow-y: auto; -webkit-overflow-scrolling: touch;
  background: var(--ink); color: var(--text);
  opacity: 0; visibility: hidden; transform: translateY(28px) scale(0.985);
  transition: opacity .45s var(--ease), visibility .45s, transform .55s var(--ease);
}
.val-page.is-open { opacity: 1; visibility: visible; transform: none; }
@media (prefers-reduced-motion: reduce) { .val-page { transition-duration: .001s; transform: none; } }
.val-bar {
  position: sticky; top: 0; z-index: 5; display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; padding: 1rem clamp(1rem, 4vw, 2.4rem); background: color-mix(in srgb, var(--ink) 88%, transparent);
  backdrop-filter: blur(14px); border-bottom: 1px solid var(--line);
}
.val-bar__ttl { font-family: var(--serif); letter-spacing: .16em; text-transform: uppercase; font-size: .9rem; color: var(--gold); }
.val-body { max-width: 940px; margin: 0 auto; padding: clamp(1.2rem, 4vw, 3rem) clamp(1rem, 4vw, 2.4rem) 5rem; }
.val-hero { text-align: center; padding: 1.5rem 0 2.2rem; }
.val-hero__tag {
  display: inline-block; font-size: .68rem; letter-spacing: .22em; text-transform: uppercase; color: var(--ink);
  background: var(--gold); padding: .35rem .7rem; border-radius: 2px; font-weight: 600; margin-bottom: 1rem;
}
.val-hero h1 { font-family: var(--serif); font-weight: 400; font-size: clamp(1.4rem, 4vw, 2.1rem); text-wrap: balance; }
.val-hero p { color: var(--muted); margin-top: .5rem; font-size: .95rem; }
.val-disc {
  border: 1px solid var(--line); border-left: 3px solid var(--gold); border-radius: 0 4px 4px 0;
  background: color-mix(in srgb, var(--gold) 6%, transparent); padding: 1rem 1.2rem; font-size: .86rem;
  line-height: 1.6; color: var(--muted); margin-bottom: 2rem;
}
.val-disc b { color: var(--text); font-weight: 600; }
.val-m { border-top: 1px solid var(--line); padding: 1.8rem 0 .4rem; }
.val-m__sub { color: var(--muted); font-size: .88rem; margin: -.6rem 0 1rem; max-width: 70ch; }
.val-m__rows { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 1px;
  background: var(--line); border: 1px solid var(--line); border-radius: 5px; overflow: hidden; }
.val-stat { background: var(--ink-2, var(--ink)); padding: .95rem 1.1rem; }
.val-stat span { display: block; font-size: .72rem; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); margin-bottom: .4rem; }
.val-stat b { font-family: var(--serif); font-size: 1.35rem; color: var(--text); font-weight: 400; font-variant-numeric: tabular-nums; }
.val-m__note { font-size: .76rem; color: var(--muted); margin-top: .9rem; line-height: 1.6; }
.val-concl { border-top: 2px solid var(--gold); margin-top: 2rem; padding-top: 1.8rem; }
.val-concl__range { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.2rem; }
.val-concl__range span { color: var(--muted); font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; }
.val-concl__range b { font-family: var(--serif); font-size: clamp(1.6rem, 4vw, 2.3rem); color: var(--gold); font-variant-numeric: tabular-nums; }
.val-concl__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: .6rem 1.4rem; margin-bottom: 1rem; }
.val-concl__list div, .val-concl__ask { display: flex; justify-content: space-between; gap: 1rem; padding: .5rem 0; border-bottom: 1px solid var(--line); font-size: .9rem; }
.val-concl__list span, .val-concl__ask span { color: var(--muted); }
.val-concl__list b, .val-concl__ask b { font-variant-numeric: tabular-nums; }
.val-concl__ask { border-bottom: none; border-top: 1px solid var(--line); margin-top: .3rem; }
.val-concl__ask b { color: var(--gold); }
.val-empty { color: var(--muted); text-align: center; padding: 3rem 0; }
.val-cta { text-align: center; margin-top: 2.6rem; padding-top: 2rem; border-top: 1px solid var(--line); }
.val-cta p { color: var(--muted); margin-bottom: 1rem; max-width: 54ch; margin-inline: auto; }
/* nút mở định giá trên dossier */
.ep-valbtn { display: inline-flex; align-items: center; gap: .5rem; margin: 1.2rem 0 0; padding: .7rem 1.2rem;
  border: 1px solid var(--gold); color: var(--gold); background: transparent; border-radius: 3px; cursor: pointer;
  font-family: var(--sans); font-size: .9rem; letter-spacing: .02em; transition: .16s var(--ease); }
.ep-valbtn:hover { background: var(--gold); color: var(--ink); }

/* ── Executive Summary + nhận định + TSSS trên trang định giá ── */
.val-exec { border: 1px solid var(--gold); border-radius: 6px; overflow: hidden; margin-bottom: .4rem;
  background: color-mix(in srgb, var(--gold) 7%, transparent); }
.val-exec__main { padding: 1.6rem 1.4rem 1.4rem; text-align: center; border-bottom: 1px solid var(--line); }
.val-exec__lab { display: block; font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); margin-bottom: .6rem; }
.val-exec__val { font-family: var(--serif); font-size: clamp(2.1rem, 6vw, 3.2rem); color: var(--gold); font-weight: 400; font-variant-numeric: tabular-nums; line-height: 1; }
.val-exec__val span { font-size: .34em; color: var(--muted); letter-spacing: .02em; }
.val-exec__range { display: block; margin-top: .8rem; color: var(--muted); font-size: .9rem; }
.val-exec__range b { color: var(--text); font-variant-numeric: tabular-nums; }
.val-exec__meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1px; background: var(--line); }
.val-exec__meta > div { background: var(--ink); padding: 1rem 1.2rem; }
.val-exec__meta span { display: block; font-size: .7rem; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); margin-bottom: .4rem; }
.val-exec__meta b { font-size: 1.05rem; color: var(--text); }
.val-exec__meta em { display: block; font-style: normal; font-size: .74rem; color: var(--muted); margin-top: .3rem; line-height: 1.5; }
.val-conf { font-weight: 600; }
.val-conf--hi { color: #7fb08a; } .val-conf--mid { color: var(--gold); } .val-conf--lo { color: var(--muted-2, var(--muted)); }
.val-comment p { color: var(--text); line-height: 1.75; margin-bottom: .9rem; font-size: .96rem; max-width: 74ch; }
.val-comment .val-m__note { color: var(--muted); font-size: .78rem; }
.val-cmp { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 5px; overflow: hidden; }
.val-cmp__row { display: grid; grid-template-columns: auto 1fr auto auto auto; gap: .5rem 1rem; align-items: baseline;
  padding: .7rem 1rem; border-bottom: 1px solid var(--line); font-size: .86rem; font-variant-numeric: tabular-nums; }
.val-cmp__row:last-child { border-bottom: none; }
.val-cmp__i { color: var(--gold); font-size: .72rem; letter-spacing: .06em; }
.val-cmp__addr { color: var(--text); }
.val-cmp__m2, .val-cmp__p, .val-cmp__u { color: var(--muted); text-align: right; white-space: nowrap; }
.val-cmp__p { color: var(--text); }
@media (max-width: 620px) { .val-cmp__row { grid-template-columns: auto 1fr; } .val-cmp__m2, .val-cmp__u { display: none; } }

/* ── THẺ ĐỊNH GIÁ trong dossier → dẫn sang /asset/<slug>/dinh-gia ── */
.ep-valcard { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap;
  margin: 1.6rem 0; padding: 1.4rem 1.6rem; cursor: pointer; border: 1px solid var(--gold);
  border-radius: 6px; background: linear-gradient(120deg, color-mix(in srgb, var(--gold) 10%, transparent), transparent 70%);
  transition: .18s var(--ease); }
.ep-valcard:hover { background: linear-gradient(120deg, color-mix(in srgb, var(--gold) 18%, transparent), transparent 72%); transform: translateY(-1px); }
.ep-valcard:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.ep-valcard__body { flex: 1 1 300px; }
.ep-valcard__body .eyebrow { margin-bottom: .5rem; }
.ep-valcard__val { font-size: .95rem; color: var(--muted); }
.ep-valcard__val b { font-family: var(--serif); font-size: clamp(1.5rem, 4vw, 2rem); color: var(--gold); font-weight: 400; margin-left: .3rem; font-variant-numeric: tabular-nums; }
.ep-valcard__sub { color: var(--muted); font-size: .84rem; margin-top: .5rem; line-height: 1.55; max-width: 62ch; }
.ep-valcard__cta { display: inline-flex; align-items: center; gap: .5rem; white-space: nowrap; color: var(--gold);
  font-size: .92rem; letter-spacing: .02em; border: 1px solid var(--gold); border-radius: 3px; padding: .6rem 1.1rem; }
.ep-valcard__cta em { font-style: normal; transition: transform .18s var(--ease); }
.ep-valcard:hover .ep-valcard__cta { background: var(--gold); color: var(--ink); }
.ep-valcard:hover .ep-valcard__cta em { transform: translateX(3px); }

/* ── ĐỊNH GIÁ NHANH (quick-valuation.js) — overlay như val-page ── */
.qv-page { position: fixed; inset: 0; z-index: 820; overflow-y: auto; -webkit-overflow-scrolling: touch;
  background: var(--ink); color: var(--text); opacity: 0; visibility: hidden; transform: translateY(28px) scale(.985);
  transition: opacity .45s var(--ease), visibility .45s, transform .55s var(--ease); }
.qv-page.is-open { opacity: 1; visibility: visible; transform: none; }
@media (prefers-reduced-motion: reduce) { .qv-page { transition-duration: .001s; transform: none; } }
.qv-body { max-width: 640px; }
.qv-form { display: grid; gap: 1rem; margin-bottom: 1.6rem; }
.qv-field { display: grid; gap: .4rem; }
.qv-field > span { font-size: .8rem; color: var(--muted); letter-spacing: .02em; }
.qv-field select, .qv-field input { width: 100%; padding: .8rem 1rem; border: 1px solid var(--line); border-radius: 4px;
  background: color-mix(in srgb, var(--text) 4%, transparent); color: var(--text); font: inherit; }
.qv-field select:focus, .qv-field input:focus { outline: none; border-color: var(--gold); }
.qv-field option { background: var(--ink); color: var(--text); }
.qv-submit { width: 100%; margin-top: .4rem; }
.qv-result { border: 1px solid var(--gold); border-radius: 6px; overflow: hidden; margin-bottom: 1.6rem;
  background: color-mix(in srgb, var(--gold) 7%, transparent); }
.qv-result__main { text-align: center; padding: 1.6rem 1.2rem 1.3rem; border-bottom: 1px solid var(--line); }
.qv-result__lab { display: block; font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); margin-bottom: .5rem; }
.qv-result__val { font-family: var(--serif); font-size: clamp(2rem, 7vw, 3rem); color: var(--gold); font-weight: 400; font-variant-numeric: tabular-nums; }
.qv-result__val em { font-style: normal; font-size: .34em; color: var(--muted); margin-left: .25rem; }
.qv-result__range { display: block; margin-top: .7rem; color: var(--muted); font-size: .92rem; }
.qv-prov { display: block; margin-top: .8rem; font-size: .82rem; color: var(--muted); line-height: 1.5; }
.qv-prov b { color: var(--text); font-weight: 600; }
.qv-prov__conf { font-style: normal; font-weight: 600; padding: .05rem .5rem; border-radius: 999px; font-size: .92em; }
.qv-prov__conf--hi { color: #2f6b46; background: color-mix(in srgb, #2f6b46 14%, transparent); }
.qv-prov__conf--mid { color: var(--gold); background: color-mix(in srgb, var(--gold) 16%, transparent); }
.qv-prov__conf--lo { color: var(--muted); background: color-mix(in srgb, var(--muted) 16%, transparent); }
.qv-result__basis, .qv-compare { padding: .9rem 1.2rem; font-size: .84rem; color: var(--muted); line-height: 1.6; }
.qv-result__basis b, .qv-compare b { color: var(--text); }
.qv-compare { border-top: 1px solid var(--line); }
/* ── đơn giá band (p25 · trung vị · p75) ── */
.qv-band { padding: 1.1rem 1.2rem; border-top: 1px solid var(--line); }
.qv-band__head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: .7rem; }
.qv-band__head span { font-size: .78rem; letter-spacing: .04em; color: var(--muted); text-transform: uppercase; }
.qv-band__head b { font-family: var(--serif); font-size: 1.1rem; color: var(--text); font-variant-numeric: tabular-nums; }
.qv-band__head b i { font-style: normal; font-size: .62em; color: var(--muted); margin-left: .2rem; }
.qv-band__bar { position: relative; height: 6px; border-radius: 3px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--gold) 18%, transparent), var(--gold), color-mix(in srgb, var(--gold) 18%, transparent)); }
.qv-band__mark { position: absolute; top: 50%; width: 12px; height: 12px; border-radius: 50%; transform: translate(-50%, -50%);
  background: var(--ink); border: 2px solid var(--gold); box-shadow: 0 0 0 3px color-mix(in srgb, var(--gold) 25%, transparent); }
.qv-band__scale { display: flex; justify-content: space-between; margin-top: .5rem; font-size: .72rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.qv-band__scale span:nth-child(2) { color: var(--gold); letter-spacing: .04em; }
/* ── phép nhân chỉ dẫn (đơn giá × diện tích) — KHÔNG phải định giá ── */
.qv-extrap { padding: 1rem 1.2rem; border-top: 1px solid var(--line); }
.qv-extrap__row { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.qv-extrap__row span { font-size: .84rem; color: var(--muted); }
.qv-extrap__row b { font-family: var(--serif); font-size: 1.5rem; color: var(--text); font-weight: 500; font-variant-numeric: tabular-nums; white-space: nowrap; }
.qv-extrap__row b i { font-style: normal; font-size: .5em; color: var(--muted); margin-left: .2rem; }
.qv-extrap__range { margin-top: .2rem; font-size: .8rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.qv-extrap__note { margin-top: .6rem; font-size: .8rem; color: var(--muted); line-height: 1.6; }
.qv-extrap__note b { color: var(--text); }
/* ── cơ sở phương pháp ── */
.qv-meta { border-top: 1px solid var(--line); }
.qv-meta__row { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding: .6rem 1.2rem; border-bottom: 1px solid color-mix(in srgb, var(--line) 60%, transparent); }
.qv-meta__row:last-child { border-bottom: 0; }
.qv-meta__row span { font-size: .82rem; color: var(--muted); }
.qv-meta__row b { font-size: .84rem; color: var(--text); font-weight: 500; text-align: right; }
.qv-compare--hi b, .qv-compare--lo b { color: var(--gold); }
/* ── điều con số CHƯA phản ánh → động lực chứng thư đầy đủ ── */
.qv-gaps { padding: 1.1rem 1.2rem 1.3rem; border-top: 1px solid var(--line);
  background: color-mix(in srgb, var(--gold) 4%, transparent); }
.qv-gaps__ttl { display: block; font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); margin-bottom: .7rem; }
.qv-gaps__list { list-style: none; margin: 0 0 .8rem; padding: 0; display: grid; gap: .45rem; }
.qv-gaps__list li { position: relative; padding-left: 1.3rem; font-size: .86rem; color: var(--text); line-height: 1.5; }
.qv-gaps__list li::before { content: ""; position: absolute; left: .1rem; top: .55em; width: 6px; height: 6px; border-radius: 50%; background: var(--gold); }
.qv-gaps__foot { font-size: .84rem; color: var(--muted); line-height: 1.6; }
.qv-gaps__foot b { color: var(--text); }
/* ── Quy trình thẩm định giá NBRE ── */
.qv-process { margin-top: 2.6rem; padding-top: 2rem; border-top: 1px solid var(--line); }
.qv-process__eyebrow { font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: var(--gold); }
.qv-process h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(1.3rem, 3.4vw, 1.8rem); margin: .5rem 0 .6rem; text-wrap: balance; }
.qv-process__lede { color: var(--muted); font-size: .92rem; line-height: 1.65; max-width: 62ch; margin-bottom: 1.6rem; }
.qv-process__more { display: inline-block; margin-top: 1.3rem; font-size: .85rem; font-weight: 500; color: var(--gold); text-decoration: none; border-bottom: 1px solid color-mix(in srgb, var(--gold) 45%, transparent); padding-bottom: 2px; transition: color .3s var(--ease), border-color .3s var(--ease); }
.qv-process__more:hover { color: var(--gold-bright, var(--gold)); border-color: var(--gold); }
.qv-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.qv-steps li { background: color-mix(in srgb, var(--ink) 92%, transparent); padding: 1.1rem 1.3rem; display: grid; grid-template-columns: auto 1fr; gap: .2rem 1rem; align-items: baseline; }
.qv-step__no { grid-row: span 2; font-family: var(--serif); font-size: 1.4rem; color: var(--gold); font-variant-numeric: tabular-nums; }
.qv-steps li b { font-size: .96rem; color: var(--text); }
.qv-steps li p { grid-column: 2; margin: .25rem 0 0; font-size: .85rem; color: var(--muted); line-height: 1.55; }
/* ── Hồ sơ cần chuẩn bị ── */
.qv-docs { margin-top: 1.8rem; }
.qv-docs h3 { font-family: var(--serif); font-weight: 400; font-size: 1.15rem; margin: 0 0 1rem; }
.qv-docs__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.qv-docs__col { background: color-mix(in srgb, var(--ink) 92%, transparent); padding: 1.1rem 1.3rem; }
.qv-docs__col b { display: block; color: var(--gold); font-size: .8rem; letter-spacing: .04em; text-transform: uppercase; margin-bottom: .6rem; }
.qv-docs__col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.qv-docs__col li { position: relative; padding-left: 1.2rem; font-size: .86rem; color: var(--text); line-height: 1.5; }
.qv-docs__col li::before { content: ""; position: absolute; left: .1rem; top: .55em; width: 5px; height: 5px; border-radius: 50%; background: var(--gold); }
.qv-docs__note { margin-top: .9rem; font-size: .82rem; color: var(--muted); font-style: italic; }

/* ── BIỆT THỰ CŨ ĐÃ PHÂN LOẠI (Nghị định 99/2015 Điều 34 khoản 2) ────────────────
   Khối SỰ THẬT PHÁP LÝ, không phải nhãn tiếp thị: dùng viền champagne trầm, KHÔNG
   dùng màu cảnh báo đỏ (đây không phải lỗi của tài sản) và KHÔNG tô nổi như huy hiệu.
   Nhóm 1 ràng buộc nặng nhất nên viền đậm hơn. */
.eheritage {
  margin: clamp(1.6rem, 3vw, 2.4rem) 0;
  padding: clamp(1.1rem, 2.2vw, 1.6rem) clamp(1.2rem, 2.4vw, 1.8rem);
  border: 1px solid color-mix(in srgb, var(--gold) 26%, transparent);
  border-left-width: 3px;
  border-radius: 2px;
  background: color-mix(in srgb, var(--gold) 5%, transparent);
}
.eheritage--n1 { border-left-color: var(--gold); border-left-width: 5px; }
.eheritage__grp {
  font-family: var(--serif);
  font-size: var(--fs-h3);
  line-height: 1.2;            /* SÀN 1.2 cho dấu tiếng Việt — xem [[nbre-type-scale]] */
  color: var(--gold);
  margin: 0.35rem 0 0.55rem;
}
.eheritage__rule {
  font-size: var(--fs-sm);
  line-height: 1.65;
  color: var(--text);
  margin: 0 0 0.45rem;
  max-width: 62ch;
}
.eheritage__src {
  font-size: var(--fs-2xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0.7rem 0 0;
}

/* ══════════════════════════════════════════════════════════════════════════════════════
   LINK CHIA SẺ — CHỌN PHẦN HIỂN THỊ (lớp gắn trên <html> bởi estate-detail.js)
   ══════════════════════════════════════════════════════════════════════════════════════
   Người gửi tắt bớt khối cho gọn mắt người nhận. Ẩn bằng CSS chứ không bằng hàm dựng:
   trang được vẽ lại nhiều lần (đổi ngôn ngữ, đóng/mở tài sản) nên lớp trên <html> là chỗ
   duy nhất sống qua mọi lần vẽ.
   ⚠️ Đây là TRÌNH BÀY, không phải bảo mật — cùng tài sản đó vào thẳng nambason.com vẫn xem
   đủ. Muốn giấu thật thì tắt công khai tin (khi đó /api/share trả 403).
   ⛔ CỐ Ý KHÔNG có lớp ẩn/hiện hình sổ: hình sổ KHÔNG BAO GIỜ được ra trang công khai.
   ══════════════════════════════════════════════════════════════════════════════════════ */
:root.sv-off-epmedia .epmedia,
:root.sv-off-map .ep-mapwrap,
/* Ô tick "Hồ sơ giao dịch" điều khiển CẢ HAI nửa — Investment Dossier và Quy trình giao
   dịch — đúng như ô "Hồ sơ & Quy trình Giao dịch" bên SBRE. Tắt một nửa là người gửi tưởng
   đã tắt cả khối mà khách vẫn thấy nửa kia. */
:root.sv-off-dossier .ep-dossier,
:root.sv-off-dossier .ep-flow,
:root.sv-off-costs .estate-page__costs,
:root.sv-off-loan .estate-page__loan,
:root.sv-off-market .estate-page__intel,
:root.sv-off-market .ep-valcard { display: none !important; }

/* ══════════════════════════════════════════════════════════════════════════════════════
   HAI KHỐI TÀI CHÍNH — Chi phí giao dịch · Tính khoản vay (detail-finance.js)
   Nền sáng như khối Investment Dossier để cùng một nhịp đọc; bảng cuộn ngang riêng nên
   trang không bao giờ bị đẩy ngang trên điện thoại.
   ══════════════════════════════════════════════════════════════════════════════════════ */
.epfin {
  margin: clamp(40px, 6vw, 76px) 0;
  padding: clamp(24px, 4.5vw, 48px);
  border: 1px solid rgba(23, 23, 20, 0.14);
  background: #f4f0e8;
  color: #1c1b17;
}
.epfin .eyebrow { color: #1c1b17; }
.epfin__lede {
  margin: 10px 0 20px;
  max-width: 62ch;
  font-size: clamp(0.86rem, 1.05vw, 0.95rem);
  line-height: 1.7;
  color: color-mix(in srgb, currentColor 72%, transparent);
}
.epfin__tblwrap { overflow-x: auto; }
.epfin__tbl { width: 100%; border-collapse: collapse; font-size: clamp(0.82rem, 1vw, 0.92rem); }
.epfin__tbl th {
  text-align: left; padding: 10px 12px; font-size: 0.66rem; letter-spacing: 0.14em;
  text-transform: uppercase; font-weight: 600;
  /* ĐO ĐƯỢC 3,73:1 ở bản live 02/08 — dưới chuẩn 4,5. Đây là tiêu đề cột của bảng chi phí
     ("Khoản mục · Bên nào chịu · Số tiền"), không đọc được thì cả bảng mất nghĩa. */
  color: color-mix(in srgb, currentColor 66%, transparent);
  border-bottom: 1px solid color-mix(in srgb, currentColor 18%, transparent);
  white-space: nowrap;
}
.epfin__tbl td { padding: 13px 12px; border-bottom: 1px solid color-mix(in srgb, currentColor 10%, transparent); vertical-align: top; }
.epfin__tbl td small {
  display: block; margin-top: 3px; font-size: 0.72rem; line-height: 1.5;
  color: color-mix(in srgb, currentColor 55%, transparent);
}
.epfin__tbl .epfin-num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.epfin__tbl .epfin-side { white-space: nowrap; color: color-mix(in srgb, currentColor 70%, transparent); }
.epfin__tbl tfoot td { border-bottom: 0; border-top: 2px solid color-mix(in srgb, currentColor 24%, transparent); font-weight: 600; }
.epfin__note {
  margin-top: 16px; max-width: 78ch; font-size: 0.76rem; line-height: 1.75;
  color: color-mix(in srgb, currentColor 58%, transparent);
}
/* ── bộ tính khoản vay ── */
.epfin__form { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 14px; }
.epfin__form label {
  display: flex; flex-direction: column; gap: 6px;
  font-size: 0.7rem; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 600;
  color: color-mix(in srgb, currentColor 58%, transparent);
}
/* Khai MÀU CHỮ + NỀN rõ ràng: khối này nền sáng nằm trong trang nền tối, để trình duyệt tự
   tô là dính đúng bẫy chữ-trắng-trên-nền-trắng đã trả giá bên admin. */
.epfin__form input,
.epfin__form select {
  width: 100%; padding: 10px 12px; border-radius: 8px;
  border: 1px solid color-mix(in srgb, currentColor 22%, transparent);
  background: #fff; color: #1c1b17;
  font-family: var(--sans); font-size: 0.92rem; font-weight: 500;
  text-transform: none; letter-spacing: normal;
}
.epfin__form input:focus, .epfin__form select:focus { outline: none; border-color: var(--gold); }
.epfin__out { margin-top: 20px; }
.epfin__kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)); gap: 10px; }
.epfin__kpis > div {
  padding: 12px 14px; border-radius: 10px; background: #fff;
  border: 1px solid color-mix(in srgb, currentColor 12%, transparent);
}
.epfin__kpis span {
  display: block; margin-bottom: 4px; font-size: 0.66rem; letter-spacing: 0.1em;
  text-transform: uppercase; color: color-mix(in srgb, currentColor 55%, transparent);
}
.epfin__kpis b { font-family: var(--serif); font-size: clamp(1.1rem, 1.6vw, 1.4rem); }
.epfin__kpis .is-peak { border-color: color-mix(in srgb, var(--gold) 55%, transparent); }
.epfin__kpis .is-peak b { color: #8a1c1c; }
.epfin__warn {
  margin-top: 12px; padding: 11px 14px; border-radius: 9px;
  background: #fdeced; border: 1px solid #f3b6b6; color: #8a1c1c;
  font-size: 0.82rem; line-height: 1.6;
}
.epfin__hint { font-size: 0.82rem; color: color-mix(in srgb, currentColor 55%, transparent); }
@media (max-width: 560px) { .epfin__tbl { min-width: 460px; } }

/* ══════════════════════════════════════════════════════════════════════════════════════
   QUY TRÌNH GIAO DỊCH — detail-flow.js
   Cùng "tờ giấy" ivory như Investment Dossier và hai khối tài chính: ba khối này là phần
   HỒ SƠ của trang, đọc liền một nhịp. Màu cứng (không dùng token) là CỐ Ý — giống .epfin,
   khối luôn là tờ giấy sáng ở cả chế độ Sáng lẫn Tối.
   ══════════════════════════════════════════════════════════════════════════════════════ */
.ep-flow {
  margin: clamp(40px, 6vw, 76px) 0;
  padding: clamp(24px, 4.5vw, 48px);
  border: 1px solid rgba(23, 23, 20, 0.14);
  background: #f4f0e8;
  color: #1c1b17;
}
.ep-flow .eyebrow { color: #1c1b17; }
.ep-flow__h {
  margin: 14px 0 0; font-family: var(--serif); font-weight: 400;
  font-size: clamp(1.4rem, 3vw, 2.1rem); line-height: 1.15;
}
.ep-flow__lede {
  margin: 10px 0 0; max-width: 62ch;
  font-size: clamp(0.86rem, 1.05vw, 0.95rem); line-height: 1.7;
  color: color-mix(in srgb, currentColor 72%, transparent);
}
/* ── ba bước: cột mốc dọc ── */
.ep-flow__steps {
  list-style: none; margin: clamp(26px, 4vw, 40px) 0 0; padding: 0 0 0 26px;
  border-left: 1px solid color-mix(in srgb, currentColor 18%, transparent);
}
.ep-flow__step { position: relative; padding-bottom: clamp(20px, 3vw, 30px); }
.ep-flow__step:last-child { padding-bottom: 0; }
.ep-flow__step::before {
  content: ""; position: absolute; left: -32px; top: 5px; width: 11px; height: 11px;
  border-radius: 50%; background: #f4f0e8;
  border: 1px solid color-mix(in srgb, currentColor 42%, transparent);
}
.ep-flow__n {
  font-size: 0.66rem; letter-spacing: 0.18em; text-transform: uppercase;
  /* 55% ⇒ đo được 3,73:1 — dưới chuẩn 4,5. Chữ 10,5px in hoa là cỡ khó đọc nhất trên
     trang, không phải chỗ để làm mờ cho "sang". 66% ⇒ 4,9:1. */
  color: color-mix(in srgb, currentColor 66%, transparent);
}
.ep-flow__step h3 {
  margin: 5px 0 6px; font-family: var(--serif); font-weight: 400;
  font-size: clamp(1.05rem, 1.8vw, 1.3rem); line-height: 1.25;
}
.ep-flow__step p {
  margin: 0; max-width: 66ch; font-size: clamp(0.84rem, 1vw, 0.92rem); line-height: 1.7;
  color: color-mix(in srgb, currentColor 76%, transparent);
}
/* ── thời gian dự kiến ── */
.ep-flow__time {
  margin-top: clamp(26px, 4vw, 38px); padding: clamp(18px, 2.6vw, 26px);
  border: 1px solid color-mix(in srgb, currentColor 16%, transparent);
  background: color-mix(in srgb, currentColor 4%, transparent);
}
.ep-flow__k {
  margin: 0; font-size: 0.66rem; letter-spacing: 0.16em; text-transform: uppercase;
  color: color-mix(in srgb, currentColor 66%, transparent);
}
.ep-flow__v { margin: 7px 0 0; font-family: var(--serif); font-size: clamp(1.3rem, 2.4vw, 1.7rem); }
.ep-flow__note {
  margin: 10px 0 0; max-width: 74ch; font-size: 0.8rem; line-height: 1.7;
  color: color-mix(in srgb, currentColor 66%, transparent);
}
/* ── hồ sơ hai bên ── */
.ep-flow__docs {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: clamp(22px, 4vw, 44px); margin-top: clamp(26px, 4vw, 40px);
  padding-top: clamp(24px, 3.5vw, 34px);
  border-top: 1px solid color-mix(in srgb, currentColor 16%, transparent);
}
.ep-flow__col h3,
.ep-flow__notes h3 {
  margin: 0 0 12px; font-family: var(--serif); font-weight: 400;
  font-size: clamp(1rem, 1.7vw, 1.2rem);
}
.ep-flow__case {
  margin: 0 0 8px; font-size: 0.8rem; line-height: 1.65;
  color: color-mix(in srgb, currentColor 62%, transparent);
}
/* Câu "bên bán là cá nhân thì danh mục khác" phải ĐỌC ĐƯỢC, không phải chú thích mờ cuối
   khối: thiếu nó là khách tưởng danh mục công ty đúng cho mọi tài sản. */
.ep-flow__case--alt {
  margin: 12px 0 0; padding-top: 10px;
  border-top: 1px dashed color-mix(in srgb, currentColor 22%, transparent);
  color: color-mix(in srgb, currentColor 78%, transparent);
}
.ep-flow__col ul,
.ep-flow__notes ul { list-style: none; margin: 0; padding: 0; }
.ep-flow__col li,
.ep-flow__notes li {
  position: relative; padding: 9px 0 9px 20px; line-height: 1.65;
  font-size: clamp(0.83rem, 1vw, 0.9rem);
  border-bottom: 1px solid color-mix(in srgb, currentColor 11%, transparent);
  color: color-mix(in srgb, currentColor 80%, transparent);
}
.ep-flow__col li:last-child,
.ep-flow__notes li:last-child { border-bottom: 0; }
.ep-flow__col li::before,
.ep-flow__notes li::before {
  content: ""; position: absolute; left: 2px; top: 17px; width: 6px; height: 1px;
  background: color-mix(in srgb, currentColor 45%, transparent);
}
.ep-flow__notes {
  margin-top: clamp(24px, 3.5vw, 34px); padding-top: clamp(24px, 3.5vw, 34px);
  border-top: 1px solid color-mix(in srgb, currentColor 16%, transparent);
}
.ep-flow__src {
  margin: clamp(22px, 3vw, 30px) 0 0; max-width: 78ch;
  font-size: 0.76rem; line-height: 1.7;
  /* Dòng DẪN NGUỒN là câu phải đọc được nhất theo Editorial OS — 60% chỉ ra 4,34:1. */
  color: color-mix(in srgb, currentColor 70%, transparent);
}

/* ══════════════════════════════════════════════════════════════════════════════════════
   THẺ LIÊN HỆ NGƯỜI GỬI trên trang tài sản — share-agent.js (chỉ có khi vào qua /s/<mã>)
   Nằm TRONG trang tài sản (đã có nền + token theo sáng/tối) nên chỉ cần khung + khoảng thở.
   Dùng var(--…) để theo được cả hai chế độ; đừng đặt màu cứng như .epfin (khối đó cố ý
   giả tờ giấy, thẻ này thì phải hoà vào trang).
   ══════════════════════════════════════════════════════════════════════════════════════ */
.epagent {
  margin: clamp(40px, 6vw, 76px) 0 0;
  padding: clamp(22px, 3.6vw, 36px);
  border: 1px solid var(--line);
  border-radius: 2px;
  background: color-mix(in srgb, var(--gold) 5%, transparent);
}
.epagent__head { display: flex; align-items: center; gap: 18px; margin-top: 16px; }
.epagent__ava {
  flex: 0 0 auto; display: grid; place-items: center; width: 68px; height: 68px;
  border-radius: 50%; object-fit: cover;
  border: 1px solid color-mix(in srgb, var(--gold) 45%, transparent);
}
.epagent__ava--txt {
  background: color-mix(in srgb, var(--gold) 16%, transparent); color: var(--gold);
  font-family: var(--serif); font-size: 1.35rem; letter-spacing: 0.04em;
}
.epagent__name { font-family: var(--serif); font-size: clamp(1.15rem, 2vw, 1.5rem); line-height: 1.2; }
.epagent__title { margin-top: 5px; font-size: 0.82rem; color: var(--gold); letter-spacing: 0.04em; }
.epagent__intro {
  margin: 18px 0 0; max-width: 62ch; font-size: 0.9rem; line-height: 1.75;
  color: color-mix(in srgb, var(--text) 80%, transparent);
}
.epagent__cta { display: flex; flex-wrap: wrap; gap: 10px; margin: clamp(18px, 3vw, 26px) 0 0; }
.epagent__list { list-style: none; margin: clamp(18px, 3vw, 26px) 0 0; padding: 0; border-top: 1px solid var(--line); }
.epagent__list:empty { display: none; }
.epagent__row {
  display: flex; align-items: baseline; justify-content: space-between; gap: 18px;
  padding: 12px 2px; border-bottom: 1px solid var(--line);
}
.epagent__k {
  font-size: 0.66rem; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--muted); white-space: nowrap;
}
.epagent__v { font-size: 0.9rem; text-align: right; word-break: break-word; }
a.epagent__v { color: var(--gold); text-decoration: none; }
a.epagent__v:hover { text-decoration: underline; }
.epagent__foot { margin-top: 18px; font-size: 0.74rem; line-height: 1.7; color: var(--muted); }
@media (max-width: 560px) {
  .epagent__head { gap: 14px; }
  .epagent__ava { width: 56px; height: 56px; }
  .epagent__cta .btn { flex: 1 1 auto; text-align: center; }
}

/* ══════════════════════════════════════════════════════════════════════════════════════
   BIO PAGE CÔNG KHAI /bio/<mã> — bio-page.js
   Trang đứng một mình (không nằm trong trang tài sản) nên tự lo nền + khoảng thở.
   ══════════════════════════════════════════════════════════════════════════════════════ */
.nbio {
  position: fixed; inset: 0; z-index: 900; overflow-y: auto;
  background: var(--ink); color: var(--text);
  padding: clamp(28px, 6vw, 72px) clamp(18px, 5vw, 40px);
}
.nbio__inner { max-width: 620px; margin: 0 auto; }
.nbio__brand { display: block; width: 132px; margin: 0 auto clamp(28px, 5vw, 52px); }
.nbio__brand img { width: 100%; height: auto; display: block; }
.nbio__head { text-align: center; }
.nbio__ava {
  display: grid; place-items: center; width: 104px; height: 104px; margin: 0 auto 18px;
  border-radius: 50%; object-fit: cover;
  border: 1px solid color-mix(in srgb, var(--gold) 45%, transparent);
}
.nbio__ava--txt {
  background: color-mix(in srgb, var(--gold) 16%, transparent); color: var(--gold);
  font-family: var(--serif); font-size: 2rem; letter-spacing: 0.04em;
}
.nbio__name { font-family: var(--serif); font-size: clamp(1.7rem, 4vw, 2.4rem); line-height: 1.15; }
.nbio__title { margin-top: 8px; color: var(--gold); font-size: 0.9rem; letter-spacing: 0.08em; }
.nbio__branch { margin-top: 4px; color: var(--muted); font-size: 0.82rem; }
.nbio__intro {
  margin: clamp(22px, 4vw, 34px) 0 0; text-align: center;
  font-size: 0.95rem; line-height: 1.8; color: color-mix(in srgb, var(--text) 82%, transparent);
}
.nbio__cta { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin: clamp(24px, 4vw, 36px) 0; }
.nbio__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.nbio__row {
  display: flex; align-items: baseline; justify-content: space-between; gap: 18px;
  padding: 14px 2px; border-bottom: 1px solid var(--line);
}
.nbio__k { font-size: 0.68rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.nbio__v { font-size: 0.95rem; text-align: right; word-break: break-word; }
a.nbio__v { color: var(--gold); text-decoration: none; }
a.nbio__v:hover { text-decoration: underline; }
.nbio__foot { margin-top: clamp(26px, 4vw, 40px); font-size: 0.75rem; line-height: 1.7; color: var(--muted); text-align: center; }

/* ── THAM CHIẾU KHUNG GIÁ NHÀ NƯỚC theo tuyến đường (04/08) ──────────────────
   Ba ô ngang trên máy tính, xếp dọc trên điện thoại. Không tô màu cảnh báo,
   không mũi tên lên/xuống: đây là dữ kiện tham chiếu, không phải khuyến nghị. */
.ep-nnprice {
  margin-top: clamp(1.6rem, 3vw, 2.4rem);
  padding: clamp(1.1rem, 2.2vw, 1.6rem);
  border: 1px solid var(--line);
  border-radius: var(--r-2);
  background: var(--ink-2);
}
.ep-nnprice__row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(0.8rem, 2vw, 1.6rem);
  margin-top: 0.9rem;
}
.ep-nnprice__cell {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 0;
}
.ep-nnprice__lab {
  font-size: var(--fs-3xs);
  letter-spacing: var(--ls-wide);
  text-transform: uppercase;
  color: var(--muted);
  line-height: 1.5;
}
.ep-nnprice__v {
  font-family: var(--serif);
  font-size: clamp(1.35rem, 3.4vw, 1.9rem);
  font-weight: 400;
  color: var(--text);
  line-height: 1.15;
}
.ep-nnprice__cell i {
  font-style: normal;
  font-size: var(--fs-2xs);
  color: var(--muted);
  letter-spacing: 0.04em;
}
/* ô CHÊNH LỆCH là kết luận của khối ⇒ cho nó màu đồng để mắt dừng lại đúng chỗ */
.ep-nnprice__cell--x .ep-nnprice__v { color: var(--gold); }
.ep-nnprice__note,
.ep-nnprice__src {
  margin-top: 0.85rem;
  font-size: var(--fs-2xs);
  line-height: 1.65;
  color: var(--muted);
}
/* dòng NGUỒN chìm hơn dòng cảnh báo: cảnh báo là thứ phải đọc, nguồn là thứ
   phải KIỂM ĐƯỢC — hai vai khác nhau, không cùng một sắc độ */
.ep-nnprice__src {
  margin-top: 0.4rem;
  color: var(--muted-2);
}
@media (max-width: 640px) {
  .ep-nnprice__row {
    grid-template-columns: 1fr;
    gap: 0.9rem;
  }
  /* trên điện thoại xếp dọc: nhãn trái · số phải, cùng luật với bảng thông số */
  .ep-nnprice__cell {
    flex-direction: row;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.8rem;
    padding-bottom: 0.7rem;
    border-bottom: 1px solid var(--line);
  }
  .ep-nnprice__cell:last-child { border-bottom: 0; padding-bottom: 0; }
  .ep-nnprice__lab { flex: 1; }
  .ep-nnprice__cell i { margin-left: 0.3rem; }
}
