/* Larimer Capital Group — Journal
   Dùng lại biến màu và font của styles.css để blog khớp với trang chủ. */

.journal,
.post {
  max-width: 100%;
  padding: 12rem 1.5rem 6rem;
  margin: 0 auto;
}

@media (min-width: 768px) {
  .journal,
  .post { padding: 13rem 2rem 7rem; }
}

.journal { max-width: 68rem; }
.post    { max-width: 46rem; }

/* ------------------------------------------------------------- chung --- */

.post-kicker {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-size: 12px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--muted-foreground);
}

.post-dot { opacity: 0.45; }

/* ----------------------------------------------------- trang danh sách -- */

.journal-head { max-width: 42rem; }

.journal-title {
  margin: 2rem 0 0;
  font-size: clamp(2.5rem, 6vw, 4rem);
  line-height: 1.04;
  letter-spacing: -0.024em;
}

.journal-lede {
  margin-top: 1.75rem;
  font-size: clamp(1.05rem, 2vw, 1.25rem);
  line-height: 1.65;
  font-weight: 300;
  color: var(--muted-foreground);
}

.entries {
  list-style: none;
  margin: 4.5rem 0 0;
  padding: 0;
  border-top: 1px solid var(--border);
}

.entry { border-bottom: 1px solid var(--border); }

.entry-link {
  display: block;
  padding: 2.75rem 0;
  text-decoration: none;
  color: inherit;
  transition: opacity 0.3s ease;
}

.entry-link:hover { opacity: 0.72; }

.entry-meta,
.post-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin: 0;
  font-size: 11.5px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--muted-foreground);
}

.entry-title {
  margin: 1rem 0 0;
  font-size: clamp(1.5rem, 3.2vw, 2rem);
  line-height: 1.14;
}

.entry-summary {
  margin: 1rem 0 0;
  max-width: 44rem;
  font-size: 1.0625rem;
  line-height: 1.7;
  font-weight: 300;
  color: var(--muted-foreground);
}

.entry-more {
  display: inline-block;
  margin-top: 1.5rem;
  font-size: 11.5px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--gold);
}

.entry-empty p {
  padding: 3rem 0;
  color: var(--muted-foreground);
  font-weight: 300;
}

/* ------------------------------------------------------- trang bài viết - */

.post-back {
  display: inline-block;
  margin-bottom: 2.5rem;
  font-size: 11.5px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--muted-foreground);
  text-decoration: none;
  transition: color 0.3s ease;
}

.post-back:hover { color: var(--gold); }

.post-title {
  margin: 1.75rem 0 0;
  font-size: clamp(2rem, 5vw, 3rem);
  line-height: 1.08;
  letter-spacing: -0.024em;
}

.post-meta { margin-top: 1.5rem; }

.post-draft {
  padding: 0.25rem 0.6rem;
  border: 1px solid var(--gold);
  border-radius: 2px;
  color: var(--gold);
  font-size: 10px;
  letter-spacing: 0.18em;
}

.post-lede {
  margin-top: 2rem;
  font-size: 1.1875rem;
  line-height: 1.65;
  font-weight: 300;
  color: var(--muted-foreground);
}

.post-head {
  padding-bottom: 2.5rem;
  border-bottom: 1px solid var(--border);
}

/* Thân bài — chỗ quan trọng nhất, ưu tiên dễ đọc */

.post-body {
  margin-top: 3rem;
  font-size: 1.125rem;
  line-height: 1.8;
  font-weight: 300;
}

.post-body p { margin: 0 0 1.75rem; }

.post-body h2,
.post-body h3 {
  font-family: var(--font-brand);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.2;
  margin: 3.25rem 0 1.25rem;
}

.post-body h2 { font-size: 1.6rem; }
.post-body h3 { font-size: 1.3rem; }

.post-body strong { font-weight: 600; }

.post-body a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: var(--gold);
  transition: color 0.25s ease;
}

.post-body a:hover { color: var(--gold); }

.post-body ul,
.post-body ol { margin: 0 0 1.75rem; padding-left: 1.4rem; }
.post-body li { margin-bottom: 0.75rem; }

.post-body blockquote {
  margin: 2.5rem 0;
  padding-left: 1.5rem;
  border-left: 2px solid var(--gold);
}

.post-body blockquote p {
  margin: 0;
  font-size: 1.25rem;
  line-height: 1.6;
  font-style: italic;
  color: var(--foreground);
}

.post-rule {
  margin: 3rem 0;
  border: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--border), transparent);
}

.post-body code {
  font-family: var(--font-mono);
  font-size: 0.9em;
  padding: 0.1em 0.35em;
  background: var(--secondary);
  border-radius: 2px;
}

/* ------------------------------------------------------------ nguồn ---- */

