/* Mẫu Đỏ Mộc Nâu — thẻ đỏ chữ Hỷ, chữ Mightiest, lịch viền đỏ, khối địa điểm + form xác nhận nền đỏ rượu. */

.t-do-moc-nau {
  --f-might: "SVN-Mightiest", "Cormorant Upright", serif;
  --f-summer: "Summerfun", "Pinyon Script", cursive;
  --f-funky: "NVN Funky Signature", "Pinyon Script", cursive;
  --f-mango: "Black Mango", "Noto Serif Display", Georgia, serif;
  --wine: #7d1f2a;
  --gate-bg: #f7f1ef;
  --accent-strong: #7d1f2a;
}

/* ---------- 1. bìa ---------- */
.t-do-moc-nau .s-hero { height: 799px; }
.t-do-moc-nau .hero-kicker { left: 23px; top: 20px; width: 374px; font-family: var(--f-might); font-size: 25px; line-height: 25px; letter-spacing: 3px; text-align: center; }
.t-do-moc-nau .hero-names { left: 5px; top: 65px; width: 411px; font-family: var(--f-summer); font-size: 20px; line-height: 60px; letter-spacing: 4px; text-align: center; white-space: nowrap; }
.t-do-moc-nau .hero-photo { left: 0; top: 165px; width: 420px; height: 470px; }
.t-do-moc-nau .hero-date { left: 0; top: 679px; width: 420px; font-family: var(--f-mango); font-size: 25px; line-height: 37.5px; letter-spacing: 7px; text-align: center; }
.t-do-moc-nau .hero-chevrons { left: 180px; top: 738px; width: 61px; height: 61px; animation: vela-heart 4s ease-in-out infinite; }

