/* /bai-viet-chi-tiet.html — article page (scoped to .p-post) */

/* reading progress */
.p-post .cx-progress{ position:fixed; z-index:1300; left:0; right:0; top:0; height:3px; pointer-events:none; }
.p-post .cx-progress span{ display:block; height:100%; background:linear-gradient(90deg, var(--ta-sun), var(--ta-red)); transform:scaleX(0); transform-origin:0 50%; transition:transform .1s linear; }

/* header band */
.p-post .cx-posthead .ta-pagehead__title{ max-width:30ch; }
.p-post .cx-posthead .ta-pagehead__kicker a{ color:inherit; text-decoration:underline; text-decoration-color:rgba(253,230,138,.5); text-underline-offset:3px; }
.p-post .cx-posthead .ta-crumbs [aria-current]{ max-width:42vw; }
.p-post .cx-postmeta{ display:flex; flex-wrap:wrap; gap:8px 18px; font-size:13.5px; color:rgba(255,246,225,.92); }
.p-post .cx-postmeta > span{ display:inline-flex; align-items:center; gap:6px; }
.p-post .cx-postmeta .ta-ico{ width:15px; height:15px; color:#FDE68A; }
.p-post .cx-postmeta .ta-skel{ background:rgba(255,255,255,.2); }

/* layout */
.p-post .cx-postlayout{ margin-top:-14px; position:relative; z-index:1; }
@media (min-width:1024px){ .p-post .cx-postlayout{ grid-template-columns:minmax(0,1fr) 320px; margin-top:-26px; } }
.p-post .cx-article{ min-width:0; background:#fff; border:1px solid #EFE6DC; border-radius:24px; box-shadow:0 16px 40px rgba(60,20,10,.08); padding:14px 14px 22px; }
@media (min-width:768px){ .p-post .cx-article{ padding:20px 34px 32px; } }
.p-post .cx-article--skel{ max-width:860px; margin:0 auto; }
.p-post .cx-article__cover{ margin:0 0 18px; border-radius:18px; overflow:hidden; }
@media (min-width:768px){ .p-post .cx-article__cover{ margin:0 -14px 22px; } }
.p-post .cx-article__cover img{ width:100%; aspect-ratio:16/9; object-fit:cover; }
.p-post .cx-article__lead{ font-size:17px; line-height:1.65; font-weight:600; color:var(--ta-text); padding-left:14px; border-left:4px solid var(--ta-red); margin-bottom:18px; }
.p-post .cx-article__body{ max-width:none; }
.p-post .cx-article__body h2{ position:relative; padding-left:16px; }
.p-post .cx-article__body h2::before{ content:""; position:absolute; left:0; top:.25em; bottom:.25em; width:5px; border-radius:3px; background:linear-gradient(var(--ta-red), var(--ta-gold-500)); }
.p-post .cx-article__body a{ color:var(--ta-ink-700); font-weight:700; text-decoration:underline; text-underline-offset:2px; }
.p-post .cx-article__body iframe{ width:100%; aspect-ratio:16/9; border:0; border-radius:14px; }
.p-post .cx-article__tags{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:22px; padding-top:18px; border-top:1px dashed var(--ta-line-2); }
.p-post .cx-article__tags > span{ font-size:13px; font-weight:800; color:var(--ta-text-2); margin-right:4px; }
.p-post .cx-article__share{ margin-top:14px; }

/* author */
.p-post .cx-author{ display:grid; grid-template-columns:64px minmax(0,1fr); gap:14px; align-items:center; margin-top:22px; padding:16px; border-radius:18px; background:linear-gradient(180deg,#FFFDF8,#FFF4E1); border:1px solid #F0DDB8; }
.p-post .cx-author__ph{ width:64px; height:64px; border-radius:50%; padding:3px; background:var(--ta-g-gold); }
.p-post .cx-author__ph img{ width:100%; height:100%; border-radius:50%; object-fit:cover; border:2px solid #fff; }
.p-post .cx-author__k{ font-size:11px; font-weight:900; letter-spacing:.12em; text-transform:uppercase; color:var(--ta-gold-700); }
.p-post .cx-author__n{ font-family:var(--ta-font-title); font-weight:700; font-size:18px; color:var(--ta-maroon-500); }
.p-post .cx-author__d{ font-size:13px; color:var(--ta-text-2); line-height:1.5; }

/* prev / next */
.p-post .cx-prevnext{ display:grid; gap:10px; grid-template-columns:1fr; margin-top:18px; }
@media (min-width:600px){ .p-post .cx-prevnext{ grid-template-columns:1fr 1fr; } }
.p-post .cx-prevnext__a{ display:grid; gap:4px; padding:14px 16px; border-radius:16px; border:1px solid var(--ta-line); background:#FBF8F4; transition:border-color .15s, background .15s, transform .15s; }
.p-post .cx-prevnext__a:hover{ border-color:var(--ta-gold-500); background:#fff; transform:translateY(-2px); }
.p-post .cx-prevnext__a small{ display:inline-flex; align-items:center; gap:4px; font-size:11.5px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; color:var(--ta-muted); }
.p-post .cx-prevnext__a small .ta-ico{ width:13px; height:13px; }
.p-post .cx-prevnext__a b{ font-family:var(--ta-font-title); font-size:15.5px; line-height:1.35; color:var(--ta-maroon-500); }
.p-post .cx-prevnext__a--next{ text-align:right; justify-items:end; }

/* TOC */
.p-post .cx-toc__list{ list-style:none; margin:0; padding:0; display:grid; gap:2px; counter-reset:toc; }
.p-post .cx-toc__list a{ display:block; padding:7px 10px 7px 12px; border-left:2px solid var(--ta-line); font-size:13.5px; line-height:1.4; color:var(--ta-text-2); }
.p-post .cx-toc__l3 a{ padding-left:24px; font-size:13px; }
.p-post .cx-toc__list a:hover{ color:var(--ta-maroon-500); border-left-color:var(--ta-gold-500); }
.p-post .cx-toc__list a[aria-current]{ color:var(--ta-maroon-500); font-weight:800; border-left-color:var(--ta-red); background:var(--ta-rose-50); }
.p-post .cx-toc--inline{ margin:0 0 18px; border:1px solid #F0DDB8; border-radius:14px; background:#FFFBF4; }
.p-post .cx-toc--inline summary{ display:flex; align-items:center; gap:8px; padding:12px 14px; cursor:pointer; list-style:none; font-weight:900; font-size:14px; color:var(--ta-maroon-600); }
.p-post .cx-toc--inline summary::-webkit-details-marker{ display:none; }
.p-post .cx-toc--inline summary .ta-ico{ width:16px; height:16px; color:var(--ta-red); }
.p-post .cx-toc--inline summary small{ margin-left:auto; font-size:12px; color:var(--ta-muted); font-weight:700; }
.p-post .cx-toc--inline .cx-toc__list{ padding:0 12px 12px; }
@media (min-width:1024px){ .p-post .cx-toc--inline{ display:none; } }

/* aside */
.p-post .cx-postaside__in{ display:grid; gap:16px; }
.p-post .cx-postaside__share .ta-share__lbl{ display:none; }
@media (max-width:1023px){ .p-post .cx-postaside .cx-toc--side, .p-post .cx-postaside__share{ display:none; } }
.p-post .cx-trialcard{ position:relative; overflow:hidden; display:grid; gap:8px; padding:20px 18px; border-radius:var(--ta-r-xl); color:#fff; background:var(--ta-tx-seigaiha), radial-gradient(120% 140% at 0% 0%, #A3151C 0%, #741318 50%, #4E0B0F 100%); background-size:36px 18px, auto; box-shadow:0 14px 30px rgba(60,10,14,.22); }
.p-post .cx-trialcard::after{ content:""; position:absolute; right:-16px; top:-16px; width:96px; height:96px; opacity:.22; background:var(--ta-ic-blossom-gold) center/contain no-repeat; }
.p-post .cx-trialcard__k{ font-size:10.5px; font-weight:900; letter-spacing:.14em; text-transform:uppercase; color:#FDE68A; }
.p-post .cx-trialcard__t{ font-family:var(--ta-font-title); font-weight:700; font-size:20px; line-height:1.25; }
.p-post .cx-trialcard__d{ font-size:13px; line-height:1.55; color:rgba(255,246,225,.9); margin-bottom:4px; }
.p-post .cx-trialcard .ta-ico{ width:16px; height:16px; }