.post-sources {
  margin-top: 4rem;
  padding: 2rem;
  background: var(--secondary);
  border-radius: 2px;
}

.post-sources h2 {
  margin: 0 0 1rem;
  font-size: 11px;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--muted-foreground);
  font-weight: 500;
}

.post-sources ul { margin: 0; padding-left: 1.1rem; }

.post-sources li {
  margin-bottom: 0.5rem;
  font-size: 0.9375rem;
  line-height: 1.6;
  font-weight: 300;
}

.post-sources a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-color: var(--gold);
}

/* --------------------------------------------------------- đăng ký ---- */

.post-subscribe {
  margin-top: 4.5rem;
  padding: 3rem 2rem;
  background: var(--secondary);
  border-radius: 2px;
}

@media (min-width: 768px) {
  .post-subscribe { padding: 3.5rem 3rem; }
}

.post-subscribe h2 {
  margin: 1.5rem 0 0;
  font-size: clamp(1.5rem, 3vw, 2rem);
  line-height: 1.12;
  letter-spacing: -0.02em;
}

.post-subscribe > p {
  margin: 1rem 0 0;
  font-size: 1rem;
  line-height: 1.65;
  font-weight: 300;
  color: var(--muted-foreground);
}

.subscribe-form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 2rem;
}

.subscribe-form input {
  flex: 1 1 16rem;
  min-width: 0;
  padding: 0.85rem 1rem;
  font-size: 0.9375rem;
  font-weight: 300;
  font-family: inherit;
  color: var(--foreground);
  background: var(--card);
  border: 1px solid var(--input);
  border-radius: 3px;
  outline: none;
  transition: border-color 0.25s ease;
}

.subscribe-form input:focus { border-color: var(--gold); }

.subscribe-form button {
  flex: 0 0 auto;
  padding: 0.85rem 2rem;
  font-size: 11.5px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  font-weight: 500;
  font-family: inherit;
  color: var(--gold-foreground);
  background: var(--gold);
  border: 0;
  border-radius: 3px;
  cursor: pointer;
  transition: filter 0.25s ease;
}

.subscribe-form button:hover { filter: brightness(1.12); }
.subscribe-form button:disabled { opacity: 0.6; cursor: default; }

.subscribe-note {
  margin: 1rem 0 0;
  font-size: 12px;
  font-weight: 300;
  color: var(--muted-foreground);
}

/* ------------------------------------------------------ miễn trừ ------ */

.post-disclaimer {
  margin-top: 3.5rem;
  padding-top: 2rem;
  border-top: 1px solid var(--border);
  font-size: 12px;
  line-height: 1.7;
  font-weight: 300;
  color: var(--muted-foreground);
}

/* ------------------------------------------ section Journal trang chủ -- */

.home-journal-head {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  align-items: flex-start;
}

@media (min-width: 900px) {
  .home-journal-head {
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-end;
  }
}

.home-journal-title {
  margin: 2rem 0 0;
  font-size: clamp(2.25rem, 5vw, 3.5rem);
  line-height: 1.05;
  letter-spacing: -0.024em;
}

.home-journal-lede {
  margin: 1.5rem 0 0;
  max-width: 34rem;
  font-size: clamp(1rem, 2vw, 1.15rem);
  line-height: 1.65;
  font-weight: 300;
  color: var(--muted-foreground);
}

.home-journal-all {
  flex: 0 0 auto;
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--foreground);
  text-decoration: none;
  border-bottom: 1px solid color-mix(in srgb, var(--foreground) 40%, transparent);
  padding-bottom: 0.5rem;
  transition: color 0.3s ease, border-color 0.3s ease;
}

.home-journal-all:hover { color: var(--gold); border-color: var(--gold); }

.home-journal-list {
  list-style: none;
  display: grid;
  gap: 0;
  margin: 4rem 0 0;
  padding: 0;
  border-top: 1px solid var(--border);
}

@media (min-width: 900px) {
  .home-journal-list {
    grid-template-columns: repeat(3, 1fr);
    gap: 2.5rem;
  }
}

.home-journal-item { border-bottom: 1px solid var(--border); }

@media (min-width: 900px) {
  .home-journal-item { border-bottom: 0; }
}

.home-journal-item a {
  display: block;
  padding: 2.25rem 0;
  text-decoration: none;
  color: inherit;
  transition: opacity 0.3s ease;
}

.home-journal-item a:hover { opacity: 0.7; }

.home-journal-date {
  margin: 0;
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--muted-foreground);
}

.home-journal-item-title {
  margin: 0.9rem 0 0;
  font-size: 1.3rem;
  line-height: 1.22;
}

.home-journal-summary {
  margin: 0.9rem 0 0;
  font-size: 0.96rem;
  line-height: 1.65;
  font-weight: 300;
  color: var(--muted-foreground);
}

