/* Link riêng cho từng khách (?moi=…): tên khách lấp lánh trên màn mở thiệp; tên khách trong câu mời.
   Khối tên chỉ hiện khi mở bằng link riêng: đoạn script ngay sau màn mở thiệp bỏ thuộc tính hidden. */
.cover__guest { position: relative; width: min(100%, 360px); margin-top: 6px; }
.cover__guest[hidden] { display: none; }
.cover__guest-label {
  display: flex; align-items: center; justify-content: center; gap: 12px;
  font: 400 12px/1 var(--serif); letter-spacing: .36em; padding-left: .36em; opacity: .92; white-space: nowrap;
}
/* Gạch vàng hai bên co lại trên màn hẹp, để chữ luôn nằm một dòng */
.cover__guest-label::before, .cover__guest-label::after { content: ''; flex: 0 1 28px; height: 1px; background: linear-gradient(90deg, rgba(230, 200, 120, 0), #e6c878); }
.cover__guest-label::after { background: linear-gradient(90deg, #e6c878, rgba(230, 200, 120, 0)); }
.cover__guest-name { position: relative; z-index: 0; margin-top: 12px; font: 400 clamp(40px, 11.5vw, 58px)/1.14 var(--script); text-wrap: balance; }
.cover__guest.is-long .cover__guest-name { font-size: clamp(34px, 9.6vw, 48px); }
.cover__guest.is-xlong .cover__guest-name { font-size: clamp(28px, 7.8vw, 40px); }
/* Quầng sáng vàng rất nhẹ phía sau tên, sáng lên rồi dịu xuống */
.cover__guest-name::before {
  content: ''; position: absolute; inset: 8% -8%; z-index: -1;
  background: radial-gradient(closest-side, rgba(255, 214, 140, .2), rgba(255, 214, 140, 0));
  animation: guest-halo 3.6s ease-in-out infinite alternate;
}
/* Viền sáng vàng quanh nét chữ và bóng tối mảnh cho dễ đọc trên nền ảnh.
   Đặt ở lớp ngoài: Safari vẽ sai khi filter nằm cùng phần tử với background-clip: text. */
.cover__guest-glow { display: block; filter: drop-shadow(0 0 10px rgba(255, 206, 120, .38)) drop-shadow(0 2px 8px rgba(0, 0, 0, .5)); }
/* Chữ vàng ánh kim, vệt sáng chạy ngang qua chữ */
.cover__guest-text {
  background: linear-gradient(110deg, #c9973e 0%, #f1d48a 20%, #fffaf0 28%, #f1d48a 36%, #c9973e 50%, #e8c575 70%, #c9973e 100%) 0 0 / 200% 100%;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
  animation: guest-shine 3.6s linear infinite;
}
@keyframes guest-shine { to { background-position: -200% 0; } }
@keyframes guest-halo { from { opacity: .55; transform: scale(.96); } to { opacity: 1; transform: scale(1.04); } }
/* Đốm sáng hình sao: guest.js thêm, đổi chỗ sau mỗi lần nhấp nháy */
.cover__sparkles { position: absolute; inset: -10px -14px; pointer-events: none; }
.spark {
  position: absolute; left: var(--x); top: var(--y); width: var(--s); height: var(--s);
  margin: calc(var(--s) / -2) 0 0 calc(var(--s) / -2);
  fill: #fff7de; filter: drop-shadow(0 0 3px rgba(255, 224, 150, .95));
  opacity: 0; animation: guest-twinkle var(--t) ease-in-out var(--d) infinite;
}
@keyframes guest-twinkle {
  0%, 100% { opacity: 0; transform: scale(.2) rotate(0deg); }
  50% { opacity: 1; transform: scale(1) rotate(90deg); }
}

/* Màn rất hẹp (dưới 360px): chữ "TRÂN TRỌNG KÍNH MỜI" giãn ít hơn cho vừa một dòng */
@media (max-width: 359px) {
  .cover__guest-label { gap: 8px; letter-spacing: .28em; padding-left: .28em; }
}
/* Màn hình thấp: gọn logo và khoảng cách để tên dài vẫn vừa (từ 320×568) */
@media (max-height: 700px) {
  .cover.has-guest .cover__inner { gap: 8px; }
  .cover.has-guest .cover__logo { width: 76px; }
  .cover.has-guest .cover__btn { margin-top: 16px; }
}
/* MacBook: to hơn cho cân với tên cô dâu chú rể 88px */
@media (min-width: 1024px) {
  .cover__guest { width: 480px; }
  .cover__guest-label { font-size: 14px; }
  .cover__guest-name { font-size: 64px; }
  .cover__guest.is-long .cover__guest-name { font-size: 54px; }
  .cover__guest.is-xlong .cover__guest-name { font-size: 44px; }
}
/* Giảm chuyển động: chữ vàng đứng yên, không quầng nhấp nháy (guest.js cũng không thêm đốm sáng) */
@media (prefers-reduced-motion: reduce) {
  .cover__guest-text, .cover__guest-name::before { animation: none; }
}

/* Câu mời trong thiệp: tên khách thay cho "QUÝ KHÁCH" */
.family__guest.is-guest {
  font-weight: 600;
  text-decoration-line: underline; text-decoration-color: #c9a24a; text-decoration-thickness: 1px; text-underline-offset: 4px;
}
