/* Trang có tiêu đề .lh: khung rộng như trang chủ (khung cũ 1080px để hai bên trống nhiều) */
body:has(.lh) .wrap{max-width:1240px}

/* Tiêu đề đầu trang dùng chung cho các hộp (theo phong cách trang 博雅汉语, cô duyệt 29/09/2026).
   Dùng: <section class="lh" style="--c:var(--teal);--c2:var(--coral);--cs:var(--teal-s)"> … </section>
   Cần các biến màu của trang (--ink, --muted, --card, --shadow, --hz, --vi …) — có sẵn trong tro-choi/game.css. */
.lh{--c:var(--coral);--c2:var(--sky);--cs:var(--coral-s);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:32px;align-items:center;
  margin-top:20px;padding:40px clamp(16px,3vw,36px) 34px;border-radius:28px;
  background:radial-gradient(circle at 8% 12%,var(--cs) 0,transparent 38%),radial-gradient(circle at 92% 20%,color-mix(in srgb,var(--c2) 12%,transparent) 0,transparent 34%)}
.lh-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#B8925F}
.lh-eyebrow::before{content:"";width:26px;height:10px;background:rgba(217,185,140,.72);border-radius:2px;transform:rotate(-4deg)}
.lh h1{font-size:clamp(32px,4.4vw,56px);text-wrap:balance;line-height:1.04;font-weight:800;letter-spacing:-.02em;margin:14px 0 0}
.lh h1 .lh-big{display:block;font-family:var(--hz);font-weight:400;letter-spacing:.02em;font-size:clamp(64px,9vw,120px);line-height:1;margin:0 0 12px}
.lh h1 .lh-big i{font-style:normal;color:var(--c)} .lh h1 .lh-big u{text-decoration:none;color:var(--c2)}
.lh-lead{font-size:18px;color:var(--muted);max-width:34em;margin:18px 0 0}
.lh-lead b{color:var(--ink)}
.lh-acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.lh-btn{display:inline-flex;align-items:center;gap:8px;font:700 15px var(--vi);padding:12px 20px;border-radius:14px;text-decoration:none;border:0;cursor:pointer}
.lh-btn.pri{background:var(--ink);color:var(--ground)} .lh-btn.sec{background:var(--card);color:var(--ink);box-shadow:var(--shadow)}
.lh-stats{display:flex;gap:22px;flex-wrap:wrap;margin-top:28px;font-size:13px;color:var(--muted)}
.lh-stats b{display:block;font-size:26px;color:var(--ink);font-variant-numeric:tabular-nums;line-height:1.1}
.lh-art{position:relative;justify-self:center;width:min(440px,100%);aspect-ratio:400/420}
.lh-art svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 18px 30px color-mix(in srgb,var(--c) 22%,transparent));color:var(--ink)}
.lh-pop{position:absolute;font-family:var(--hz);font-size:clamp(16px,2vw,22px);background:var(--card);color:var(--c);padding:6px 14px;border-radius:16px;box-shadow:0 6px 16px rgba(43,46,69,.12);white-space:nowrap}
.lh-pop.py{font-family:var(--vi);font-weight:800;font-size:clamp(14px,1.7vw,18px)}
.lh-pop.a{left:-4%;top:10%;transform:rotate(-6deg)} .lh-pop.b{right:-6%;top:4%;transform:rotate(5deg);color:var(--c2)}
.lh-pop.c{left:-8%;bottom:24%;transform:rotate(-3deg);color:var(--mint)} .lh-pop.d{right:-8%;bottom:10%;transform:rotate(4deg)}
@media (prefers-reduced-motion:no-preference){.lh-pop{animation:lhfloat 5s ease-in-out infinite}.lh-pop.b{animation-delay:.8s}.lh-pop.c{animation-delay:1.6s}.lh-pop.d{animation-delay:2.4s}}
@keyframes lhfloat{50%{translate:0 -8px}}
@media (max-width:860px){.lh{grid-template-columns:1fr;padding-block:28px 24px}.lh-art{width:min(320px,86%)}}
@media (max-width:420px){.lh-pop.a,.lh-pop.c{left:0}.lh-pop.b,.lh-pop.d{right:0}.lh-stats{gap:16px}}