/* Trang /huong-dan + hướng dẫn nhanh lần đầu (B-135, KQ-20261030-002). */
.hd-page{max-width:980px;margin:0 auto;padding:12px 16px 40px;color:var(--ink);font-size:15px;line-height:1.6}
.hd-page h1{font:600 22px/1.3 var(--f-ui);margin:8px 0 8px}
.hd-lead{margin:0 0 12px;color:var(--ink-2)}
.hd-tour-btn{min-height:44px;padding:0 16px}
.hd-toc{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0 8px}
.hd-toc a{display:inline-flex;align-items:center;min-height:36px;padding:4px 12px;border:1px solid var(--rule);border-radius:999px;background:var(--sheet);color:var(--ink-2);text-decoration:none;font-size:13.5px}
.hd-toc a:hover{border-color:var(--accent);color:var(--accent)}
.hd-sec{padding-top:20px;margin-top:12px;border-top:1px solid var(--rule-2);scroll-margin-top:calc(var(--top-h, 120px) + 64px)}
.hd-sec h2{font:600 18px/1.35 var(--f-ui);margin:0 0 10px}
.hd-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
.hd-steps{margin:0;padding-left:22px;display:grid;gap:8px}
.hd-steps li{padding-left:2px}
.hd-figs{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:4px;-webkit-overflow-scrolling:touch}
.hd-fig{margin:0;flex:0 0 auto;width:min(260px,72vw);scroll-snap-align:start}
.hd-fig img{display:block;width:100%;height:auto;border:1px solid var(--rule);border-radius:14px;background:var(--sheet);box-shadow:var(--shadow)}
.hd-go{display:inline-flex;align-items:center;min-height:44px;color:var(--accent);font-weight:600}
.hd-faq{border:1px solid var(--rule-2);border-radius:10px;background:var(--sheet);margin:0 0 8px}
.hd-faq summary{cursor:pointer;min-height:44px;display:flex;align-items:center;padding:8px 14px;font-weight:600;list-style-position:inside}
.hd-faq p{margin:0;padding:0 14px 12px;color:var(--ink-2)}
.hd-faq a,.hd-steps a{color:var(--accent)}
@media (min-width:760px){
  .hd-grid{grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:24px}
  .hd-figs{overflow:visible}
  .hd-fig{width:220px}
}

/* Hướng dẫn nhanh: khoét sáng phần tử đang chỉ, thẻ chú thích bên cạnh. */
.ht{position:fixed;inset:0;z-index:80}
.ht-hole{position:fixed;border-radius:12px;box-shadow:0 0 0 9999px rgba(8,18,15,.62);transition:all .2s;pointer-events:none}
.ht-card{position:fixed;background:var(--sheet);color:var(--ink);border-radius:14px;box-shadow:var(--shadow);padding:14px 16px 12px}
.ht-top{display:flex;align-items:center;justify-content:space-between;font-size:12.5px;color:var(--ink-3)}
.ht-top .link-btn{min-height:40px;padding:0 4px}
.ht-card h2{margin:2px 0 4px;font:600 16px/1.3 var(--f-ui)}
.ht-card p{margin:0 0 10px;font-size:14px;line-height:1.5;color:var(--ink-2)}
.ht-acts{display:flex;justify-content:flex-end}
.ht-acts .btn-primary{min-height:44px;padding:0 20px}