/* ---------- 2. hai gia đình ---------- */
.t-do-moc-nau .s-family { height: 888px; }
.t-do-moc-nau .fam-tag { left: 306px; top: 0; width: 72px; height: 225px; background: var(--wine); }
.t-do-moc-nau .fam-tag__eye { position: absolute; left: 26px; top: 8px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: inset 0 0 0 3px #c9a24a, 0 1px 2px rgba(0, 0, 0, .3); }
.t-do-moc-nau .fam-tag__hy { position: absolute; left: 10px; top: 160px; width: 52px; height: 52px; display: grid; place-items: center; font-family: "Vela Hy", "PingFang SC", "Hiragino Sans GB", "Noto Sans CJK SC", "Noto Sans SC", sans-serif; font-size: 50px; font-weight: 900; line-height: 1; color: #fff; }
.t-do-moc-nau .fam-kicker { left: 39px; top: 46px; width: 210px; font-family: var(--f-might); font-size: 26px; line-height: 26px; letter-spacing: 2px; }
.t-do-moc-nau .fam-line { left: 39px; top: 131px; width: 1.5px; height: 242px; background: #536077; }
.t-do-moc-nau .fam-side, .t-do-moc-nau .fam-parents { left: 44px; width: 240px; font-family: var(--f-cond); font-size: 16px; line-height: 24px; text-transform: uppercase; }
.t-do-moc-nau .fam-side { font-style: italic; }
.t-do-moc-nau .fam-addr { left: 44px; width: 242px; font-family: var(--f-roboto); font-size: 14px; line-height: 20px; }
.t-do-moc-nau .fam-side--groom { top: 142px; }
.t-do-moc-nau .fam-parents--groom { top: 166px; }
.t-do-moc-nau .fam-addr--groom { top: 214px; }
.t-do-moc-nau .fam-side--bride { top: 262px; }
.t-do-moc-nau .fam-parents--bride { top: 286px; }
.t-do-moc-nau .fam-addr--bride { top: 334px; }
.t-do-moc-nau .fam-lead { left: 50px; top: 381px; width: 320px; font-family: var(--f-might); font-size: 20px; line-height: 30px; text-align: center; white-space: nowrap; }
.t-do-moc-nau .fam-full { width: 417px; font-family: var(--f-ephesis); font-size: 40px; line-height: 60px; text-align: center; white-space: nowrap; }
.t-do-moc-nau .fam-full--groom { left: 2px; top: 416px; }
.t-do-moc-nau .fam-full--bride { left: 2px; top: 507px; }
.t-do-moc-nau .fam-and { left: 151px; top: 468px; width: 118px; font-family: var(--f-funky); font-size: 35px; line-height: 52.5px; text-align: center; }
.t-do-moc-nau .fam-photo { left: 0; top: 585px; width: 420px; height: 270px; }
.t-do-moc-nau .fam-fade { left: 0; top: 755px; width: 420px; height: 100px; background: linear-gradient(rgba(255, 255, 255, 0), #fff); }
.t-do-moc-nau .fam-invite { left: 28px; top: 838px; width: 368px; font-family: var(--f-might); font-size: 25px; line-height: 37.5px; text-align: center; text-transform: uppercase; }

/* ---------- 3, 4. lễ / tiệc ---------- */
.t-do-moc-nau .s-event { height: 201px; font-family: Arial, Helvetica, sans-serif; }
.t-do-moc-nau .ev-title { top: 26px; width: 209px; font-family: var(--f-cond); font-size: 23px; line-height: 34.5px; text-transform: uppercase; }
.t-do-moc-nau .ev-rule { top: 42px; width: 200px; height: 1.5px; background: #7a8391; }
.t-do-moc-nau .ev-line { width: 375px; font-size: 15px; line-height: 22.5px; letter-spacing: 1px; }
.t-do-moc-nau .ev-line--1 { top: 67px; }
.t-do-moc-nau .ev-line--2 { top: 98px; }
.t-do-moc-nau .ev-line--3 { top: 131px; font-size: 13px; line-height: 19.5px; font-style: italic; color: rgba(0, 0, 0, .5); }
.t-do-moc-nau .ev-line--4 { top: 158px; }
.t-do-moc-nau .s-event--right .ev-title { left: 13px; }
.t-do-moc-nau .s-event--right .ev-rule { left: 221px; }
.t-do-moc-nau .s-event--right .ev-line { left: 32px; text-align: right; }
.t-do-moc-nau .s-event--left .ev-title { left: 200px; text-align: right; }
.t-do-moc-nau .s-event--left .ev-rule { left: 0; }
.t-do-moc-nau .s-event--left .ev-line { left: 13px; }

/* ---------- 5. lịch ---------- */
.t-do-moc-nau .s-cal { height: 348px; }
.t-do-moc-nau .calb { left: 32px; top: 17px; width: 358px; height: 320px; }
.t-do-moc-nau .calb > * { position: absolute; }
.t-do-moc-nau .calb-title { left: 0; top: 3px; width: 358px; font-family: var(--f-mango); font-size: 23px; line-height: 30px; text-align: center; text-transform: uppercase; }
.t-do-moc-nau .calb-grid { left: 16px; top: 44px; width: 325px; padding: 3px 0 7px; border: 1px solid #c8343d; font-family: var(--f-open); font-size: 13.5px; }
.t-do-moc-nau .calb-row { display: grid; grid-template-columns: repeat(7, 1fr); }
.t-do-moc-nau .calb-row span { position: relative; display: grid; place-items: center; height: 43px; }
.t-do-moc-nau .calb-row--head span, .t-do-moc-nau .calb-row .is-sun { font-weight: 700; }
.t-do-moc-nau .calb-heart { position: absolute; left: 50%; top: 50%; width: 39px; height: 37px; margin: -19px 0 0 -19.5px; animation: vela-pulse 2s ease-in-out infinite; }

/* ---------- 6. địa điểm ---------- */
.t-do-moc-nau .s-place { height: 487px; }
.t-do-moc-nau .place-bar { left: 0; top: 0; width: 421px; height: 48px; background: var(--wine); }
.t-do-moc-nau .place-pin { left: 8px; top: 0; width: 42px; height: 42px; }
.t-do-moc-nau .place-title { left: 13px; top: 2px; width: 395px; font-family: var(--f-might); font-size: 26px; line-height: 39px; color: #fff; text-align: center; }
.t-do-moc-nau .place-name { left: 0; top: 59px; width: 421px; font-family: var(--f-cond); font-size: 20px; line-height: 30px; text-align: center; text-transform: uppercase; }
.t-do-moc-nau .place-addr { left: 26px; top: 99px; width: 368px; font-family: var(--f-barlow); font-size: 14px; line-height: 21px; letter-spacing: 1px; text-align: center; }
.t-do-moc-nau .place-btn {
  left: 140px; top: 158px; width: 140px; height: 32px;
  display: grid; place-items: center;
  border-radius: 42px; background: var(--wine); box-shadow: 0 4px 10px rgba(0, 0, 0, .25);
  font-family: Arial, Helvetica, sans-serif; font-size: 15px; color: #fff; text-decoration: none;
}
.t-do-moc-nau .place-map { left: 33px; top: 219px; width: 355px; height: 235px; background: var(--wine); }
.t-do-moc-nau .place-map iframe { display: block; width: 100%; height: 100%; border: 0; }

/* ---------- 7. xác nhận ---------- */
.t-do-moc-nau .s-rsvp { height: 441px; background: var(--wine); }
.t-do-moc-nau .rsvp-title { left: 54px; top: 10px; width: 304px; font-family: var(--f-might); font-size: 25px; line-height: 25px; color: #fff; text-align: center; }
.t-do-moc-nau .rsvp-card { left: 0; top: 0; width: 420px; height: 441px; margin: 0; }
.t-do-moc-nau .rsvp-card > * { position: absolute; }
.t-do-moc-nau .rsvp-field {
  left: 38px; width: 336px; height: 40px; padding: 0 10px;
  border: 2px solid rgb(57, 71, 58); border-radius: 0; background: #fff;
  font-family: var(--f-roboto); font-size: 14px; color: #333;
  -webkit-appearance: none; appearance: none;
}
.t-do-moc-nau .rsvp-field::placeholder { color: #999; opacity: 1; }
.t-do-moc-nau .rsvp-field--1 { top: 101px; }
.t-do-moc-nau .rsvp-field--2 { top: 154px; }
.t-do-moc-nau .rsvp-field--3 { top: 207px; }
.t-do-moc-nau .rsvp-field--4 {
  top: 257px; color: #999;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Cpath d='M2 5l5 5 5-5' fill='none' stroke='%23777' stroke-width='2'/%3E%3C/svg%3E") right 10px center no-repeat;
}
.t-do-moc-nau .rsvp-send {
  left: 38px; top: 307px; width: 336px; height: 40px;
  border: 0; background: #fff; box-shadow: 0 4px 10px rgba(0, 0, 0, .25);
  font-family: var(--f-roboto); font-size: 16px; font-weight: 700; color: #000; text-transform: uppercase;
}
.t-do-moc-nau .rsvp-msg { left: 20px; right: 20px; top: 352px; font-size: 13px; color: #fff; text-align: center; }
.t-do-moc-nau .rsvp-gift {
  left: 99px; top: 380px; width: 214px; height: 40px;
  border: 0; border-radius: 9px; background: #fff;
  font-family: var(--f-roboto); font-size: 16px; font-weight: 700; color: #000; text-transform: uppercase;
}

/* ---------- 8. album (ghi đè phần chung) ---------- */
.t-do-moc-nau .s-album { padding: 60px 18px 9px; }
.t-do-moc-nau .album-rule { display: none; }
.t-do-moc-nau .album-grid { grid-template-columns: 187px 187px; column-gap: 10px; }

/* ---------- 9. kết ---------- */
.t-do-moc-nau .s-closing { height: 753px; }
.t-do-moc-nau .closing-photo { left: 15px; top: 0; width: 387px; height: 582px; }
.t-do-moc-nau .closing-fade { left: -9px; top: 420px; width: 438px; height: 162px; background: linear-gradient(rgba(255, 255, 255, 0), #fff); }
.t-do-moc-nau .closing-note { left: -5px; top: 587px; width: 427px; font-family: var(--f-might); font-size: 25px; line-height: 25px; text-align: center; }
.t-do-moc-nau .closing-thanks { left: 89px; top: 634px; width: 242px; font-family: var(--f-summer); font-size: 40px; line-height: 120px; text-align: center; }