/* =====================================================================
   TRANG QUỸ KHUYẾN HỌC
   Ba mạch trộn vào nhau: bản sắc "bia đá công đức" (bảng vàng, sổ minh
   bạch), động cơ cảm xúc "mỗi năm một lần xướng tên" (ảnh lễ, đếm ngược),
   và kỷ luật của một tổ chức phi lợi nhuận (việc đã làm, ai chịu trách
   nhiệm, sổ sách mở).
   Ô nhập cỡ chữ 16px trở lên — dưới 16px là iOS tự phóng to trang khi
   người dùng chạm vào ô, nhảy layout ngay giữa lúc đang gõ.
   ===================================================================== */
.td-quy-page .wp-site-blocks > main.wp-block-group{margin-block-start:0!important}

/* ---------- mở đầu ---------- */
.td-quyhero{position:relative; isolation:isolate; overflow:clip; background:#0E0C08; color:var(--td-giay-sang);
  min-height:min(64svh,540px); display:flex; align-items:flex-end}
.td-quyhero__photo{position:absolute; inset:0; z-index:-2}
.td-quyhero__photo img{width:100%; height:100%; object-fit:cover; object-position:50% 42%; display:block;
  filter:sepia(.3) saturate(.8) brightness(.58) contrast(1.05)}
