/* Trang thông tin (Trang chủ, Giới thiệu, Liên hệ, Chính sách, Điều khoản, 404) — dùng chung màu với khung.css */
:root{--bg:#f6f2e8;--card:#fffefa;--card2:#fbf8f0;--ink:#16232b;--ink2:#3a454d;--ink3:#655f53;--line:#e7dfcc;--line2:#d3c6a6;--dong:#8f6c2c;--tim:#1c2f3a;--onTim:#f5ecd6;--cat:#1f6337;--hung:#a82a1d;
 --f-disp:'Fraunces',Georgia,serif;--f-ui:'Be Vietnam Pro',system-ui,-apple-system,'Segoe UI',sans-serif}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--bg:#0f171c;--card:#16212a;--card2:#1b2832;--ink:#efe7d4;--ink2:#c6bda8;--ink3:#8d8778;--line:#26343e;--line2:#3a4a52;--dong:#d4b26a;--tim:#d4b26a;--onTim:#11191f;--cat:#74c897;--hung:#f07d6f;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#0f171c;--card:#16212a;--card2:#1b2832;--ink:#efe7d4;--ink2:#c6bda8;--ink3:#8d8778;--line:#26343e;--line2:#3a4a52;--dong:#d4b26a;--tim:#d4b26a;--onTim:#11191f;--cat:#74c897;--hung:#f07d6f;color-scheme:dark}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.7 var(--f-ui)}
