/* ==========================================================================
   Trang ĐỂ LẠI THÔNG TIN (dangky.html) — trang đích cho quảng cáo.
   Chỉ thêm phần riêng của trang này. Mọi biến màu/khoảng cách lấy từ style.css
   (style.css BẮT BUỘC nạp trước file này, kẻo var(--gold) không tồn tại
   → nền trong suốt mà trình duyệt không báo gì. Bẫy đã dính 07/08/2026).
   ========================================================================== */

.dk-hero{ padding:var(--k7) 0 var(--k8) }
.dk-luoi{
  display:grid; grid-template-columns:1fr 460px; gap:var(--k7); align-items:start;
}
.dk-loi h1{ font-size:var(--chu-tieu-de) }
.dk-hop-tien{ margin:var(--k5) 0 }
.dk-hop-tien p{ margin-bottom:var(--k2) }

.dk-gach-nhanh{ list-style:none; margin:0; padding:0; display:grid; gap:var(--k2) }
.dk-gach-nhanh li{ position:relative; padding-left:26px; font-size:var(--chu-nho); color:var(--chu-phu) }
.dk-gach-nhanh li::before{
  content:"✓"; position:absolute; left:0; top:-1px;
  color:var(--xanh); font-weight:var(--dam-manh);
}

/* ---------------- ô điền ---------------- */
.dk-o{
  background:var(--trang); border:1px solid var(--vien); border-radius:var(--bo-to);
  padding:var(--k6); box-shadow:var(--bong-noi); position:sticky; top:84px;
}
.dk-o-tieu-de{ font-size:var(--chu-to); margin-bottom:var(--k2) }
.dk-o form{ margin-top:var(--k5); display:grid; gap:var(--k4) }
.dk-o label{
  display:block; font-size:var(--chu-nho); font-weight:var(--dam-vua); color:var(--nau);
}
.dk-sao{ color:var(--do) }

.dk-o input,
.dk-o select,
.dk-o textarea{
  display:block; width:100%; margin-top:var(--k2);
  font-family:inherit; font-size:var(--chu-thuong); font-weight:var(--dam-thuong);
  color:var(--nau); background:var(--nen);
  border:1px solid var(--vien); border-radius:var(--bo-vua);
  padding:12px 14px; transition:border-color var(--nhanh), box-shadow var(--nhanh);
}
.dk-o textarea{ resize:vertical; min-height:64px }
.dk-o input:focus,
.dk-o select:focus,
.dk-o textarea:focus{
  outline:none; border-color:var(--gold); box-shadow:0 0 0 3px rgba(198,162,61,.18);
}
.dk-o input.sai,
.dk-o select.sai{ border-color:var(--do); background:var(--do-nen) }

.dk-doi{ display:grid; grid-template-columns:1fr 1fr; gap:var(--k4) }

.dk-nut{ width:100%; justify-content:center; margin-top:var(--k2); font-size:var(--chu-thuong) }
.dk-nut[disabled]{ opacity:.6; pointer-events:none }
.dk-cam-ket{ margin:0; text-align:center }

.dk-bao{
  margin:0; padding:12px 14px; border-radius:var(--bo-vua);
  background:var(--do-nen); border:1px solid #EBD2CC; color:var(--do);
  font-size:var(--chu-nho);
}

/* ô bẫy máy tự điền — giấu khỏi mắt người, vẫn nằm trong trang */
.dk-bay{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden }

/* ---------------- màn hình cảm ơn ---------------- */
.dk-xong{ text-align:center; padding:var(--k4) 0 }
.dk-dau-tich{
  width:64px; height:64px; margin:0 auto var(--k4);
  display:flex; align-items:center; justify-content:center;
  border-radius:50%; background:var(--xanh-nen); color:var(--xanh);
  font-size:32px; font-weight:var(--dam-manh);
}
.dk-xong .hang-nut{ justify-content:center; margin-top:var(--k5) }

/* ---------------- ảnh tiệm ---------------- */
.dk-anh{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--k4) }
.dk-anh img{
  width:100%; height:220px; object-fit:cover;
  border-radius:var(--bo-vua); box-shadow:var(--bong-nhe);
}

/* ---------------- màn hình nhỏ ---------------- */
@media (max-width:960px){
  .dk-luoi{ grid-template-columns:1fr; gap:var(--k6) }
  .dk-o{ position:static }
  .dk-loi h1{ font-size:var(--chu-to) }
  .dk-anh{ grid-template-columns:repeat(2,1fr) }
  .dk-anh img{ height:180px }
}
@media (max-width:480px){
  .dk-o{ padding:var(--k5) }
  .dk-doi{ grid-template-columns:1fr }
  .dk-anh img{ height:150px }
}
