/* Trang tin tức và bài viết mẫu: lưới ba cột, thẻ bài, ảnh dự án KiGin (chưa xác nhận quyền đăng), thẻ không đổi khi rê chuột. */
/* 25/10/2026 (Giám Sát: trang tin tức và bài viết mẫu, khung ba cột): lưới bài viết, thẻ bài, khung ảnh tạm có ghi chú */
.kg-news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
@media (max-width:900px){.kg-news-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.kg-news-grid{grid-template-columns:1fr;gap:24px}}
.kg-news-card{display:flex;flex-direction:column;gap:12px}
.kg-news-card__img{margin:0;aspect-ratio:4/3;border-radius:12px;background:var(--kg-rattan);display:flex;align-items:flex-end;padding:16px;border:1px dashed rgb(19 111 154 / 28%)}
.kg-news-card__img figcaption{font-size:.875rem;color:var(--kg-stone)}
.kg-news-card h3{margin:0;font-size:18px;font-weight:600;line-height:1.3;color:var(--kg-ink)}
.kg-news-card p{margin:0;color:var(--kg-stone)}
.kg-news-card .kg-link{align-self:flex-start;font-weight:600}
/* 25/10/2026 (Giám Sát: ảnh dự án KiGin từ input/09-ben-thu-3/02-anh-du-an, chưa xác nhận quyền đăng): ảnh thẻ bài tin tức */
.kg-news-card__img:has(img){padding:0;border:0;background:none;overflow:hidden}
.kg-news-card__img img{display:block;width:100%;height:100%;object-fit:cover;border-radius:12px}
/* 25/10/2026 (Giám Sát: thẻ tin tức không có liên kết, rê chuột không đổi gì): không đổi hình, bóng hay con trỏ */
.kg-news-card{cursor:default}
/* Thẻ tin tức: ảnh và tiêu đề là liên kết tới bài viết. Rê chuột theo AWESOME-DESIGN.md (một bậc bóng, tiêu đề teal) */
.kg-news-card__link{display:flex;flex-direction:column;gap:12px;color:inherit;text-decoration:none;cursor:pointer}
.kg-news-card__link .kg-news-card__img{transition:box-shadow .25s ease}
.kg-news-card__link h3{transition:color .2s ease}
.kg-news-card__link:is(:hover,:focus-visible) .kg-news-card__img{box-shadow:0 4px 8px rgba(10,34,48,.10)}
.kg-news-card__link:is(:hover,:focus-visible) h3{color:#136F9A}
/* Rê chuột vào ảnh thẻ tin tức: phóng nhẹ 3%, khung ảnh giữ bo góc và che phần tràn */
.kg-news-card__link .kg-news-card__img img{transition:transform .4s ease}
.kg-news-card__link:is(:hover,:focus-visible) .kg-news-card__img img{transform:scale(1.03)}
/* Tải thêm bài viết khi cuộn (theo lưới sản phẩm): 6 bài đầu, 3 bài còn lại, tổng 9 */
.kg-news-card[hidden]{display:none}
.kg-sp-more{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:40px}
.kg-sp-more[hidden]{display:none}
.kg-sp-more__n{margin:0;color:var(--kg-stone)}
.kg-sp-more__btn{min-height:52px;padding:0 32px;gap:0;font-size:16px}
.kg-sp-more__btn[hidden]{display:none}
.kg-sp-more__ring{display:none;width:18px;height:18px;margin-right:10px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:kg-news-spin .8s linear infinite}
.kg-sp-more__btn.is-loading .kg-sp-more__ring{display:inline-block}
.kg-sp-more__btn[aria-disabled="true"]{pointer-events:none;cursor:progress}
@keyframes kg-news-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.kg-sp-more__ring{animation:none}}
/* Trạng thái đã hiển thị hết bài viết: dấu tích tròn màu teal và dòng chữ đậm (theo lưới sản phẩm) */
.kg-sp-more.is-done .kg-sp-more__n{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:var(--kg-ink)}
.kg-sp-more.is-done .kg-sp-more__n::before{content:"";width:20px;height:20px;background:var(--kg-teak);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8.5 12.5l2.5 2.5 4.5-5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8.5 12.5l2.5 2.5 4.5-5'/%3E%3C/svg%3E") center/contain no-repeat}
html[data-theme="dark"] .kg-sp-more.is-done .kg-sp-more__n{color:var(--kg-ivory)}
html[data-theme="dark"] .kg-sp-more.is-done .kg-sp-more__n::before{background:var(--kg-champagne)}
/* Khung mảnh trong ảnh thẻ tin tức, theo .kg-slot::after của sản phẩm */
.kg-news-card__img{position:relative}
.kg-news-card__img::after{content:"";position:absolute;inset:12px;border:1px solid rgba(199,230,243,.35);pointer-events:none}
/* Bài viết mẫu: ảnh chính, bài liên quan dạng trượt (3 bài thấy được, tổng 5) */
.bai-hero{margin:0 0 32px;border-radius:var(--radius-xl,12px);overflow:hidden;max-height:500px}
.bai-hero img{display:block;width:100%;height:100%;max-height:500px;object-fit:cover;border-radius:var(--radius-xl,12px)}
.kg-rel__track{display:flex;gap:32px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.kg-rel__track::-webkit-scrollbar{display:none}
.kg-rel__track>.kg-news-card{flex:0 0 calc((100% - 64px) / 3);scroll-snap-align:start}
@media (max-width:900px){.kg-rel__track>.kg-news-card{flex-basis:calc((100% - 32px) / 2)}}
@media (max-width:600px){.kg-rel__track>.kg-news-card{flex-basis:85%}}
.kg-rel__btn{min-width:44px;min-height:44px;border:1px solid var(--kg-line);border-radius:999px;background:transparent;color:var(--kg-ink);font-size:1.125rem;cursor:pointer}
.kg-rel__btn:hover{color:var(--kg-teak);box-shadow:0 1px 5px rgb(10 34 48 / 43%)}
.kg-rel__btn:focus-visible{outline:3px solid var(--kg-teak);outline-offset:3px}
@media (prefers-reduced-motion:reduce){.kg-rel__track{scroll-behavior:auto}}
/* Tiêu đề "Bài viết liên quan": khoảng dưới 50 px */
#lien-quan{margin-bottom:50px}
.kg-rel__track{cursor:grab;user-select:none}
.kg-rel__track.is-dragging{cursor:grabbing;scroll-snap-type:none;scroll-behavior:auto}
.kg-rel__track img{-webkit-user-drag:none}
/* Nút trước và sau nằm giữa hai mép trái và phải của dải bài; hiện khi rê chuột vào dải (cảm ứng: luôn hiện) */
/* Mũi tên kiểu E (tròn 44 px, viền mỏng, bóng nhẹ) đặt sát mép trái và phải dải bài, ngang tâm ảnh thẻ (ảnh 4:3 nên tâm = 3/8 bề rộng thẻ); hiện khi rê chuột vào dải hoặc khi nút có tiêu điểm bàn phím; màn cảm ứng luôn hiện */
.kg-rel{position:relative;container-type:inline-size}
.kg-rel__nav{position:absolute;left:12px;right:12px;top:calc((100cqw - 64px) / 8);display:flex;justify-content:space-between;transform:translateY(-50%);pointer-events:none;z-index:2}
@media (max-width:900px){.kg-rel__nav{top:calc((100cqw - 32px) * 3 / 16)}}
@media (max-width:600px){.kg-rel__nav{top:calc(100cqw * 0.31875)}}
.kg-rel__btn{pointer-events:auto;opacity:0;transition:opacity .2s ease,box-shadow .2s ease,color .2s ease}
.kg-rel:hover .kg-rel__btn,.kg-rel:focus-within .kg-rel__btn{opacity:1}
@media (hover:none){.kg-rel__btn{opacity:1}}
.kg-rel__btn{background:var(--kg-paper,#fff);box-shadow:0 1px 2px rgba(10,34,48,.10)}
@media (prefers-reduced-motion:reduce){.kg-rel__btn{transition:none}}
/* Tiêu đề mục trong nội dung bài viết: căn trái */
.kg-doc .kg-doc-h{text-align:left}
/* Dòng thông tin đầu bài viết: ngày, chuyên mục, thời gian đọc; căn trái */
.bai-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 24px;text-align:left;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--kg-ink)}
.bai-meta__cat{color:inherit}
.bai-meta__dot{color:inherit}
/* Căn chỉnh bài viết theo AWESOME-DESIGN (REF Lượt 2): nhịp 8 px, H2 theo token, H3 sans 600, dòng đọc tối đa 68 ký tự, thẻ tiêu đề sans 600 */
body[data-page="legal"] .kg-doc p{margin:0 0 16px}
body[data-page="legal"] .kg-doc h2{font-size:var(--kg-fs-h2)}
body[data-page="legal"] .kg-doc h3{font-family:var(--kg-sans);font-weight:600;font-size:20px;line-height:1.4;margin:24px 0 8px;color:var(--kg-ink)}
.kg-news-card h3{font-family:var(--kg-serif);font-weight:400;font-size:18px;line-height:1.35}
body[data-page="legal"] .kg-doc p.bai-meta{color:var(--kg-ink)}
body[data-page="legal"] .kg-doc p.bai-meta .bai-meta__cat,body[data-page="legal"] .kg-doc p.bai-meta .bai-meta__dot{color:inherit}
body[data-page="legal"] .kg-sec .kg-wrap .kg-doc p.bai-meta{color:var(--kg-ink)}
/* Nút mũi tên kiểu E: icon chevron, kích thước 20 px, màu mặc định */
.kg-rel__btn{display:inline-flex;align-items:center;justify-content:center;padding:0}
.kg-rel__btn svg{display:block;flex:none;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
/* Tiêu đề và section bài viết theo AWESOME-DESIGN: H2 dòng 1,14, khoảng trên 48 px, khoảng tới nội dung 16 px (mobile 32/12); đoạn sau tiêu đề không lề trên */
body[data-page="legal"] .kg-doc h2.kg-doc-h{margin:48px 0 16px;line-height:1.14}
body[data-page="legal"] .kg-doc .bai-hero + h2.kg-doc-h{margin-top:0}
body[data-page="legal"] .kg-doc h2.kg-doc-h + p{margin-top:0}
@media (max-width:700px){body[data-page="legal"] .kg-doc h2.kg-doc-h{margin:32px 0 12px}}
/* Ảnh chính bài viết mở popup khi bấm */
.bai-hero__btn{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;border-radius:12px}
.bai-hero__btn:focus-visible{outline:3px solid var(--kg-teak,#136F9A);outline-offset:4px}
.kg-lightbox{border:0;padding:0;background:transparent;max-width:none;max-height:none;width:auto;height:auto}
.kg-lightbox::backdrop{background:rgba(10,34,48,.9)}
.kg-lightbox img{display:block;max-width:90vw;max-height:88vh;width:auto;height:auto;border-radius:12px}
.kg-lightbox__close{position:absolute;top:16px;right:16px;min-width:44px;min-height:44px;border:0;border-radius:999px;background:#fff;color:var(--kg-ink,#0A2230);font-size:24px;line-height:1;cursor:pointer;box-shadow:0 4px 8px rgba(10,34,48,.10)}
.kg-lightbox__close:focus-visible{outline:3px solid var(--kg-teak,#136F9A);outline-offset:3px}
/* Bài viết và khối bài liên quan liền nhau: một khoảng section duy nhất, không cộng hai đệm */
section[aria-labelledby="noi-dung-bai"]{padding-bottom:0}
#lien-quan{margin-top:0}
/* Popup ảnh bài viết: phủ toàn màn hình, nền tối, nút đóng cố định góc trên phải (không bị thanh menu che) */
dialog.kg-lightbox{position:fixed;inset:0;margin:0;width:100vw;height:100vh;max-width:100vw;max-height:100vh;padding:0;border:0;background:rgba(10,34,48,.9);align-items:center;justify-content:center;z-index:1000}
dialog.kg-lightbox:not([open]){display:none}
dialog.kg-lightbox[open]{display:flex}
.kg-lightbox__close{position:fixed;top:16px;right:16px;z-index:1001}