.wrap{max-width:var(--tvc-rong,1280px);margin:0 auto;padding:20px max(16px,env(safe-area-inset-left,0px)) 0}
.tr{max-width:860px;margin:18px auto 0;background:var(--card);border:1px solid var(--line);border-top:3px solid var(--dong);border-radius:14px;padding:26px clamp(18px,4vw,40px) 30px}
.tr.rong{max-width:1180px}
.tr h1{font:650 clamp(1.6rem,3.4vw,2.2rem)/1.2 var(--f-disp);margin:0 0 6px;color:var(--tim)}
.tr .eb{font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--dong);font-weight:700}
.tr .dan{font-size:16px;color:var(--ink2);margin:6px 0 18px}
.tr h2{font:650 1.25rem/1.3 var(--f-disp);margin:26px 0 8px;padding-left:10px;border-left:4px solid var(--dong)}
.tr h3{font:650 1.05rem/1.3 var(--f-disp);margin:18px 0 6px}
.tr p,.tr li{color:var(--ink2)}
.tr b,.tr strong{color:var(--ink)}
.tr a{color:var(--tim);font-weight:600}
.tr ul,.tr ol{padding-left:22px}
.tr li{margin:4px 0}
.tr table{width:100%;border-collapse:collapse;font-size:14px;margin:8px 0}
.tr th,.tr td{text-align:left;padding:7px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.tr th{color:var(--ink);background:var(--card2);font-weight:600}
.tr .capnhat{font-size:12.5px;color:var(--ink3);font-style:italic}
.hop{border:1px solid var(--line2);background:var(--card2);border-radius:12px;padding:12px 16px;margin:14px 0}
.hop.luu{border-color:color-mix(in srgb,var(--dong) 55%,var(--card));background:color-mix(in srgb,var(--dong) 8%,var(--card))}
/* trang chủ */
.the-luoi{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;margin:16px 0}
/* thẻ chuyên mục: hình nổi bật trên đầu; di chuột đổi sang nền đậm như ô đang chọn trên thanh chuyên mục */
.the{--hv-bg:linear-gradient(115deg,#1c2f3a 45%,color-mix(in srgb,#a8823e 38%,#1c2f3a));--hv-ink:#f5ecd6;--hv-phu:#e6c98a;--hv-mo:#d9cfb8;
 position:relative;display:flex;flex-direction:column;gap:5px;padding:12px 12px 14px;border:1px solid var(--line2);border-radius:14px;background:var(--card);text-decoration:none;color:inherit;overflow:hidden;transition:transform .18s,border-color .18s,box-shadow .18s,background .18s}
:root[data-theme="dark"] .the{--hv-bg:linear-gradient(115deg,#d4b26a 45%,color-mix(in srgb,#f0d9a0 40%,#d4b26a));--hv-ink:#11191f;--hv-phu:#3b2c10;--hv-mo:#2a2a22}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .the{--hv-bg:linear-gradient(115deg,#d4b26a 45%,color-mix(in srgb,#f0d9a0 40%,#d4b26a));--hv-ink:#11191f;--hv-phu:#3b2c10;--hv-mo:#2a2a22}}
.the-hinh{position:relative;display:block;height:96px;margin-bottom:6px;border-radius:10px;overflow:hidden;
 background:radial-gradient(ellipse at 70% 40%,color-mix(in srgb,var(--dong) 22%,var(--card2)),var(--card2) 70%);border:1px solid var(--line);transition:background .18s,border-color .18s}
.the-hinh::before,.the-hinh::after{content:'';position:absolute;background:center/contain no-repeat;transition:transform .3s,opacity .18s}
.the-hinh::after{width:78px;height:78px;left:50%;top:50%;transform:translate(-50%,-50%)}
.the-hinh::before{width:150px;height:150px;right:-38px;top:-30px;opacity:.13;transform:rotate(-12deg)}
.cm-tuvi .the-hinh::after,.cm-tuvi .the-hinh::before{background-image:url(cm/tuvi.svg)}
.cm-tutru .the-hinh::after,.cm-tutru .the-hinh::before{background-image:url(cm/tutru.svg?v=20261112f)}
.cm-phongthuy .the-hinh::after,.cm-phongthuy .the-hinh::before{background-image:url(cm/phongthuy.svg)}
.cm-tuong .the-hinh::after,.cm-tuong .the-hinh::before{background-image:url(cm/tuong-mat.webp?v=20261113a)}
/* ảnh khuôn mặt (ảnh màu, không phải nét vẽ): hình chính cao hơn, bo tròn; bản mờ ở góc */
.cm-tuong .the-hinh::after{width:70px;height:88px;border-radius:8px;background-size:cover;background-position:center top;box-shadow:0 2px 8px rgba(28,47,58,.18)}
.cm-tuong .the-hinh::before{opacity:.18;background-size:cover;border-radius:50%}
.cm-kinhdich .the-hinh::after,.cm-kinhdich .the-hinh::before{background-image:url(cm/kinhdich.svg)}
.cm-lichphap .the-hinh::after,.cm-lichphap .the-hinh::before{background-image:url(cm/lichphap.svg)}
.cm-thuvien .the-hinh::after,.cm-thuvien .the-hinh::before{background-image:url(cm/thuvien.svg)}
.the .so{font:700 11px var(--f-ui);color:var(--dong);letter-spacing:.08em;padding:0 4px}
.the h3{margin:0;padding:0 4px;font:650 1.12rem/1.25 var(--f-disp);color:var(--ink)}
.the p{margin:0;padding:0 4px;font-size:13px;line-height:1.55;color:var(--ink3)}
.the .di{margin-top:auto;padding:6px 4px 0;font-weight:700;color:var(--tim);font-size:13.5px;transition:color .18s,letter-spacing .18s}
a.the:hover,a.the:focus-visible{background:var(--hv-bg);border-color:var(--hv-bg);border-color:#a8823e;transform:translateY(-3px);box-shadow:0 10px 24px rgba(28,47,58,.22)}
a.the:hover .so,a.the:focus-visible .so{color:var(--hv-phu)}
a.the:hover h3,a.the:focus-visible h3,a.the:hover .di,a.the:focus-visible .di{color:var(--hv-ink)}
a.the:hover p,a.the:focus-visible p{color:var(--hv-mo)}
a.the:hover .di,a.the:focus-visible .di{letter-spacing:.02em}
a.the:hover .the-hinh,a.the:focus-visible .the-hinh{background:radial-gradient(ellipse at 70% 40%,rgba(255,255,255,.22),rgba(255,255,255,.06) 70%);border-color:rgba(255,255,255,.18)}
a.the:hover .the-hinh::after,a.the:focus-visible .the-hinh::after{transform:translate(-50%,-50%) scale(1.12) rotate(-6deg)}
a.the:hover .the-hinh::before,a.the:focus-visible .the-hinh::before{opacity:.22;transform:rotate(0) scale(1.05)}
a.the:focus-visible{outline:2px solid var(--dong);outline-offset:2px}
.the.cho{opacity:.72;border-style:dashed}.the.cho .the-hinh{filter:grayscale(.7)}
@media (prefers-reduced-motion:reduce){.the,.the-hinh::after,.the-hinh::before{transition:none}a.the:hover{transform:none}}
@media (max-width:520px){.the-hinh{height:80px}.the-hinh::after{width:64px;height:64px}.cm-tuong .the-hinh::after{width:56px;height:72px}}
.nut{display:inline-flex;align-items:center;gap:8px;padding:11px 24px;border-radius:999px;background:var(--tim);color:var(--onTim)!important;text-decoration:none;font:700 15px var(--f-ui);border:0;cursor:pointer}
.nut:hover{filter:brightness(1.12)}
.nut.phu{background:transparent;color:var(--tim)!important;border:1.5px solid var(--tim)}
/* form liên hệ */
.fm{display:grid;gap:12px;margin-top:10px}
.fm label{display:grid;gap:4px;font-size:13px;font-weight:600;color:var(--ink2)}
.fm input,.fm select,.fm textarea{font:15px var(--f-ui);color:var(--ink);background:var(--card2);border:1px solid var(--line2);border-radius:9px;padding:9px 11px}
.fm textarea{min-height:150px;resize:vertical}
.fm input:focus,.fm select:focus,.fm textarea:focus{outline:2px solid var(--dong);outline-offset:0;border-color:var(--dong)}
.fm .hai{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:620px){.fm .hai{grid-template-columns:1fr}}
.fm .bay{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.fm .chk{display:flex;gap:8px;align-items:flex-start;font-weight:400}
.tb{padding:10px 14px;border-radius:10px;font-size:14px}
.tb.ok{background:color-mix(in srgb,var(--cat) 12%,var(--card));border:1px solid var(--cat);color:var(--ink)}
.tb.loi{background:color-mix(in srgb,var(--hung) 10%,var(--card));border:1px solid var(--hung);color:var(--ink)}
.tb[hidden]{display:none}
/* trang Ủng hộ */
.uh{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:22px;align-items:center;margin:16px 0;padding:18px;border:1.5px solid color-mix(in srgb,var(--dong) 55%,var(--card));border-radius:16px;background:color-mix(in srgb,var(--dong) 6%,var(--card))}
.uh-qr{margin:0;text-align:center}
.uh-qr img{width:100%;height:auto;border-radius:12px;background:#fff;box-shadow:0 4px 16px rgba(28,47,58,.14)}
.uh-qr figcaption{font-size:12.5px;color:var(--ink3);margin-top:8px;line-height:1.5}
.uh-tt dl{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;margin:0;font-size:15px}
.uh-tt dt{color:var(--ink3);font-size:13px;padding-top:2px}
.uh-tt dd{margin:0;font-weight:600;color:var(--ink);display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.uh-so{font:700 1.35rem var(--f-ui);letter-spacing:.04em;color:var(--tim)}
.uh-chep{font:600 12px var(--f-ui);color:var(--tim);background:var(--card);border:1px solid var(--line2);border-radius:999px;padding:3px 10px;cursor:pointer}
.uh-chep:hover{border-color:var(--dong)}
.uh-cam{margin:12px 0 0;font-family:var(--f-disp);font-size:1.05rem;color:var(--dong)}
.uh .tb{margin:10px 0 0}
@media (max-width:640px){.uh{grid-template-columns:1fr}.uh-qr{max-width:300px;margin:0 auto}}
/* hộp mời ủng hộ ở trang chủ, giới thiệu */
.moi-uh{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center;justify-content:space-between}
.moi-uh p{margin:0;flex:1 1 320px}