/* =========================================================================
   labs-detail.css — trang chi tiết sản phẩm Labs dựng riêng (parts/labs/{slug}.php), chỉ nạp ở trang đó.
   Canvas "Labs detail · XD DashWP" (artboard DashWP.dc.html): giấy #F6F5F2, kẻ #D9D6CF, Lexend 300–400 cho tiêu đề,
   Inter cho chữ, nhãn 11–12px in hoa giãn .14em, không thẻ bo góc. Teal #2E6E67 = màu riêng của DashWP (cổng duyệt).
   Lớp tiền tố .ld-; biến màu đặt trên .xd-ld để không đụng token chung ở core.css.
   ========================================================================= */

/* Lexend 300–399 + Inter: cùng file font với brand.css, author.css (core.css chỉ khai Lexend 400–800) */
@font-face{font-family:"Inter";font-style:normal;font-weight:400 600;font-display:swap;
  src:url(../fonts/inter-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Inter";font-style:normal;font-weight:400 600;font-display:swap;
  src:url(../fonts/inter-vietnamese.woff2) format("woff2");
  unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Inter";font-style:normal;font-weight:400 600;font-display:swap;
  src:url(../fonts/inter-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Lexend";font-style:normal;font-weight:300 399;font-display:swap;
  src:url(../fonts/lexend-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Lexend";font-style:normal;font-weight:300 399;font-display:swap;
  src:url(../fonts/lexend-vietnamese.woff2) format("woff2");
  unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Lexend";font-style:normal;font-weight:300 399;font-display:swap;
  src:url(../fonts/lexend-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

.xd-ld{--ld-ink:#0B1220;--ld-blue:#0157FF;--ld-paper:#F6F5F2;--ld-hair:#D9D6CF;--ld-sub:#55595F;--ld-sub2:#63666B;--ld-body:#3A3D42;--ld-muted:#9AA1AD;--ld-teal:#2E6E67;--ld-tint:#EAEDEA;--ld-warn:#9A5B00;
  --ld-text:"Inter","Helvetica Neue",Arial,sans-serif;--ld-disp:"Lexend",Arial,sans-serif;--ld-pad:64px}
.ld{background:var(--ld-paper);color:var(--ld-ink);font-family:var(--ld-text);font-size:16px;line-height:1.6;font-variant-numeric:tabular-nums}
.ld *{box-sizing:border-box}
.ld [hidden]{display:none !important}
.ld a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.ld a:hover{color:var(--ld-blue)}
.ld h1,.ld h2,.ld h3{text-wrap:balance;color:inherit}
.ld p{text-wrap:pretty;margin:0;color:var(--ld-body)}
.ld :focus-visible{outline:2px solid var(--ld-blue);outline-offset:2px}
.ld-wrap{max-width:1312px;margin:0 auto;padding-left:var(--ld-pad);padding-right:var(--ld-pad)}
.ld-lb{display:block;font-size:12px;font-weight:500;letter-spacing:.14em;line-height:1.5;text-transform:uppercase;color:var(--ld-sub2)}
.ld-d{font-family:var(--ld-disp);font-weight:300;letter-spacing:-.04em;margin:0}
.ld-teal{color:var(--ld-teal)}
.ld-nw{white-space:nowrap}
.ld-xd{font-family:var(--ld-disp);font-weight:400;letter-spacing:-.02em;line-height:1;white-space:nowrap}
.ld-xd b{font-weight:500;color:var(--ld-blue)}
.ld-glyph{display:block;flex:none}
.ld-btn{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 24px;border:0;border-radius:999px;background:var(--ld-blue);color:#fff !important;font:inherit;font-weight:600;font-size:16px;text-decoration:none !important;cursor:pointer;transition:background var(--xd-fast,200ms)}
.ld-btn:hover{background:var(--ld-ink)}
.ld-tlink{min-height:44px;padding:0;border:0;background:none;font:inherit;font-size:15px;font-weight:500;color:var(--ld-ink);cursor:pointer;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.ld-tlink:hover{color:var(--ld-blue)}


/* Đầu trang */
.ld-hero{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:72px;align-items:center;padding-top:56px;padding-bottom:40px}
.ld-hero__copy{display:flex;flex-direction:column;gap:32px}
.ld-crumb{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ld-sub2)}
.ld-crumb a{text-decoration:none !important}
.ld-mark{display:inline-flex;align-items:center;gap:28px}
.ld-mark .ld-xd{font-size:28px}
.ld-hero__h{font-size:clamp(44px,5.2vw,76px);line-height:1.08;max-width:640px}
.ld-hero__lead{max-width:560px;font-size:17px;line-height:1.65}
.ld-hero__act{display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center;margin-top:8px}

/* Thông số nhanh (cột phải hero) */
.ld-sp{background:var(--ld-ink);color:#fff;display:flex;flex-direction:column}
.ld-sp__h{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 28px;border-bottom:1px solid rgba(255,255,255,.12)}
.ld-sp__t{font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ld-muted)}
.ld-sp__st{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:500;color:#BFE3DE}
.ld-sp__st i{width:8px;height:8px;border-radius:50%;background:#4FA39A;animation:ldPulse 2s ease-out infinite}
@keyframes ldPulse{0%{box-shadow:0 0 0 0 rgba(79,163,154,.6)}70%{box-shadow:0 0 0 8px rgba(79,163,154,0)}100%{box-shadow:0 0 0 0 rgba(79,163,154,0)}}
.ld-sp__k{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-bottom:1px solid rgba(255,255,255,.12)}
.ld-sp__k div{padding:20px 28px 22px;display:flex;flex-direction:column;gap:6px}
.ld-sp__k div+div{border-left:1px solid rgba(255,255,255,.12)}
.ld-sp__k b{font-family:var(--ld-disp);font-weight:300;font-size:44px;line-height:1;letter-spacing:-.04em;color:#fff}
.ld-sp__k div:first-child b{color:#7CC4BB}
.ld-sp__k span{font-size:12.5px;line-height:1.45;color:rgba(255,255,255,.7)}
.ld-sp__l{margin:0;padding:6px 28px}
.ld-sp__l div{display:grid;grid-template-columns:112px minmax(0,1fr);gap:16px;align-items:baseline;padding:14px 0;border-top:1px solid rgba(255,255,255,.1)}
.ld-sp__l div:first-child{border-top:0}
.ld-sp__l dt{font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ld-muted)}
.ld-sp__l dd{margin:0;font-size:14.5px;font-weight:500;line-height:1.5}
.ld-sp__l small{display:block;margin-top:6px;font-size:12.5px;font-weight:400;color:rgba(255,255,255,.66)}
.ld-fw{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px}
.ld-fw svg{color:rgba(255,255,255,.4)}
.ld-fw .is-g{color:#7CC4BB;box-shadow:inset 0 -2px 0 #4FA39A}
.ld-cp{display:flex;flex-wrap:wrap;gap:6px}
.ld-cp span{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;font-size:13px;font-weight:500;box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
.ld-sg{display:inline-flex;box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
.ld-sg span{display:inline-flex;align-items:center;min-height:30px;padding:0 12px;font-size:13px}
.ld-sg span+span{border-left:1px solid rgba(255,255,255,.22)}
.ld-sg span:first-child{background:#fff;color:var(--ld-ink)}
.ld-lk{display:inline-flex;align-items:center;gap:8px}
.ld-lk svg{flex:none;color:#7CC4BB}
.ld-sp__f{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 16px;padding:14px 28px;border-top:1px solid rgba(255,255,255,.12);font-size:12.5px;color:rgba(255,255,255,.66)}
.ld .ld-sp__f a{color:#fff;font-weight:500}
.ld .ld-sp__f a:hover{color:#7CC4BB}

/* Hồ sơ: mục lục dính + 5 phần */
.ld-doc{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:64px;padding-top:96px;padding-bottom:120px}
.ld-toc{position:sticky;top:24px;align-self:start}
.ld-toc ol{list-style:none;margin:12px 0 0;padding:0;border-top:1px solid var(--ld-ink)}
.ld-toc li{border-bottom:1px solid var(--ld-hair)}
.ld-toc a{display:flex;gap:16px;min-height:44px;align-items:center;font-size:14px;text-decoration:none !important;color:var(--ld-body) !important}
.ld-toc a:hover,.ld-toc a.is-on{color:var(--ld-ink) !important}
.ld-toc a span{font-size:12px;font-weight:500;letter-spacing:.14em;color:var(--ld-sub2)}
.ld-part{padding-bottom:88px;margin-bottom:88px;border-bottom:1px solid var(--ld-hair);scroll-margin-top:24px}
.ld-part:last-of-type{border-bottom:0;margin-bottom:0;padding-bottom:0}
.ld-part h2{font-size:clamp(34px,3.4vw,48px);line-height:1.12;margin:16px 0 40px}
.ld-pain{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.ld-pain>div{border-top:1px solid var(--ld-ink);padding-top:20px}
.ld-pain h3{font-family:var(--ld-disp);font-weight:400;font-size:20px;line-height:1.25;letter-spacing:-.02em;margin:14px 0 10px}
.ld-pain p{font-size:14.5px}
.ld-src{display:block;margin-top:14px;font-size:13px;color:var(--ld-sub2)}
.ld-steps{list-style:none;margin:0;padding:0}
.ld-steps li{display:grid;grid-template-columns:64px minmax(0,1fr) 168px;gap:16px;align-items:baseline;padding:22px 0;border-top:1px solid var(--ld-hair)}
.ld-steps li:last-child{border-bottom:1px solid var(--ld-hair)}
.ld-steps__n{font-size:12px;font-weight:500;letter-spacing:.14em;color:var(--ld-sub2)}
.ld-steps h3{font-family:var(--ld-disp);font-weight:400;font-size:21px;line-height:1.3;letter-spacing:-.02em;margin:0 0 6px}
.ld-steps p{font-size:15px}
.ld-steps__who{font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ld-sub2);text-align:right}
.ld-steps__who.is-ai{color:var(--ld-teal)}
.ld-steps li.is-gate{background:var(--ld-tint);box-shadow:inset 2px 0 0 var(--ld-teal);padding-left:20px;padding-right:20px;grid-template-columns:44px minmax(0,1fr) 148px}
.ld-steps li.is-gate .ld-steps__n{color:var(--ld-teal)}
.ld-steps li.is-gate+li.is-gate{border-top-color:rgba(46,110,103,.25)}
.ld-steps__gl{grid-column:1/-1;display:flex;align-items:center;gap:12px;margin-bottom:2px;font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ld-teal)}
.ld-steps__gl::after{content:"";flex:1;height:1px;background:rgba(46,110,103,.35)}

/* Sơ đồ một cụm bài */
.ld-fl{margin:56px 0 0;background:#fff;border:1px solid var(--ld-hair)}
.ld-fl__h{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:16px 24px;border-bottom:1px solid var(--ld-hair)}
.ld-fl__h b{font-family:var(--ld-disp);font-weight:400;font-size:19px;letter-spacing:-.02em}
.ld-fl__g{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;padding:28px 24px 24px}
.ld-nd{position:relative;display:flex;flex-direction:column;gap:12px;padding:16px;border:1px solid var(--ld-hair);background:var(--ld-paper)}
.ld-nd:not(:last-child)::after{content:"";position:absolute;right:-24px;top:34px;width:20px;height:2px;background:var(--ld-ink)}
.ld-nd:not(:last-child)::before{content:"";position:absolute;right:-26px;top:30px;border:5px solid transparent;border-left:7px solid var(--ld-ink)}
.ld-nd__t{display:flex;flex-direction:column-reverse;gap:4px}
.ld-nd__t b{font-family:var(--ld-disp);font-weight:400;font-size:16px;letter-spacing:-.015em}
.ld-nd__t span{font-size:11.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--ld-sub2)}
.ld-nd.is-gate{background:var(--ld-tint);border-color:var(--ld-teal);box-shadow:inset 3px 0 0 var(--ld-teal)}
.ld-nd.is-gate .ld-nd__t span{color:var(--ld-teal)}
.ld-nd__dom.ld-lb{font-size:11px}
.ld-mt{display:flex;flex-direction:column;gap:6px}
.ld-mt__bar{height:8px;background:#E4E2DB;position:relative}
.ld-mt__bar i{position:absolute;left:0;top:0;bottom:0;background:var(--ld-teal)}
.ld-mt__v{display:flex;justify-content:space-between;align-items:baseline;font-size:12.5px;color:var(--ld-body)}
.ld-mt__v b{font-family:var(--ld-disp);font-weight:400;font-size:22px;letter-spacing:-.02em;color:var(--ld-ink)}
.ld-ls{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;font-size:12.5px;line-height:1.45;color:var(--ld-body)}
.ld-ls li{display:grid;grid-template-columns:16px minmax(0,1fr);gap:6px}
.ld-k{font-weight:600;color:var(--ld-sub2)}
.ld-k.is-ok{color:var(--ld-teal)}
.ld-k.is-w{color:var(--ld-warn)}
.ld-tr{display:flex;flex-direction:column;gap:5px;font-size:12.5px}
.ld-tr__p{padding:7px 10px;background:var(--ld-ink);color:#fff;font-weight:500}
.ld-tr__c{margin-left:14px;padding:6px 10px;background:#fff;border:1px solid var(--ld-hair);color:var(--ld-body)}
.ld-tr__c.is-du{color:var(--ld-sub2)}
.ld-st{display:flex;flex-direction:column;gap:6px;font-size:12.5px}
.ld-st div{display:flex;justify-content:space-between;gap:8px;padding:7px 10px;background:#fff;border:1px solid var(--ld-hair)}
.ld-st b{font-weight:500;color:var(--ld-ink);min-width:0}
.ld-st em{flex:none;font-style:normal;font-weight:500;color:var(--ld-teal);white-space:nowrap}
.ld-st em.is-h{color:var(--ld-blue)}
.ld-st em.is-d{color:var(--ld-sub2)}
.ld-fl__f{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;padding:12px 24px;border-top:1px solid var(--ld-hair);font-size:12.5px;color:var(--ld-sub2)}

/* Phạm vi, thông số, người xây */
.ld-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.ld-cols h3.ld-lb{margin:0}
.ld-cols ul{list-style:none;margin:14px 0 0;padding:0;border-top:1px solid var(--ld-ink)}
.ld-cols li{padding:12px 0;border-bottom:1px solid var(--ld-hair);font-size:15px;color:var(--ld-body)}
.ld-sy{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;margin-right:8px;border-radius:50%;font-size:11px;letter-spacing:0;vertical-align:-5px}
.ld-sy.is-y{background:var(--ld-teal);color:#fff}
.ld-sy.is-p{box-shadow:inset 0 0 0 1.5px var(--ld-sub2);background:linear-gradient(90deg,var(--ld-sub2) 50%,transparent 50%)}
.ld-sy.is-n{box-shadow:inset 0 0 0 1.5px var(--ld-sub2);color:var(--ld-sub2)}
.ld-tb{width:100%;border-collapse:collapse}
.ld-tb th,.ld-tb td{padding:18px 24px 18px 0;border-top:1px solid var(--ld-hair);vertical-align:top;font-size:15px;text-align:left}
.ld-tb td{color:var(--ld-body)}
.ld-tb th{font-weight:500;color:var(--ld-ink);width:30%}
.ld-tb tr:first-child>*{border-top:1px solid var(--ld-ink)}
.ld-tb tr:last-child>*{border-bottom:1px solid var(--ld-hair)}
.ld-who{display:grid;grid-template-columns:168px minmax(0,1fr);gap:40px;align-items:start}
.ld-who__img{display:block;width:168px;height:168px;border-radius:50%;object-fit:cover;background:#fff}
.ld-who__copy{display:flex;flex-direction:column;gap:16px;max-width:720px}
.ld .ld-who__n{color:var(--ld-ink)}
.ld-who__n a{text-decoration:none !important}
.ld-who__n b{font-family:var(--ld-disp);font-weight:400;font-size:21px;letter-spacing:-.02em}

/* Câu hỏi chủ doanh nghiệp, dành cho ai: dùng lưới .ld-pain */
.ld-pain.is-4{grid-template-columns:repeat(4,minmax(0,1fr));gap:28px}
.ld-pain.is-4 h3{margin-top:0}
.ld-pain>div>h3:first-child{margin-top:0}
.ld-dot{list-style:none;margin:0;padding:0}
.ld-dot li{position:relative;padding:10px 0 10px 16px;border-top:1px solid var(--ld-hair);font-size:14.5px;line-height:1.55;color:var(--ld-body)}
.ld-dot li::before{content:"";position:absolute;left:0;top:19px;width:6px;height:6px;background:var(--ld-teal)}

/* Báo cáo tháng */
.ld-rp{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:48px;align-items:start}
.ld-rp__copy{display:flex;flex-direction:column;gap:28px}
.ld-rp__copy>p{font-size:16px}
.ld-rule{padding:20px 22px;background:var(--ld-tint);box-shadow:inset 2px 0 0 var(--ld-teal)}
.ld-rule .ld-lb{color:var(--ld-teal)}
.ld-rule ul{list-style:none;margin:10px 0 0;padding:0}
.ld-rule li{padding:10px 0;border-top:1px solid rgba(46,110,103,.2);font-size:14.5px;line-height:1.55;color:var(--ld-body)}
.ld-rule li:first-child{border-top:0}
.ld-rule b{font-weight:600;color:var(--ld-ink)}
.ld-pg{list-style:none;margin:0;padding:0;border-top:1px solid var(--ld-ink)}
.ld-pg li{display:grid;grid-template-columns:48px minmax(0,1fr);gap:12px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--ld-hair);font-size:15px;color:var(--ld-body)}
.ld-pg b{font-family:var(--ld-disp);font-weight:400;font-size:18px;letter-spacing:-.02em;color:var(--ld-ink)}

/* Cách chứng minh */
.ld-pf{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px}
.ld-pf>div{display:flex;flex-direction:column;gap:10px;padding:22px 0 26px;border-top:1px solid var(--ld-hair)}
.ld-pf>div:nth-child(-n+2){border-top-color:var(--ld-ink)}
.ld-pf h3{font-family:var(--ld-disp);font-weight:400;font-size:20px;line-height:1.3;letter-spacing:-.02em;margin:0}
.ld-pf p{font-size:15px}
.ld-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.ld-chips span{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;font-size:12.5px;font-weight:500;color:var(--ld-teal);box-shadow:inset 0 0 0 1px rgba(46,110,103,.45)}
.ld-chips span.is-w{color:var(--ld-warn);box-shadow:inset 0 0 0 1px rgba(154,91,0,.45)}

/* Chi phí AI */
.ld-ct{overflow-x:auto}
.ld-ct .ld-tb{min-width:560px}
.ld-ct thead th{font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ld-sub2);padding-bottom:12px;border-top:0}
.ld-ct tbody tr:first-child>*{border-top:1px solid var(--ld-ink)}
.ld-ct th[scope=row]{width:22%}
.ld-ct .is-r{text-align:right;padding-left:24px;white-space:nowrap}
.ld-ct tr>.is-r:last-child{padding-right:0}
.ld-ct td.is-r{color:var(--ld-ink);font-weight:500}
.ld-ct th small{display:none}
.ld .ld-note{margin-top:16px;max-width:760px;font-size:13px;color:var(--ld-sub2)}

/* Hỏi đáp */
.ld-faq__h.ld-lb{margin:56px 0 0}
.ld-faq{margin-top:12px;border-top:1px solid var(--ld-ink)}
.ld-faq details{border-bottom:1px solid var(--ld-hair)}
.ld-faq summary{display:flex;justify-content:space-between;gap:16px;align-items:center;min-height:56px;padding:12px 0;cursor:pointer;list-style:none;font-family:var(--ld-disp);font-weight:400;font-size:18px;letter-spacing:-.015em}
.ld-faq summary::-webkit-details-marker{display:none}
.ld-faq summary::after{content:"+";flex:none;font-family:var(--ld-text);font-size:20px;font-weight:300;color:var(--ld-sub2)}
.ld-faq details[open] summary::after{content:"−"}
.ld-faq details p{max-width:760px;padding:0 0 20px;font-size:15px}

/* Chuyển sản phẩm */
.ld-pnv{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:24px;align-items:center;padding-top:40px;padding-bottom:40px;border-top:1px solid var(--ld-ink)}
.ld-pnv a{text-decoration:none !important}
.ld-pnv__pv,.ld-pnv__nx{display:flex;flex-direction:column;gap:10px}
.ld-pnv__nx{align-items:flex-end;text-align:right}
.ld-pnv__all{font-size:14.5px;font-weight:500;text-decoration:underline !important}
.ld-pnv__n{display:inline-flex;align-items:center;gap:12px}
.ld-pnv__n b{font-family:var(--ld-disp);font-weight:300;font-size:26px;letter-spacing:-.03em;line-height:1.1}
.ld-pnv a:hover b{color:var(--ld-blue)}

/* CTA cuối: nền lưới xanh (DESIGN.md: chỉ hero và CTA cuối) */
.ld-cta{background-color:var(--ld-blue);color:#fff;background-image:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px);background-size:40px 40px;background-position:-1px -1px}
.ld-cta__in{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:64px;align-items:end;padding-top:120px;padding-bottom:120px}
.ld-cta__copy{display:flex;flex-direction:column;gap:24px}
.ld-cta .ld-lb{color:rgba(255,255,255,.85)}
.ld-cta h2{font-size:clamp(44px,5.6vw,80px);line-height:1.06;color:#fff}
.ld-cta__form{display:flex;flex-direction:column;gap:20px;align-items:flex-start;width:100%}
.ld .ld-cta__form>p{color:rgba(255,255,255,.92);font-size:15px}
.ld-cta .ld-btn{background:#fff;color:var(--ld-ink) !important}
.ld-cta .ld-btn:hover{background:var(--ld-ink);color:#fff !important}
.ld-cta :focus-visible{outline-color:#fff}
.ld-ef{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 16px;width:100%}
.ld-ef label{display:flex;flex-direction:column;gap:6px;font-size:12.5px;font-weight:500;color:rgba(255,255,255,.92)}
.ld-ef input:not([type=checkbox]){height:48px;border:0;border-radius:0;padding:0 14px;background:#fff;color:var(--ld-ink);font:inherit;font-size:15px}
.ld-ef input::placeholder{color:#6B717C}
.ld-ef .ld-ef__ag{grid-column:1/-1;flex-direction:row;align-items:flex-start;gap:10px;font-weight:400;line-height:1.5}
.ld-ef__ag input{flex:none;width:18px;height:18px;margin:2px 0 0;accent-color:var(--ld-ink)}
.ld-ef .ld-btn{grid-column:1/-1;justify-self:start}
.ld-ef .ld-btn[disabled]{opacity:.7;cursor:progress}
.ld .ld-ef__err{grid-column:1/-1;padding:10px 14px;background:#fff;color:#B42318;font-size:14px;font-weight:500}
.ld-hp{position:absolute !important;left:-9999px;width:1px;height:1px;opacity:0}
.ld-ef__ok{display:flex;flex-direction:column;gap:8px;padding:22px 24px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.5)}
.ld-ef__ok b{font-family:var(--ld-disp);font-weight:400;font-size:24px;letter-spacing:-.02em}
.ld-ef__ok span{font-size:15px;color:rgba(255,255,255,.92)}
.ld-ef__ok:focus{outline:none}


/* Video giới thiệu trong hộp thoại */
.ld-vd{width:min(960px,calc(100vw - 32px));padding:0;border:0;background:#000;overflow:visible}
.ld-vd::backdrop{background:rgba(11,18,32,.82)}
.ld-vd__box{aspect-ratio:16/9}
.ld-vd__box iframe{display:block;width:100%;height:100%;border:0}
.ld-vd__x{position:absolute;right:0;top:-52px;width:44px;height:44px;border:0;border-radius:50%;background:#fff;color:#0B1220;font-size:18px;cursor:pointer}

/* Logo ngang = icon + "XD Tên" (parts/labs/marks.php; khoảng cách, cỡ chữ đặt inline theo cạnh icon) */
.xd-lab-logo{display:inline-flex;align-items:center;font-family:var(--ld-disp,"Lexend"),Arial,sans-serif;font-weight:400;letter-spacing:-.02em;line-height:1;white-space:nowrap}
.xd-lab-logo svg,.xd-lab-icon{display:block;flex:none}

/* XD Tick: trạng thái "Đang phát triển" (chấm hổ phách, không nhấp nháy), ảnh màn hình thật, 15 game, tiện ích hội viên */
.ld-sp__st.is-dev{color:#F2D3A2}
.ld-sp__st.is-dev i{background:#E0A045;animation:none}
.ld-shots{scroll-margin-top:24px}
.ld-shots__h{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 24px;padding-bottom:14px;border-bottom:1px solid var(--ld-ink)}
.ld-shots__h h2{margin:0}
.ld-shots__h span{font-size:13px;color:var(--ld-sub2)}
.ld-shots__g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.9fr) minmax(0,1.9fr);gap:24px;margin-top:24px;align-items:start}
.ld-shots figure,.ld-gshots figure{margin:0;display:flex;flex-direction:column;gap:12px}
.ld-shots img,.ld-gshots img,.ld-admin img{display:block;width:100%;height:auto;background:#fff;border:1px solid var(--ld-hair)}
.ld-shots .is-p img,.ld-gshots img{border-radius:18px}
.ld-shots figcaption{font-size:14px;line-height:1.5;color:var(--ld-body)}
.ld-shots figcaption .ld-lb{margin-bottom:4px}
.ld-cols.is-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.ld-shots__g.is-dd{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px}
.ld-admin__g.is-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.ld-stt{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:500;white-space:nowrap}
.ld-stt::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ld-teal)}
.ld-stt.is-w{color:var(--ld-warn)}.ld-stt.is-w::before{background:#E0A045}
.ld-stt.is-s{color:var(--ld-sub2)}.ld-stt.is-s::before{background:transparent;border:1.5px solid var(--ld-muted)}
.ld-feat td{width:1%}
.ld-gshots{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:14px;margin-bottom:32px}
.ld-gshots figcaption{font-size:12.5px;line-height:1.35;color:var(--ld-sub2);text-align:center}
.ld-admin{margin:48px 0 0;background:#fff;border:1px solid var(--ld-hair)}
.ld-admin__g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;padding:24px}
.ld-admin__g p{margin:10px 0 0;font-size:13.5px;line-height:1.5}
.ld-admin__g .ld-lb{font-size:11px;margin-bottom:2px}
.ld-games{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:32px;border-top:1px solid var(--ld-ink)}
.ld-games li{display:grid;grid-template-columns:32px minmax(0,1fr);gap:10px;padding:16px 0;border-bottom:1px solid var(--ld-hair)}
.ld-games b{display:block;font-family:var(--ld-disp);font-weight:400;font-size:17px;letter-spacing:-.02em;line-height:1.3}
.ld-games p{font-size:14px;line-height:1.5;margin-top:3px}
.ld-tags{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.ld-tags li{padding:8px 14px;border:1px solid var(--ld-hair);background:#fff;font-size:14.5px}

/* Video demo tự host ngay dưới đầu trang: trình phát 8 cột, mô tả + chương 4 cột, khung như sơ đồ .ld-fl */
.ld-film{scroll-margin-top:24px}
.ld-film__fig{margin:0}
.ld-film__fig h2{margin:0;font-size:inherit;line-height:1.3}
.ld-film__g{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr)}
.ld-film__v{display:block;width:100%;height:auto;aspect-ratio:16/9;background:var(--ld-tint);align-self:start}
.ld-film__side{padding:20px 24px;border-left:1px solid var(--ld-hair)}
.ld-film__hd{display:flex;flex-direction:column;gap:6px;max-width:760px}
.ld-film__hd p{font-size:14.5px;line-height:1.55}
.ld-film__ch{list-style:none;margin:0;padding:0;border-top:1px solid var(--ld-ink)}
.ld-film__ch li{border-bottom:1px solid var(--ld-hair)}
.ld-film__ch a{display:flex;gap:14px;align-items:baseline;min-height:44px;padding:10px 0;font-size:14px;line-height:1.45;text-decoration:none !important;color:var(--ld-body) !important}
.ld-film__ch a:hover{color:var(--ld-blue) !important}
.ld-film__ch span{flex:none;width:34px;font-size:12px;font-weight:500;letter-spacing:.08em;color:var(--ld-sub2)}

@media (max-width:1100px){
  .ld-games{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ld-film__g{grid-template-columns:minmax(0,1fr)}
  .ld-film__side{border-left:0;border-top:1px solid var(--ld-hair)}
  .ld-fl__g{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ld-pain.is-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ld-nd:nth-child(2n)::after,.ld-nd:nth-child(2n)::before{display:none}
}
@media (max-width:900px){
  .ld-shots__g{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .ld-shots .is-d{grid-column:1/-1}
  .ld-shots__g.is-dd{grid-template-columns:minmax(0,1fr)}
  .ld-cols.is-2{grid-template-columns:minmax(0,1fr)}
  .ld-stt{white-space:normal}
  .ld-gshots{display:flex;overflow-x:auto;gap:12px;padding-bottom:8px}
  .ld-gshots figure{flex:0 0 132px}
  .ld-admin__g{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;padding:16px}
  .ld-games{grid-template-columns:minmax(0,1fr)}
  .xd-ld{--ld-pad:20px}
  .ld-hero,.ld-doc,.ld-pain,.ld-pain.is-4,.ld-cols,.ld-rp,.ld-pf,.ld-cta__in{grid-template-columns:minmax(0,1fr);gap:48px}
  .ld-pf{gap:0}
  .ld-pf>div:nth-child(2){border-top-color:var(--ld-hair)}
  .ld-hero{padding-top:40px;padding-bottom:64px}
  .ld-sp__h,.ld-sp__l,.ld-sp__f{padding-left:20px;padding-right:20px}
  .ld-sp__k div{padding:16px 14px}
  .ld-sp__k b{font-size:34px}
  .ld-sp__l div{grid-template-columns:minmax(0,1fr);gap:6px}
  .ld-doc{padding-top:56px;padding-bottom:88px}
  .ld-toc{display:none}
  .ld-part{padding-bottom:64px;margin-bottom:64px}
      .ld-steps li,.ld-steps li.is-gate{grid-template-columns:44px minmax(0,1fr);row-gap:6px}
  .ld-steps li.is-gate{padding-left:14px;padding-right:14px;grid-template-columns:36px minmax(0,1fr)}
  .ld-steps__who{grid-column:2;text-align:left}
  .ld-fl__g{grid-template-columns:minmax(0,1fr);padding:20px 16px}
  .ld-nd:not(:last-child)::after,.ld-nd:nth-child(2n):not(:last-child)::after{display:block;right:auto;left:32px;top:auto;bottom:-24px;width:2px;height:20px}
  .ld-nd:not(:last-child)::before,.ld-nd:nth-child(2n):not(:last-child)::before{display:block;right:auto;left:28px;top:auto;bottom:-27px;border:5px solid transparent;border-top:7px solid var(--ld-ink)}
  .ld-fl__h,.ld-fl__f{padding-left:16px;padding-right:16px}
  .ld-film__side{padding:20px 16px}
  .ld-tb th,.ld-tb td{display:block;width:auto;padding:4px 0 14px;border-top:0}
  .ld-tb th{padding-top:16px;border-top:1px solid var(--ld-hair)}
  .ld-tb tr:first-child th{border-top:1px solid var(--ld-ink)}
  .ld-tb tr:last-child>*{border-bottom:0}
  .ld-tb tr:last-child td{border-bottom:1px solid var(--ld-hair)}
  .ld-ct .ld-tb th,.ld-ct .ld-tb td{display:table-cell;padding:14px 16px 14px 0;border-top:1px solid var(--ld-hair);border-bottom:0}
  .ld-ct .ld-tb thead th{border-top:0}
  .ld-ct .ld-tb tbody tr:first-child>*{border-top:1px solid var(--ld-ink)}
  .ld-ct .ld-tb tr:last-child>*{border-bottom:1px solid var(--ld-hair)}
  .ld-who{grid-template-columns:minmax(0,1fr);gap:24px}
  .ld-pnv{grid-template-columns:minmax(0,1fr)}
  .ld-pnv__nx{align-items:flex-start;text-align:left}
  .ld-pnv__nx .ld-pnv__n{flex-direction:row-reverse}
  .ld-cta__in{padding-top:80px;padding-bottom:80px}
  .ld-ef{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  .ld-ct .ld-tb{min-width:0}
  .ld-ct .ld-tb tr>:nth-child(2){display:none}
  .ld-ct th small{display:block;margin-top:4px;font-size:13px;font-weight:400;line-height:1.45;color:var(--ld-sub2)}
  .ld-ct th[scope=row]{width:auto}
}
@media (prefers-reduced-motion:reduce){
  .ld-btn{transition:none}
  .ld-sp__st i{animation:none}
}
