/* ========================================================
   12. RESPONSIVE
   Khung thiệp --app-width (900px); nội dung --content-width (560px).
   ======================================================== */
@media (max-width: 360px) {
  :root { --gutter: 20px; }
  .ceremony-time-badge .date-big { font-size: 72px; }
  .ceremony-date-box { min-width: 60px; }
  .count-box .num { font-size: 32px; }
}

@media (min-width: 768px) {
  .app-container { box-shadow: 0 0 40px rgba(38, 70, 83, 0.12); }
}

/* Tên & địa chỉ địa điểm thu nhỏ đồng bộ cho mọi khối trên điện thoại */
@media (max-width: 480px) {
  :root {
    --venue-name-size: 24px;
    --venue-address-size: 13px;
  }
}

/* Câu báo tin ở khối lễ cưới: giảm giãn chữ để vừa 2 dòng trên điện thoại */
@media (max-width: 480px) {
  .announcement-text { letter-spacing: 2px; }
}