.home-journal-empty {
  margin: 3.5rem 0 0;
  padding-top: 2.5rem;
  border-top: 1px solid var(--border);
  font-weight: 300;
  color: var(--muted-foreground);
}

/* ------------------------------------------------------------ ảnh bài ---- */

.post-hero {
  margin: 0 0 2.5rem;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 3px;
  background: var(--secondary);
}

.post-hero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.entry-thumb,
.home-journal-thumb {
  aspect-ratio: 16 / 10;
  overflow: hidden;
  border-radius: 3px;
  background: var(--secondary);
}

.entry-thumb img,
.home-journal-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.entry-link:hover .entry-thumb img,
.home-journal-item a:hover .home-journal-thumb img {
  transform: scale(1.03);
}

.entry-thumb {
  max-width: 22rem;
  margin-bottom: 1.5rem;
}

.home-journal-thumb {
  margin-bottom: 1.5rem;
}

@media (min-width: 640px) {
  .entry-link {
    display: flex;
    flex-direction: row-reverse;
    gap: 2rem;
    align-items: flex-start;
  }

  .entry-thumb {
    flex: 0 0 14rem;
    margin-bottom: 0;
  }

  .entry-text {
    flex: 1 1 auto;
    min-width: 0;
  }
}

/* ------------------------- hai lối đi tiếp ở cuối khối Journal trang chủ -- */

.home-journal-more {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  margin-top: 4rem;
  padding-top: 3rem;
  border-top: 1px solid var(--border);
}

@media (min-width: 760px) {
  .home-journal-more { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
}

.home-journal-more-link {
  display: block;
  padding: 1.5rem 0 0;
  border-top: 1px solid var(--border);
  text-decoration: none;
  transition: border-color 0.25s ease;
}

.home-journal-more-link:hover { border-top-color: var(--gold); }

.home-journal-more-label {
  display: block;
  font-family: var(--font-brand);
  font-size: 1.05rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--foreground);
}

.home-journal-more-link:hover .home-journal-more-label { color: var(--gold); }

.home-journal-more-text {
  display: block;
  margin-top: 0.5rem;
  font-size: 0.94rem;
  line-height: 1.6;
  font-weight: 300;
  color: var(--muted-foreground);
}

/* ----------------------------------------------------------- header ---- */
/* styles.css là bản Tailwind build sẵn, không có sẵn lg:hidden — viết tường minh.
   Menu ngang có 8 mục (7 link + dropdown Tools). Đo tại 1024px: chỗ trống còn
   -0.1px, tức là 7 mục đã kín khít — thêm mục thứ 8 ở mốc cũ sẽ ép logo co lại
   như lần trước. Đo lại sau khi cấm xuống dòng: 8 mục cần ~1256px, nên mốc
   chuyển sang hamburger nâng từ 1024 lên 1280px. Dưới mốc đó là hamburger, và
   menu hamburger có đủ cả 9 đích đến nên không ai mất lối đi nào. */

@media (min-width: 1280px) {
  header button[aria-label="Menu"] { display: none !important; }
}

@media (max-width: 1279.98px) {
  header nav { display: none !important; }
}

/* Logo không bao giờ được co lại vì menu chiếm chỗ */
header a[href="#top"] { flex-shrink: 0; }
header a[href="#top"] img { max-width: none; }

/* Mục menu không được xuống dòng. Thiếu dòng này thì khi hết chỗ, "How We
   Acquire" và "Track Record" vỡ thành hai dòng thay vì báo cho ta biết là
   thanh menu đã quá chật. */
header nav > a,
header nav .nav-tools-btn { white-space: nowrap; }

/* Khoảng cách giữa các mục: Tailwind đang để gap-7 / xl:gap-10 (~36px), với 8
   mục thì cần tới 1318px mới đủ — loại luôn màn hình 1280 rất phổ biến. Thu lại
   còn ~24px, nới ra ở màn thật rộng. */
header nav {
  column-gap: 1.25rem !important;
}

@media (min-width: 1440px) {
  header nav { column-gap: 1.9rem !important; }
}

/* ------------------------------------------------- trang quà /aipal ---- */

.aipal {
  max-width: 44rem;
  margin: 0 auto;
  padding: 12rem 1.5rem 6rem;
}

@media (min-width: 768px) {
  .aipal { padding: 13rem 2rem 7rem; }
}

.aipal-title {
  margin: 2rem 0 0;
  font-size: clamp(2.1rem, 5vw, 3rem);
  line-height: 1.07;
  letter-spacing: -0.024em;
}

.aipal-lede {
  margin: 1.75rem 0 0;
  font-size: 1.1rem;
  line-height: 1.7;
  font-weight: 300;
  color: var(--muted-foreground);
}

