/**
 * Trang /tai-xuong-grade-engine (05/10/2026) — chọn phần mềm rồi tải bộ cài Mac / Windows.
 *
 * Nạp SAU css/huong-dan-kich-hoat.css: dùng lại nav, hero tối, thẻ chọn phần mềm
 * (.sw-picker / .sw-card), .block, .btn, .step-num của trang hướng dẫn để hai trang
 * anh em cùng một tông. File này chỉ thêm phần riêng của trang tải.
 * Markup dựng ở js/tai-xuong-content.js (renderPicker / renderPanels / renderNext).
 */

/* Phần mềm chưa có bộ cài nào: vẫn bấm được để xem thẻ "Sắp phát hành", chữ nhỏ mờ hơn. */
.sw-card.is-pending .sw-meta{color:#6f6c67}

/* ---- Hai thẻ Mac / Windows ngay dưới thẻ chọn phần mềm (vẫn trên nền tối) ---- */
.tx-panels{margin-top:clamp(36px,4.4vw,56px)}
.tx-panel{scroll-margin-top:100px}
.tx-panel[hidden]{display:none}
/* .hero .tx-panel-title (0,2,0) thắng .hero h1/.hero p của file chung — không cần !important. */
.hero .tx-panel-title{margin:0 0 22px;text-align:center;color:#fff;font-size:clamp(22px,2.4vw,30px);line-height:1.15;letter-spacing:-.03em;text-wrap:balance}
.tx-os-grid{display:grid;grid-template-columns:repeat(2,minmax(0,420px));justify-content:center;gap:20px}
.tx-os-grid.is-single{grid-template-columns:minmax(0,420px)}
.tx-os-card{display:flex;flex-direction:column;gap:20px;min-width:0;padding:28px;border:1px solid rgba(255,255,255,.16);border-radius:16px;background:linear-gradient(180deg,#161616,#0d0d0d);color:#fff}
.tx-os-head{display:flex;align-items:center;gap:16px}
.tx-os-icon{flex:0 0 auto;width:52px;height:52px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.16);border-radius:50%;background:rgba(255,255,255,.04);color:#fff}
.hero .tx-os-label{margin:0 0 4px;max-width:none;color:#8d8a85;font-size:10px;font-weight:700;line-height:1.4;letter-spacing:.2em;text-transform:uppercase}
.tx-os-head h3{margin:0;font-size:clamp(20px,1.8vw,24px);line-height:1.15;letter-spacing:-.03em}

/* Thông số: mỗi dòng một vạch kẻ, nhãn trái — giá trị phải. */
.tx-specs{margin:0;display:grid}
.tx-specs div{display:grid;grid-template-columns:92px minmax(0,1fr);gap:12px;padding:11px 0;border-top:1px solid rgba(255,255,255,.1)}
.tx-specs div:last-child{border-bottom:1px solid rgba(255,255,255,.1)}
.tx-specs dt{color:#8d8a85;font-size:10px;font-weight:700;line-height:1.9;letter-spacing:.14em;text-transform:uppercase}
.tx-specs dd{margin:0;color:#d9d6cf;font-size:14px;line-height:1.6;min-width:0;overflow-wrap:anywhere}
.hero .tx-soon-note{margin:0;max-width:none;color:#8d8a85;font-size:14px;line-height:1.6}

/* Nút tải: đỏ thương hiệu + quầng sáng đứng yên (chỉ nút ở hero trang plugin mới nhịp). */
.tx-dl-btn{margin-top:auto;display:flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 24px;border-radius:999px;background:var(--red);color:#fff;font-size:14px;font-weight:700;letter-spacing:.01em;box-shadow:0 0 0 1px rgba(255,92,98,.55),0 0 20px rgba(216,24,32,.55),0 0 46px rgba(216,24,32,.3);transition:background-color .22s ease,box-shadow .22s ease;-webkit-tap-highlight-color:transparent}
.tx-dl-btn .tx-icon{flex:0 0 auto}
a.tx-dl-btn:hover{background:#ed1b24;box-shadow:0 0 0 1px rgba(255,128,132,.7),0 0 26px rgba(237,27,36,.75),0 0 64px rgba(237,27,36,.42)}
a.tx-dl-btn:focus-visible{outline:3px solid #fff;outline-offset:4px}
.tx-dl-btn.is-soon{background:rgba(255,255,255,.07);color:#8d8a85;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);cursor:not-allowed}
.tx-guide-link{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;margin-top:-8px;color:#cfccc5;font-size:13px;font-weight:700;transition:color .2s}
.tx-guide-link:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}

.hero .tx-note{max-width:62ch;margin:28px auto 0;text-align:center;color:#8d8a85;font-size:13.5px;line-height:1.7}

/* ---- Ba bước sau khi tải (nền kem) ---- */
.tx-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:8px 0 0;padding:0;list-style:none}
.tx-step{display:flex;gap:14px;align-items:flex-start;padding:22px 20px;border:1px solid var(--line);background:#f4f2ec}
.tx-step h3{margin:6px 0 8px;font-size:18px;letter-spacing:-.01em}
.tx-step p{margin:0;font-size:15px;line-height:1.7;color:#3a3733}
/* Ba bước rộng hơn khung chữ 80ch của .block. */
.block.tx-next{max-width:none}

@media(max-width:900px){
  .tx-steps{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:640px){
  .tx-os-grid,.tx-os-grid.is-single{grid-template-columns:minmax(0,1fr)}
  .tx-os-card{padding:22px 18px;gap:18px}
  .tx-specs div{grid-template-columns:84px minmax(0,1fr)}
}
@media(prefers-reduced-motion:reduce){
  .tx-dl-btn,.tx-guide-link{transition:none}
}