/* /bai-viet.html (+ shared bits for /bai-viet-chi-tiet.html) — scoped to .p-posts / .p-post */

/* post grid (2 → 3 columns) */
:is(.p-posts,.p-post) .cx-postgrid{ display:grid; gap:14px; grid-template-columns:1fr; }
@media (min-width:600px){ :is(.p-posts,.p-post) .cx-postgrid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; } }
@media (min-width:1280px){ .p-posts .cx-posts__main .cx-postgrid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (min-width:1024px){ .p-post .cx-postgrid{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; } }

/* search in the header band */
.p-posts .ta-pagehead__actions{ width:100%; }
.p-posts .cx-psearch{ display:flex; flex:1 1 420px; width:100%; max-width:560px; background:#fff; border-radius:12px; padding:4px; box-shadow:0 10px 24px rgba(0,0,0,.25); }
.p-posts .cx-psearch__input{ flex:1; min-width:0; border:0; outline:0; padding:10px 12px; font-size:15px; background:transparent; color:var(--ta-text); }
.p-posts .cx-psearch__btn{ display:inline-flex; align-items:center; gap:6px; border:0; border-radius:9px; padding:0 18px; font-weight:900; color:#3B2200; background:var(--ta-sun); }
.p-posts .cx-psearch__btn:hover{ background:var(--ta-sun-600); }
.p-posts .cx-psearch__btn .ta-ico{ width:18px; height:18px; }
.p-posts .cx-psearch:focus-within{ box-shadow:0 0 0 3px rgba(255,183,3,.55), 0 10px 24px rgba(0,0,0,.25); }
@media (max-width:420px){ .p-posts .cx-psearch__btn span{ display:none; } }

/* category bar + list header */
.p-posts .cx-catbar{ margin-bottom:-12px; }
.p-posts .cx-posts{ margin-top:var(--ta-sec-gap); }
.p-posts .cx-posts__main{ min-width:0; }
.p-posts .cx-posts__bar{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 12px; margin-bottom:14px; }
.p-posts .cx-posts__count{ font-family:var(--ta-font-title); font-weight:700; font-size:clamp(20px, 1rem + .6vw, 26px); color:var(--ta-maroon-500); }
.p-posts .cx-posts__active{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.p-posts .cx-featured{ margin-bottom:16px; }
.p-posts #cx-pager{ margin-top:22px; display:flex; justify-content:center; }
:is(.p-posts,.p-post) .cx-active__pill{ display:inline-flex; align-items:center; gap:6px; padding:5px 10px; border-radius:99px; border:1px solid var(--ta-rose-200); background:var(--ta-rose-50); color:var(--ta-maroon-500); font-size:12.5px; font-weight:800; }
:is(.p-posts,.p-post) .cx-active__pill .ta-ico{ width:12px; height:12px; }
:is(.p-posts,.p-post) .cx-active__all{ border:0; background:none; color:var(--ta-ink-700); font-size:12.5px; font-weight:800; text-decoration:underline; text-underline-offset:2px; }

/* aside */
.p-posts .cx-catlist{ list-style:none; margin:0; padding:0; display:grid; gap:2px; }
.p-posts .cx-catlist a{ display:flex; align-items:center; justify-content:space-between; gap:8px; padding:9px 10px; border-radius:10px; font-size:14px; font-weight:700; color:var(--ta-text-2); }
.p-posts .cx-catlist a::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--ta-gold-500); flex:0 0 auto; }
.p-posts .cx-catlist a span{ flex:1; }
.p-posts .cx-catlist a small{ min-width:26px; text-align:center; padding:1px 7px; border-radius:99px; background:var(--ta-cream); font-size:11.5px; font-weight:800; color:var(--ta-muted); }
.p-posts .cx-catlist a:hover, .p-posts .cx-catlist a[aria-current]{ background:var(--ta-cream); color:var(--ta-maroon-500); }
.p-posts .cx-catlist a[aria-current]::before{ background:var(--ta-red); }
.p-posts .cx-catlist__none{ font-size:13px; color:var(--ta-muted); }
:is(.p-posts,.p-post) .cx-tags{ display:flex; flex-wrap:wrap; gap:6px; }
:is(.p-posts,.p-post) .cx-tag{ display:inline-flex; align-items:center; gap:4px; padding:5px 11px; border-radius:99px; background:var(--ta-cream); border:1px solid var(--ta-line-2); font-size:12.5px; font-weight:800; color:var(--ta-maroon-600); }
:is(.p-posts,.p-post) .cx-tag small{ font-weight:700; color:var(--ta-muted); }
:is(.p-posts,.p-post) .cx-tag:hover, :is(.p-posts,.p-post) .cx-tag.is-on{ background:var(--ta-maroon-600); border-color:var(--ta-maroon-600); color:#fff; }
:is(.p-posts,.p-post) .cx-tag.is-on small, :is(.p-posts,.p-post) .cx-tag:hover small{ color:rgba(255,255,255,.8); }
.p-posts .cx-nextcls__row{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:12px; align-items:start; margin-bottom:12px; }
.p-posts .cx-nextcls__date{ display:grid; justify-items:center; width:54px; padding:6px 0; border-radius:12px; font-size:10px; font-weight:900; text-transform:uppercase; color:#4A2A00; background:var(--ta-g-gold); box-shadow:var(--ta-sh-gold); line-height:1.1; }
.p-posts .cx-nextcls__date b{ font-family:var(--ta-font-display); font-size:22px; }
.p-posts .cx-nextcls__t{ font-weight:800; font-size:14px; line-height:1.35; }
.p-posts .cx-nextcls__m{ font-size:12.5px; color:var(--ta-muted); margin:2px 0 6px; }
.p-posts .cx-promo{ position:relative; overflow:hidden; display:grid; gap:4px; padding:18px; border-radius:var(--ta-r-xl); color:#fff; background:var(--ta-tx-seigaiha), radial-gradient(120% 140% at 100% 0%, #0E86AD 0%, #0A6F8F 50%, #064C62 100%); background-size:36px 18px, auto; box-shadow:0 12px 26px rgba(6,76,98,.25); }
.p-posts .cx-promo::after{ content:""; position:absolute; right:-14px; bottom:-18px; width:110px; height:110px; opacity:.22; background:var(--ta-ic-blossom-gold) center/contain no-repeat; }
.p-posts .cx-promo__k{ font-size:10.5px; font-weight:900; letter-spacing:.14em; text-transform:uppercase; color:#FDE68A; }
.p-posts .cx-promo__t{ font-family:var(--ta-font-title); font-weight:700; font-size:20px; }
.p-posts .cx-promo__d{ font-size:13px; line-height:1.5; color:rgba(255,255,255,.88); }
.p-posts .cx-promo__cta{ display:inline-flex; align-items:center; gap:6px; justify-self:start; margin-top:8px; padding:7px 13px; border-radius:var(--ta-r-sm); background:#fff; color:var(--ta-ink-700); font-size:12.5px; font-weight:900; }
.p-posts .cx-promo__cta .ta-ico{ width:14px; height:14px; }
.p-posts .cx-follow__lead{ font-size:13px; color:var(--ta-text-2); margin:-4px 0 12px; }
.p-posts .cx-follow__list{ display:grid; gap:8px; }
.p-posts .cx-follow__btn{ display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:12px; font-weight:800; font-size:14px; color:#fff; transition:transform .15s, filter .15s; }
.p-posts .cx-follow__btn:hover{ transform:translateY(-2px); filter:brightness(1.06); }
.p-posts .cx-follow__btn .ta-ico{ width:18px; height:18px; }
.p-posts .cx-follow__btn--fb{ background:#1466D8; } .p-posts .cx-follow__btn--tt{ background:#111; } .p-posts .cx-follow__btn--yt{ background:#E62117; }
@media (max-width:1023px){ .p-posts .cx-posts__aside{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 300px), 1fr)); } }