.aipal-sub {
  margin: 3.5rem 0 1.25rem;
  font-family: var(--font-brand);
  font-size: 1.15rem;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.aipal-list { list-style: none; margin: 0; padding: 0; }

.aipal-list li {
  padding: 1.35rem 0;
  border-top: 1px solid var(--border);
}

.aipal-list strong {
  display: block;
  font-weight: 600;
  font-size: 1rem;
  margin-bottom: 0.4rem;
}

.aipal-list span {
  font-size: 0.97rem;
  line-height: 1.65;
  font-weight: 300;
  color: var(--muted-foreground);
}

.aipal-box {
  margin-top: 3rem;
  padding: 2.25rem;
  background: var(--secondary);
  border-radius: 3px;
}

.aipal-box .subscribe-form { margin-top: 0; }

/* phần quà, hiện ra sau khi đăng ký */
.aipal-guide { margin-top: 3rem; }

.aipal-ready {
  margin: 0 0 1rem;
  padding: 0.9rem 1.15rem;
  background: var(--accent);
  border-left: 2px solid var(--gold);
  border-radius: 2px;
  font-size: 0.97rem;
  font-weight: 400;
}

.aipal-guide p {
  font-size: 1.02rem;
  line-height: 1.7;
  font-weight: 300;
}

.aipal-code {
  margin: 1.25rem 0 0;
  padding: 1.5rem;
  background: #13161a;
  color: #e8e6e1;
  border-radius: 3px;
  font-family: var(--font-mono);
  font-size: 12.5px;
  line-height: 1.65;
  white-space: pre-wrap;
  word-break: break-word;
  overflow-x: auto;
}

.aipal-steps { margin: 1rem 0 0; padding-left: 1.2rem; }

.aipal-steps li {
  margin-bottom: 0.9rem;
  font-size: 1rem;
  line-height: 1.7;
  font-weight: 300;
}

.aipal-close {
  margin-top: 3rem;
  padding-top: 1.75rem;
  border-top: 1px solid var(--border);
}

.aipal-close a { color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }

/* ------------------------------------------- trang /screener ----------- */
/* Cùng khuôn với .aipal: padding trên để không bị header cố định che. */

.screener {
  max-width: 48rem;
  margin: 0 auto;
  padding: 12rem 1.5rem 6rem;
}

@media (min-width: 768px) {
  .screener { padding: 13rem 2rem 7rem; }
}

.screener-title {
  margin: 2rem 0 0;
  font-size: clamp(2rem, 4.6vw, 2.85rem);
  line-height: 1.08;
  letter-spacing: -0.024em;
}

.screener-lede {
  margin: 1.75rem 0 0;
  font-size: 1.08rem;
  line-height: 1.7;
  font-weight: 300;
  color: var(--muted-foreground);
}

.screener-privacy {
  margin: 1.5rem 0 0;
  padding: 0.85rem 1.1rem;
  background: var(--accent);
  border-left: 2px solid var(--gold);
  border-radius: 2px;
  font-size: 0.9rem;
  line-height: 1.6;
  font-weight: 400;
}

/* --------------------------------------------------------- ô nhập ----- */

.screener-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.35rem 1.5rem;
  margin-top: 2.75rem;
}

@media (min-width: 560px) {
  .screener-grid { grid-template-columns: 1fr 1fr; }
}

.screener-field { display: block; }

.screener-label {
  display: block;
  margin-bottom: 0.5rem;
  font-size: 0.83rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted-foreground);
}

.screener-label em {
  font-style: normal;
  text-transform: none;
  letter-spacing: 0;
  opacity: 0.7;
}

.screener-field input {
  width: 100%;
  padding: 0.8rem 0.95rem;
  background: var(--input);
  border: 1px solid var(--border);
  border-radius: 2px;
  color: var(--foreground);
  font-family: var(--font-mono);
  font-size: 0.97rem;
  outline: none;
  transition: border-color 0.2s ease;
}

.screener-field input::placeholder { color: var(--muted-foreground); opacity: 0.55; }
.screener-field input:focus { border-color: var(--gold); }

.screener-check {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin-top: 1.5rem;
  font-size: 0.94rem;
  font-weight: 300;
  color: var(--muted-foreground);
  cursor: pointer;
}

.screener-check input {
  width: 1rem;
  height: 1rem;
  accent-color: var(--gold);
  cursor: pointer;
}

/* Nút Calculate: hành động chính của trang nên tô đặc, khác với nút xuất PDF
   chỉ viền. data-no-cta ở markup là bắt buộc, xem initCtas(). */

.screener-run {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.8rem 1.2rem;
  margin-top: 2.25rem;
  padding-top: 2rem;
  border-top: 1px solid var(--border);
}