.td-quyhero__veil{position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg,rgba(14,12,8,.5) 0%,rgba(14,12,8,.36) 24%,rgba(14,12,8,.8) 62%,rgba(14,12,8,.97) 88%,#0E0C08 100%)}
.td-quyhero__in{width:100%; max-width:1080px; margin:0 auto;
  padding:3.2rem var(--wp--style--root--padding-left,1.5rem) clamp(2.4rem,5vh,3.6rem)}
.td-quyhero__kicker{font-family:'Cormorant Garamond',Georgia,serif; font-style:italic; color:#F3DCA4;
  font-size:clamp(1.05rem,2vw,1.4rem); margin:0 0 .5rem}
.td-quyhero h1{font-family:'Cormorant Garamond',Georgia,serif; font-weight:500; letter-spacing:.04em; line-height:1.08;
  margin:0; color:var(--td-giay-sang); font-size:clamp(1.9rem,5vw,3.6rem); text-wrap:balance;
  text-shadow:0 2px 22px rgba(0,0,0,.55)}
.td-quyhero__sub{font-family:'Cormorant Garamond',serif; font-style:italic; color:var(--td-giay);
  font-size:clamp(1.1rem,2vw,1.45rem); margin:1rem 0 0; max-width:52ch; line-height:1.55}
.td-quyhero__cta{display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.6rem}
.td-quyhero__cta a{display:inline-flex; align-items:center; gap:.55rem; min-height:52px; padding:.8rem 1.6rem;
  border-radius:2px; text-decoration:none; font-family:'Be Vietnam Pro',sans-serif; font-size:.92rem; font-weight:500;
  letter-spacing:.1em; text-transform:uppercase; transition:transform var(--td-d) var(--td-ease), background var(--td-d) var(--td-ease)}
.td-quyhero__cta .p{background:#E9C56A; color:#0E0C08; box-shadow:0 14px 34px -14px rgba(233,197,106,.5)}
.td-quyhero__cta .p:hover{background:#F3DCA4; transform:translateY(-2px)}
.td-quyhero__cta .s{color:var(--td-giay); border:1px solid rgba(203,176,122,.55)}
.td-quyhero__cta .s:hover{border-color:#E9C56A; color:#F3DCA4}

/* ---------- dải đếm ngược ---------- */
.td-le{background:var(--td-nau); color:var(--td-giay-sang); padding:1.1rem 1.2rem; text-align:center;
  display:flex; align-items:baseline; justify-content:center; gap:.7rem; flex-wrap:wrap; min-height:64px}
.td-le b{font-family:'Cormorant Garamond',serif; font-size:2.2rem; font-weight:500; color:#F3DCA4; line-height:1;
  font-variant-numeric:lining-nums tabular-nums}
.td-le span{font-size:1rem; color:var(--td-giay)}
.td-le time{color:#F3DCA4; white-space:nowrap}

/* ---------- ba việc quỹ làm ---------- */
.td-viec{display:grid; gap:1.2rem; margin-top:1.8rem}
@media (min-width:820px){.td-viec{grid-template-columns:repeat(3,1fr); gap:1.6rem}}
.td-viec > div{padding:1.5rem; background:var(--td-giay-sang); border:1px solid var(--td-giay-vien);
  border-top:3px solid var(--td-vang)}
.td-viec h3{margin:0 0 .5rem; font-family:'Cormorant Garamond',Georgia,serif; font-weight:500; font-size:1.3rem;
  color:var(--td-vang-dam); letter-spacing:.03em}
.td-viec p{margin:0; font-size:1.02rem}

/* ---------- khối góp quỹ ---------- */
.td-gop{margin-top:1.8rem; display:grid; gap:1.6rem}
@media (min-width:900px){.td-gop{grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:2rem; align-items:start}}
.td-gop__hop{padding:1.6rem; background:var(--td-giay-sang); border:1px solid var(--td-giay-vien)}
.td-gop__hop h3{margin:0 0 1rem; font-family:'Cormorant Garamond',Georgia,serif; font-weight:500; font-size:1.35rem;
  color:var(--td-vang-dam); letter-spacing:.03em}
#td-qr{width:min(230px,60vw); aspect-ratio:1; margin:0 auto 1rem; display:block; background:#fff; padding:10px;
  border:1px solid var(--td-giay-vien)}
#td-qr svg{width:100%; height:100%; display:block}
.td-qr-note{text-align:center; font-size:.92rem; color:var(--td-muc-nhat); margin:0 0 1.2rem}

.td-dong{display:flex; align-items:center; justify-content:space-between; gap:.8rem; padding:.75rem 0;
  border-bottom:1px solid var(--td-giay-vien); flex-wrap:wrap}
.td-dong:last-of-type{border-bottom:0}
.td-dong dt{font-size:.82rem; letter-spacing:.11em; text-transform:uppercase; color:var(--td-muc-nhat); margin:0 0 .15rem}
.td-dong dd{margin:0; font-size:1.12rem; font-weight:600; color:var(--td-muc-dam);
  font-variant-numeric:lining-nums tabular-nums; word-break:break-word}
.td-dong dd a{color:inherit}

.td-nut{display:inline-flex; align-items:center; justify-content:center; gap:.4rem; min-height:44px; padding:.5rem 1rem;
  font-family:'Be Vietnam Pro',sans-serif; font-size:.85rem; font-weight:500; letter-spacing:.06em; cursor:pointer;
  color:var(--td-vang-dam); background:transparent; border:1px solid var(--td-vang-500); border-radius:2px;
  transition:background var(--td-d) var(--td-ease), color var(--td-d) var(--td-ease)}
.td-nut:hover{background:var(--td-vang); color:var(--td-giay-sang); border-color:var(--td-vang)}
.td-nut.is-xong{background:var(--td-reu); border-color:var(--td-reu); color:var(--td-giay-sang)}

.td-soan{margin-top:1.4rem; padding-top:1.2rem; border-top:1px dashed var(--td-giay-vien)}
.td-soan p.huong{font-size:.95rem; color:var(--td-muc-nhat); margin:0 0 .9rem}
/* auto-fit chứ không phải media query: media query đo BỀ RỘNG MÀN HÌNH, mà ba ô này nằm trong
   một cột hẹp — ở màn 1440px nó vẫn xếp 3 cột trong khung 340px và ô "Chi / Phái" bị cắt cụt.
   auto-fit đo đúng chỗ trống thật của khung chứa. */
.td-o{display:grid; gap:.7rem; grid-template-columns:repeat(auto-fit, minmax(9.5rem, 1fr))}
.td-o label{display:block; font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:var(--td-muc-nhat); margin-bottom:.25rem}
.td-o input{width:100%; min-height:48px; padding:.6rem .8rem; font-family:'Be Vietnam Pro',sans-serif;
  font-size:16px; color:var(--td-muc-dam); background:var(--td-giay); border:1px solid var(--td-giay-vien); border-radius:2px}
.td-o input:focus{outline:2px solid var(--td-vang); outline-offset:1px; background:#fff}
.td-ketqua{margin-top:.9rem; display:flex; gap:.7rem; align-items:stretch; flex-wrap:wrap}
.td-ketqua input{flex:1 1 16rem; min-width:0; min-height:48px; padding:.6rem .8rem; font-size:15px;
  font-family:'Be Vietnam Pro',sans-serif; color:var(--td-muc-dam); background:var(--td-giay-dam);
  border:1px solid var(--td-giay-vien); border-radius:2px}

/* Dải nhắn cho bà con ở nước ngoài — để riêng, rộng hết khối, vì đây là nhóm người thư gửi
   đích danh mà lại đang chưa có đường chuyển tiền về. */
.td-ngoai{margin-top:1.4rem; padding:1.1rem 1.3rem; background:var(--td-giay-sang);
  border:1px dashed var(--td-vang-500); font-size:1rem; color:var(--td-muc); text-align:center}

/* ---------- bảng vàng công đức ---------- */
.td-bia{margin-top:1.8rem; padding:2rem 1.6rem; background:linear-gradient(180deg,var(--td-giay-sang),var(--td-giay));
  border:1px solid var(--td-vang-500); box-shadow:inset 0 0 0 1px var(--td-giay-sang), 0 1px 0 var(--td-giay-vien)}
.td-bia__dau{text-align:center; margin-bottom:1.4rem}
.td-bia__dau b{display:block; font-family:'Cormorant Garamond',Georgia,serif; font-size:1.5rem; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--td-vang-dam)}
.td-bia__dau span{display:block; font-size:.9rem; color:var(--td-muc-nhat); margin-top:.3rem}
.td-bia__nam{margin-top:1.6rem}
.td-bia__nam > b{display:block; text-align:center; font-family:'Cormorant Garamond',serif; font-size:1.15rem;
  letter-spacing:.14em; color:var(--td-vang); margin-bottom:.8rem; font-variant-numeric:lining-nums}
.td-bia ul{list-style:none; margin:0; padding:0; display:grid; gap:.45rem .9rem; column-count:1}
@media (min-width:640px){.td-bia ul{grid-template-columns:1fr 1fr}}
@media (min-width:960px){.td-bia ul{grid-template-columns:repeat(3,1fr)}}
.td-bia li{font-size:1.02rem; color:var(--td-muc); padding-left:1rem; position:relative; line-height:1.5}
.td-bia li::before{content:""; position:absolute; left:0; top:.62em; width:4px; height:4px; transform:rotate(45deg);
  background:var(--td-vang-500)}
.td-bia li i{font-style:normal; color:var(--td-muc-nhat); font-size:.9em}
.td-trong{text-align:center; color:var(--td-muc-nhat); font-size:1rem; margin:0; padding:1.4rem 0}

/* ---------- minh bạch ---------- */
.td-camket{margin-top:1.6rem; padding:1.5rem 1.6rem; border-left:3px solid var(--td-vang); background:var(--td-giay-sang)}
.td-camket p{margin:0; font-family:'Cormorant Garamond',Georgia,serif; font-style:italic; font-size:1.18rem;
  line-height:1.65; color:var(--td-muc)}
.td-camket cite{display:block; margin-top:.8rem; font-family:'Be Vietnam Pro',sans-serif; font-style:normal;
  font-size:.82rem; letter-spacing:.1em; text-transform:uppercase; color:var(--td-muc-nhat)}
.td-sosach{list-style:none; margin:1.4rem 0 0; padding:0}
.td-sosach li{display:flex; justify-content:space-between; gap:1rem; padding:.85rem 0;
  border-bottom:1px solid var(--td-giay-vien); flex-wrap:wrap}
.td-sosach b{font-weight:500; color:var(--td-muc-dam)}

/* ---------- ban vận động ---------- */
.td-ban{list-style:none; margin:1.6rem 0 0; padding:0; display:grid; gap:1rem}
@media (min-width:700px){.td-ban{grid-template-columns:1fr 1fr}}
.td-ban li{padding:1.1rem 1.3rem; background:var(--td-giay-sang); border:1px solid var(--td-giay-vien)}
.td-ban b{display:block; font-size:1.08rem; color:var(--td-muc-dam)}
.td-ban span{display:block; font-size:.92rem; color:var(--td-muc-nhat); margin-top:.2rem}

/* ---------- toàn văn thư ---------- */
.td-thu{margin-top:1.6rem; padding:1.8rem 1.6rem; background:var(--td-giay-sang); border:1px solid var(--td-giay-vien)}
.td-thu h3{margin:0 0 .3rem; font-family:'Cormorant Garamond',Georgia,serif; font-weight:500; font-size:1.4rem;
  color:var(--td-vang-dam); text-align:center; letter-spacing:.04em}
.td-thu .ngay{text-align:center; font-style:italic; color:var(--td-muc-nhat); margin:0 0 1.4rem; font-size:.95rem}
.td-thu p{margin:0 0 .9rem}
.td-thu ul{margin:.2rem 0 1rem 1.2rem}
.td-thu .ky{margin-top:1.6rem; text-align:right; font-style:italic; color:var(--td-muc-nhat)}
.td-thu .ky b{display:block; font-style:normal; color:var(--td-muc-dam); margin-top:.3rem}

@media (max-width:781px){
  .td-quyhero{min-height:auto}
  .td-quyhero__in{padding-top:2.4rem; padding-bottom:2.4rem}
  .td-quyhero h1{font-size:1.8rem}
  .td-quyhero__cta a{flex:1 1 100%; justify-content:center}
  .td-le{padding:1rem}
  .td-le b{font-size:1.9rem}
  .td-gop__hop{padding:1.2rem}
  .td-bia{padding:1.4rem 1.1rem}
  .td-thu{padding:1.3rem 1.1rem}
}

/* ---------- biểu mẫu góp ý (Jetpack Forms) ----------
   Jetpack tự đổ CSS riêng của nó; phần dưới kéo biểu mẫu về đúng bảng màu và cỡ chạm của site.
   Ô nhập 16px trở lên vì dưới mức đó iOS tự phóng to trang khi người dùng chạm vào ô. */
.td-form{margin-top:1.6rem; padding:1.6rem; background:var(--td-giay-sang); border:1px solid var(--td-giay-vien)}
.td-form .grunion-field-label,.td-form label{display:block; font-size:.8rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--td-muc-nhat); margin-bottom:.3rem; font-weight:500}
.td-form input[type=text],.td-form input[type=email],.td-form input[type=tel],.td-form textarea{
  width:100%; min-height:48px; padding:.65rem .8rem; font-family:'Be Vietnam Pro',sans-serif; font-size:16px;
  color:var(--td-muc-dam); background:var(--td-giay); border:1px solid var(--td-giay-vien); border-radius:2px}
.td-form textarea{min-height:8rem; line-height:1.7; resize:vertical}
.td-form :is(input,textarea):focus{outline:2px solid var(--td-vang); outline-offset:1px; background:#fff}
.td-form .grunion-field-wrap,.td-form .contact-form .field{margin-bottom:1rem}
.td-form button[type=submit],.td-form input[type=submit],.td-form .wp-block-button__link{
  min-height:52px; padding:.85rem 1.9rem; font-family:'Be Vietnam Pro',sans-serif; font-size:.9rem; font-weight:500;
  letter-spacing:.12em; text-transform:uppercase; color:var(--td-giay-sang); background:var(--td-vang);
  border:1px solid var(--td-vang); border-radius:2px; cursor:pointer;
  transition:background var(--td-d) var(--td-ease), transform var(--td-d) var(--td-ease)}
.td-form button[type=submit]:hover,.td-form input[type=submit]:hover{background:var(--td-vang-dam); transform:translateY(-1px)}
.td-form .form-errors,.td-form .contact-form-submission{font-size:1rem; color:var(--td-muc)}
@media (min-width:640px){
  /* Chia hai cột theo LOẠI TRƯỜNG chứ không theo nth-child: Jetpack chèn thêm input ẩn và khối
     báo lỗi vào giữa các trường, nên đếm thứ tự là lệch — lần trước ô "Điện thoại" bị kéo rộng
     hết hàng còn ô "Nội dung" thì chỉ còn nửa hàng. */
  .td-form .contact-form{display:grid; grid-template-columns:1fr 1fr; gap:0 1.2rem}
  .td-form .contact-form > :is(.grunion-field-name-wrap, .grunion-field-textarea-wrap,
    .contact-submit, button, p, .contact-form__error){grid-column:1 / -1}
  .td-form .contact-form > input[type=hidden]{display:none}
}