/* Giáo xứ Châu Bình — giao diện công khai (trang chủ, tải phần mềm) */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body { font-family: -apple-system, "Segoe UI", Roboto, Arial, sans-serif; color: #1a1a1a; background: #fff; line-height: 1.5; min-height: 100vh; display: flex; flex-direction: column; }
/* Sticky footer: phần nội dung giãn nở để footer luôn nằm dưới cùng dù nội dung ngắn hay zoom */
.site-header, .site-footer { flex: 0 0 auto; }
main, .home-main, .download-main { flex: 1 0 auto; }
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
a { color: #0b51a6; }

/* Header */
.site-header { background: #0b51a6; color: #fff; padding: 22px 0 18px; }
.site-header .brand { margin: 0; font-size: 30px; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; }
.site-header .brand-sub { margin: 6px 0 14px; font-size: 14px; font-weight: 600; opacity: .95; }
.main-nav { display: flex; gap: 18px; align-items: center; }
.nav-btn { display: inline-block; color: #fff; text-decoration: none; font-weight: 700; font-size: 13px; letter-spacing: .4px; padding: 9px 16px; border-radius: 6px; text-transform: uppercase; }
.nav-btn.active { border: 2px solid #fff; }

/* Trang chủ - tìm kiếm */
.home-main { min-height: 420px; padding-top: 34px; padding-bottom: 60px; }
.search-form { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-start; }
.input-group { display: flex; flex-direction: column; }
.input-group input { width: 220px; max-width: 70vw; padding: 9px 10px; border: 1px solid #c4c4c4; border-radius: 4px; color: #000; font-size: 14px; }
.example { font-size: 12.5px; color: #777; margin-top: 5px; margin-left: 2px; }
.btn-search { height: 38px; align-self: flex-start; margin-top: 0; background: #1666c6; color: #fff; border: 0; border-radius: 5px; padding: 0 22px; font-weight: 700; cursor: pointer; }
.btn-search:hover { background: #0b51a6; }

.kq-title { padding-top: 22px; padding-bottom: 8px; font-size: 18px; }
.note-red { color: #c0392b; font-weight: 700; }
.msg { padding-top: 20px; color: #444; }
.result-table-wrapper { overflow-x: auto; margin-top: 10px; }
.result-table { border-collapse: collapse; width: max-content; min-width: 600px; white-space: nowrap; }
.result-table th, .result-table td { border: 1px solid #ddd; padding: 8px 10px; }
.result-table th { background: #f5f5f5; text-align: left; }
.household-table { border-collapse: collapse; width: 100%; max-width: 640px; margin-top: 12px; }
.household-table th, .household-table td { border: 1px solid #ddd; padding: 8px; text-align: center; }
.household-table th { background: #f5f5f5; }

/* Footer */
.site-footer { margin-top: 40px; background: #f5f6f8; }
.footer-grid { display: flex; gap: 40px; padding: 34px 24px; border-radius: 0; }
.site-footer .container.footer-grid { max-width: 1200px; }
.footer-col { flex: 1; min-width: 0; }
.footer-col h3 { margin: 0 0 12px; font-size: 20px; color: #222; }
.footer-col p { margin: 6px 0; color: #333; font-size: 14.5px; }
.connect { display: flex; gap: 12px; flex-wrap: wrap; }
.fb-btn { display: inline-flex; align-items: center; gap: 8px; background: #1666c6; color: #fff; text-decoration: none; padding: 9px 14px; border-radius: 5px; font-weight: 600; font-size: 14px; }
.fb-btn span { font-weight: 800; }
.fb-btn:hover { background: #0b51a6; }
.mass-table { border-collapse: collapse; width: 100%; font-size: 13px; }
.mass-table th, .mass-table td { border: 1px solid #d6d6d6; padding: 8px 6px; text-align: center; vertical-align: top; }
.mass-table th { background: #fff; font-weight: 700; }
.footer-bar { background: #0b51a6; color: #fff; text-align: center; padding: 14px 0; font-weight: 700; font-size: 14px; }

/* Tải phần mềm */
.download-main { min-height: 420px; padding: 40px 24px; }
.dl-card { max-width: 720px; margin: 0 auto; background: #f7f9fc; border: 1px solid #e1e8f0; border-radius: 10px; padding: 30px; }
.dl-card h2 { margin-top: 0; color: #0b51a6; }
.dl-btn { display: inline-block; background: #1666c6; color: #fff; text-decoration: none; padding: 14px 26px; border-radius: 8px; font-weight: 700; font-size: 16px; margin: 14px 0; }
.dl-btn:hover { background: #0b51a6; }
.dl-note { font-size: 14px; color: #555; }

@media (max-width: 760px) {
  .footer-grid { flex-direction: column; }
  .site-header .brand { font-size: 22px; }
}

/* ===== Tra cứu: form xác minh bước 2 (digger) ===== */
.gx-verify { margin-top: 18px; max-width: 560px; background: #fff; border: 1px solid #e3e8ef; border-radius: 12px; padding: 18px 18px 20px; box-shadow: 0 2px 12px rgba(16,40,80,.07); }
.gx-verify-head { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 16px; }
.gx-check { flex: 0 0 28px; width: 28px; height: 28px; border-radius: 50%; background: #e6f5ec; color: #1a8a3a; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 15px; }
.gx-verify-title { font-weight: 700; color: #1a8a3a; font-size: 15px; line-height: 1.2; }
.gx-verify-sub { color: #5b6675; font-size: 13.5px; margin-top: 3px; line-height: 1.45; }
.gx-fields { display: flex; flex-wrap: wrap; gap: 12px; }
.gx-field { display: flex; flex-direction: column; flex: 1 1 130px; min-width: 120px; }
.gx-field-wide { flex: 1 1 100%; }
.gx-field > label { font-size: 12.5px; font-weight: 600; color: #3a4452; margin-bottom: 6px; }
.gx-field input[type=text] { height: 44px; padding: 0 12px; border: 1px solid #d2d9e3; border-radius: 9px; font-size: 14px; color: #111; background: #fff; transition: border-color .15s, box-shadow .15s; }
.gx-field input[type=text]:focus { outline: none; border-color: #1666c6; box-shadow: 0 0 0 3px rgba(22,102,198,.15); }
.gx-select { position: relative; }
.gx-select::after { content: ""; position: absolute; right: 14px; top: 50%; width: 9px; height: 9px; border-right: 2px solid #6b7685; border-bottom: 2px solid #6b7685; transform: translateY(-65%) rotate(45deg); pointer-events: none; }
.gx-select select { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 100%; height: 44px; padding: 0 36px 0 12px; border: 1px solid #d2d9e3; border-radius: 9px; font-size: 14px; color: #111; background: #fff; cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.gx-select select:hover { border-color: #b3bdca; }
.gx-select select:focus { outline: none; border-color: #1666c6; box-shadow: 0 0 0 3px rgba(22,102,198,.15); }
.gx-verify-btn { margin-top: 18px; width: 100%; height: 46px; border-radius: 9px; font-size: 15px; }
.gx-err { color: #c0392b !important; font-weight: 600; padding-top: 0 !important; margin-bottom: 12px; }
.ket-qua-tim-kiem { margin-top: 18px; }
@media (max-width: 560px) { .gx-verify { padding: 16px 14px; } .gx-field { flex: 1 1 100%; } }