.screener-run-btn {
  flex: 0 0 auto;
  padding: 0.95rem 2.4rem;
  background: var(--gold);
  border: 1px solid var(--gold);
  border-radius: 2px;
  color: var(--gold-foreground, #17171a);
  font-family: var(--font-brand);
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  cursor: pointer;
  transition: filter 0.2s ease;
}

.screener-run-btn:hover { filter: brightness(1.1); }

.screener-run-hint {
  flex: 1 1 14rem;
  font-size: 0.85rem;
  line-height: 1.55;
  font-weight: 300;
  color: var(--muted-foreground);
}

/* Báo đúng ô nào còn thiếu, thay vì im lặng không cho bấm */
.screener-run-msg {
  flex: 1 1 100%;
  margin: 0.35rem 0 0;
  font-size: 0.9rem;
  line-height: 1.5;
  font-weight: 400;
  color: #9c3f32;
}

.screener-field input.screener-input-bad {
  border-color: #9c3f32;
  background: rgba(170, 70, 55, 0.06);
}


/* ------------------------------------------------------- kết quả ------ */

.screener-out {
  margin-top: 2.5rem;
  padding-top: 2rem;
  border-top: 1px solid var(--border);
}

/* --------------------------------- chip so với khoảng thị trường ------ */

.screener-chip {
  display: inline-block;
  margin-left: 0.5rem;
  padding: 0.12rem 0.5rem;
  border-radius: 2px;
  font-family: var(--font-brand);
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
  vertical-align: 2px;
}

.screener-chip-ok    { background: rgba(120, 140, 110, 0.16); color: #4a6741; }
.screener-chip-watch { background: rgba(201, 168, 76, 0.18);  color: #8a6d1f; }
.screener-chip-bad   { background: rgba(170, 70, 55, 0.14);   color: #9c3f32; }

.screener-bench-note {
  margin: 1.5rem 0 0;
  font-size: 0.82rem;
  line-height: 1.6;
  font-weight: 300;
  color: var(--muted-foreground);
}

/* ------------------------------------------------- bảng chịu tải ------ */

.screener-stress-lede {
  margin: 0 0 1.25rem;
  font-size: 0.95rem;
  line-height: 1.6;
  font-weight: 300;
  color: var(--muted-foreground);
}

.screener-stress-row {
  display: flex;
  align-items: baseline;
  gap: 1rem;
  padding: 0.85rem 0;
  border-top: 1px solid var(--border);
}

.screener-stress-label {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 0.94rem;
  line-height: 1.5;
  font-weight: 300;
}

.screener-stress-nums {
  flex: 0 0 auto;
  text-align: right;
  white-space: nowrap;
}

.screener-stress-nums .screener-hint { margin-top: 0.15rem; }

.screener-stress-row .screener-chip {
  flex: 0 0 4.6rem;
  margin-left: 0;
  text-align: center;
}

/* Dưới 560px, ba cột cạnh nhau ép nhãn xuống bốn năm dòng (có hàng cao tới
   224px). Cho nhãn chiếm trọn một dòng, số và chip xuống dòng dưới. */
@media (max-width: 559.98px) {
  .screener-stress-row {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-areas: "label label" "nums chip";
    row-gap: 0.55rem;
    align-items: center;
  }

  .screener-stress-label { grid-area: label; }

  .screener-stress-nums {
    grid-area: nums;
    text-align: left;
    display: flex;
    align-items: baseline;
    gap: 0.6rem;
  }

  .screener-stress-nums .screener-hint { margin-top: 0; }

  .screener-stress-row .screener-chip { grid-area: chip; }
}

/* ----------------------------------------------- kết luận sàng lọc ---- */

.screener-verdict {
  margin-top: 3rem;
  padding: 1.85rem 1.9rem;
  border-radius: 3px;
  border-left: 3px solid var(--gold);
  background: var(--secondary);
}

.screener-verdict-clear   { border-left-color: #4a6741; }
.screener-verdict-caution { border-left-color: var(--gold); }
.screener-verdict-concern { border-left-color: #c2701f; }
.screener-verdict-fail    { border-left-color: #9c3f32; }

.screener-verdict-kicker {
  margin: 0;
  font-size: 0.7rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--muted-foreground);
}

.screener-verdict-title {
  margin: 0.6rem 0 0;
  font-family: var(--font-brand);
  font-size: 1.3rem;
  font-weight: 600;
  letter-spacing: -0.015em;
}

.screener-verdict-body {
  margin: 0.85rem 0 0;
  font-size: 0.99rem;
  line-height: 1.7;
  font-weight: 300;
}

.screener-verdict-note {
  margin: 1rem 0 0;
  padding-top: 0.9rem;
  border-top: 1px solid var(--border);
  font-size: 0.9rem;
  font-weight: 400;
}

.screener-metrics { margin: 0; }

.screener-metric {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 0.8rem 0;
  border-bottom: 1px solid var(--border);
}

.screener-metric dt {
  font-size: 0.88rem;
  font-weight: 300;
  color: var(--muted-foreground);
}

.screener-metric dd {
  margin: 0;
  text-align: right;
}

.screener-value {
  font-family: var(--font-mono);
  font-size: 0.93rem;
  font-weight: 500;
  white-space: nowrap;
}

.screener-hint {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.78rem;
  font-weight: 300;
  color: var(--muted-foreground);
  white-space: normal;
}

/* ------------------------------- bốn số quyết định, liếc là thấy ------ */

.screener-headline {
  display: grid;
  /* minmax(0,1fr) chứ không phải 1fr: 1fr không co xuống dưới min-content, nên
     một chip dài như "BELOW LENDER MINIMUM" (vốn nowrap) sẽ ép cột đầu phình ra
     và đẩy cột sau lọt ra ngoài khung. */
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin-top: 2.25rem;
  background: var(--border);
  border: 1px solid var(--border);
  border-radius: 3px;
  overflow: hidden;
}

@media (min-width: 720px) {
  .screener-headline { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.screener-kpi {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  padding: 1.25rem 1.15rem 1.35rem;
  background: var(--card, #fff);
}

.screener-kpi-label {
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted-foreground);
}

.screener-kpi-value {
  font-family: var(--font-mono);
  font-size: clamp(1.4rem, 3.4vw, 1.9rem);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -0.02em;
  white-space: nowrap;
}

.screener-kpi .screener-chip {
  margin-left: 0;
  align-self: flex-start;
  white-space: normal;      /* để chip dài không quyết định bề rộng cả cột */
  line-height: 1.35;
}

.screener-kpi-sub {
  font-size: 0.72rem;
  line-height: 1.4;
  font-weight: 300;
  color: var(--muted-foreground);
}

/* nhãn phụ nằm ngay trong tiêu đề mục, đỡ tốn một dòng dẫn nhập */
.screener-sub em {
  float: right;
  font-style: normal;
  font-family: var(--font-brand);
  font-size: 0.7rem;
  font-weight: 400;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted-foreground);
  padding-top: 0.35rem;
}

.screener-sub {
  margin: 3rem 0 1.15rem;
  font-family: var(--font-brand);
  font-size: 1.12rem;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.screener-flags { list-style: none; margin: 0; padding: 0; }

.screener-flag {
  padding: 0.95rem 0 0.95rem 1.4rem;
  border-top: 1px solid var(--border);
  position: relative;
  font-size: 0.97rem;
  line-height: 1.6;
  font-weight: 300;
}

.screener-flag::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1.45rem;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gold);
}

/* styles.css (Tailwind preflight) đặt list-style: none cho mọi ol/ul,
   nên phải ghi rõ lại thì số thứ tự mới hiện. */
.screener-asks {
  margin: 0;
  padding-left: 1.5rem;
  list-style: decimal;
}

.screener-asks::marker,
.screener-ask::marker {
  color: var(--gold);
}

.screener-ask {
  margin-bottom: 1.1rem;
  font-size: 1rem;
  line-height: 1.65;
  font-weight: 300;
}

.screener-ask a {
  color: var(--gold);
  text-decoration: underline;
  text-underline-offset: 3px;
  font-size: 0.88rem;
  white-space: nowrap;
}

/* ------------------------------------------------ khung xin email ---- */

.screener-box {
  margin-top: 3.5rem;
  padding: 2.25rem;
  background: var(--secondary);
  border-radius: 3px;
}

.screener-box .screener-sub { margin-top: 0; }

.screener-boxlede {
  margin: 0;
  font-size: 0.97rem;
  line-height: 1.65;
  font-weight: 300;
  color: var(--muted-foreground);
}

.screener-box .subscribe-form { margin-top: 1.5rem; }

/* Trên trang này Calculate mới là hành động chính, nên Subscribe lùi xuống
   dạng viền. Ở /blog và /aipal không có nút nào tranh chỗ nên vẫn để tô đặc. */
.screener-box .subscribe-form button {
  background: transparent;
  border: 1px solid var(--gold);
  color: var(--gold);
  transition: background 0.2s ease, color 0.2s ease;
}

.screener-box .subscribe-form button:hover:not(:disabled) {
  background: var(--gold);
  color: var(--gold-foreground, #f7f7f5);
  filter: none;
}

/* ----------------------------------------- ô tên deal + nút xuất PDF --- */

.screener-field-wide { grid-column: 1 / -1; }

.screener-field-wide input { font-family: var(--font-brand); }

.screener-print-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem 1.1rem;
  margin-top: 3rem;
  padding-top: 1.75rem;
  border-top: 1px solid var(--border);
}

.screener-print-btn {
  flex: 0 0 auto;
  padding: 0.8rem 1.6rem;
  background: transparent;
  border: 1px solid var(--gold);
  border-radius: 2px;
  color: var(--gold);
  font-family: var(--font-brand);
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease;
}

.screener-print-btn:hover {
  background: var(--gold);
  color: var(--gold-foreground, #1a1a1a);
}

.screener-print-hint {
  flex: 1 1 16rem;
  font-size: 0.85rem;
  line-height: 1.55;
  font-weight: 300;
  color: var(--muted-foreground);
}

/* Đầu trang in và bảng "As entered" chỉ tồn tại trên giấy */
.screener-print-head,
.screener-print-inputs { display: none; }

/* -------------------------------------------------- bản in một trang -- */
/* Mục tiêu: vừa đúng một trang A4. Bỏ toàn bộ khung site và phần dẫn nhập,
   giữ lại số liệu đã nhập, các chỉ số, cờ đỏ, kịch bản chịu tải, kết luận và
   ba câu hỏi. Chia hai cột để đủ chỗ. */

@media print {
  @page { margin: 10mm; }

  html, body, main {
    background: #fff !important;
    color: #111 !important;
    font-size: 7.6pt;
  }

  /* khung site và mọi thứ chỉ có ý nghĩa trên màn hình */
  header, footer,
  .screener .post-kicker,
  .screener-title,
  .screener-lede,
  .screener-privacy,
  .screener-grid,
  .screener-check,
  .screener-bench-note,
  .screener-box,
  .screener-print-actions,
  .screener-run,
  .screener-stress-lede { display: none !important; }

  .screener {
    max-width: none;
    margin: 0;
    padding: 0;
  }

  .screener-out { margin: 0; padding: 0; border: 0; }

  /* nền chip là thông tin, không phải trang trí — buộc trình duyệt in màu */
  .screener-chip,
  .screener-verdict {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  /* ------------------------------------------------------ đầu trang -- */

  .screener-print-head {
    display: block;
    margin-bottom: 2.3mm;
    padding-bottom: 2.5mm;
    border-bottom: 0.4mm solid #111;
  }

  .screener-print-brand {
    margin: 0;
    font-size: 7pt;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #555;
  }

  .screener-print-meta {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 6mm;
    margin-top: 1.5mm;
  }

  .screener-print-name {
    font-family: var(--font-brand);
    font-size: 11pt;
    font-weight: 600;
    letter-spacing: -0.01em;
  }

  .screener-print-date { font-size: 8pt; color: #555; }

  /* ------------------------------------------------- số liệu đã nhập -- */

  .screener-print-inputs {
    display: block;
    columns: 3;
    column-gap: 6mm;
    margin: 0 0 2.3mm;
    padding-bottom: 1.8mm;
    border-bottom: 0.2mm solid #ccc;
  }

  .screener-print-inputs-title {
    column-span: all;
    margin-bottom: 1.5mm;
    font-size: 7pt;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #555;
  }

  .screener-print-input {
    display: flex;
    justify-content: space-between;
    gap: 3mm;
    break-inside: avoid;
    padding: 0.45mm 0;
  }

  .screener-print-input dt { color: #555; }
  .screener-print-input dd { margin: 0; font-weight: 500; }

  /* ---------------------------------------------------- các chỉ số --- */

  .screener-metrics {
    columns: 2;
    column-gap: 8mm;
    margin: 0;
  }

  .screener-metric {
    break-inside: avoid;
    padding: 0.85mm 0;
    border-bottom: 0.2mm solid #ddd;
  }

  .screener-metric dt { font-size: 7.7pt; color: #333; }
  .screener-value { font-size: 8.1pt; }
  .screener-hint { font-size: 6.4pt; color: #666; }

  .screener-chip {
    margin-left: 2mm;
    padding: 0.2mm 1.2mm;
    font-size: 6pt;
    border: 0.2mm solid currentColor;
  }

  /* bốn số quyết định: một dải bốn ô ngay dưới phần kết luận */
  .screener-headline {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    margin: 3mm 0 0;
    border: 0.2mm solid #bbb;
    border-radius: 0;
    overflow: visible;
    background: transparent;
    break-inside: avoid;
  }

  .screener-kpi {
    gap: 0.6mm;
    padding: 2mm 2.2mm;
    background: transparent;
    border-right: 0.2mm solid #ddd;
  }

  .screener-kpi:last-child { border-right: 0; }
  .screener-kpi-label { font-size: 6.4pt; color: #555; }
  .screener-kpi-value { font-size: 14pt; line-height: 1; }
  .screener-kpi-sub { font-size: 6pt; color: #666; }
  .screener-kpi .screener-chip { margin: 0; }

  .screener-sub {
    margin: 1.7mm 0 0.9mm;
    font-size: 8.4pt;
    break-after: avoid;
  }

  /* ------------------------------------------- cờ đỏ và kịch bản ----- */

  .screener-flags { columns: 2; column-gap: 8mm; }

  .screener-flag {
    break-inside: avoid;
    padding: 0.75mm 0 0.75mm 2.6mm;
    border-top: 0.2mm solid #ddd;
    font-size: 7.3pt;
    line-height: 1.26;
  }

  .screener-flag::before { top: 2.6mm; width: 1.1mm; height: 1.1mm; background: #111; }

  .screener-stress { columns: 2; column-gap: 8mm; }

  /* Cùng kiểu với bản điện thoại: nhãn một dòng, số và chip dòng dưới.
     Để inline thì nhãn dính liền số ("…5 points0.61") và chip rơi lung tung. */
  .screener-stress-row {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-areas: "label label" "nums chip";
    column-gap: 2mm;
    row-gap: 0.4mm;
    align-items: baseline;
    break-inside: avoid;
    padding: 0.8mm 0;
    border-top: 0.2mm solid #ddd;
  }

  .screener-stress-label {
    grid-area: label;
    font-size: 7.3pt;
    line-height: 1.28;
  }

  .screener-stress-nums {
    grid-area: nums;
    display: flex;
    align-items: baseline;
    gap: 1.6mm;
    text-align: left;
  }

  .screener-stress-nums .screener-value { margin-right: 0; }
  .screener-stress-nums .screener-hint { display: inline; margin: 0; }

  .screener-stress-row .screener-chip { grid-area: chip; margin: 0; }

  /* ------------------------------------------------------ kết luận --- */

  .screener-verdict {
    margin-top: 0;
    padding: 2mm 2.5mm;
    border: 0.2mm solid #bbb;
    border-left: 0.9mm solid #111;
    background: #f6f6f4;
    break-inside: avoid;
  }

  .screener-verdict-kicker { font-size: 6.6pt; }
  .screener-verdict-title { margin-top: 0.8mm; font-size: 9.8pt; }
  .screener-verdict-body { margin-top: 1.5mm; font-size: 7.2pt; line-height: 1.34; }
  .screener-verdict-note { margin-top: 1.2mm; padding-top: 1.2mm; font-size: 7.1pt; }

  .screener-asks { margin: 0; padding-left: 4mm; }

  .screener-ask {
    margin-bottom: 0.7mm;
    font-size: 7.3pt;
    line-height: 1.32;
    break-inside: avoid;
  }

  .screener-ask a { display: none; }

  /* ---------------------------------------------------- disclaimer --- */

  .post-disclaimer {
    margin-top: 2mm;
    padding-top: 1.3mm;
    border-top: 0.2mm solid #ccc;
    font-size: 5.9pt;
    line-height: 1.4;
    color: #555;
  }
}

/* ------------------------------------------------- dropdown Tools ------ */
/* Nút mở dropdown là <button>, nên phải có aria-expanded (đúng nghĩa, đây là
   disclosure) và data-no-cta — nếu không initCtas() sẽ biến nó thành nút mở
   modal waitlist. Giữ cả hai để sau này ai bỏ một cái thì cái kia vẫn chặn. */

.nav-tools { position: relative; }

.nav-tools-btn {
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  font: inherit;
}

/* mũi tên chỉ xuống, xoay khi mở */
.nav-tools-btn::after {
  content: "";
  display: inline-block;
  margin-left: 0.5rem;
  border-left: 3.5px solid transparent;
  border-right: 3.5px solid transparent;
  border-top: 4px solid currentColor;
  vertical-align: 2px;
  transition: transform 0.25s ease;
}

.nav-tools-btn[aria-expanded="true"]::after { transform: rotate(180deg); }

.nav-tools-menu {
  position: absolute;
  top: calc(100% + 1.15rem);
  left: 50%;
  transform: translateX(-50%);
  z-index: 60;
  min-width: 17.5rem;
  padding: 0.5rem;
  background: rgba(10, 10, 11, 0.95);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 3px;
  box-shadow: 0 20px 60px -20px rgba(0, 0, 0, 0.7);
}

.nav-tools-menu a {
  display: block;
  padding: 0.7rem 0.85rem;
  border-radius: 2px;
  text-decoration: none;
  transition: background 0.2s ease;
}

.nav-tools-menu a:hover { background: rgba(255, 255, 255, 0.06); }

.nav-tools-name {
  display: block;
  font-size: 12px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.92);
  transition: color 0.2s ease;
}

.nav-tools-menu a:hover .nav-tools-name { color: var(--gold); }

.nav-tools-desc {
  display: block;
  margin-top: 0.35rem;
  font-size: 11.5px;
  line-height: 1.5;
  font-weight: 300;
  letter-spacing: 0;
  text-transform: none;
  color: rgba(255, 255, 255, 0.5);
}