*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f1ebe2;color:#23313a;font-family:"Noto Sans TC","PingFang TC",sans-serif}.hero{height:100svh;min-height:640px;position:relative;overflow:hidden;background:#24322e}.hero-image{width:100%;height:100%;object-fit:cover;display:block}.hero-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(22,27,24,.15),rgba(22,27,24,.38))}.hero-content{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;padding:30px}.hero-kicker,.eyebrow{font-size:10px;letter-spacing:.32em}.hero-content h1{font:400 clamp(46px,13vw,88px)/.95 Georgia,serif;display:flex;flex-direction:column;margin:20px 0 14px;text-transform:uppercase}.hero-content h1 em{font-size:.4em;font-weight:400;margin:.2em 0}.hero-date{letter-spacing:.22em;font-size:12px}.scroll-mark{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);width:34px;height:34px;display:flex;align-items:center;justify-content:center}.section{padding:88px 24px;text-align:center;max-width:780px;margin:0 auto}.section-no{font:12px Georgia,serif;color:#a89278;margin-bottom:18px}.section h2{font:400 32px/1.35 Georgia,"Noto Serif TC",serif;margin:12px 0 28px}.body-copy{white-space:pre-line;line-height:2.1;color:#66605a;font-size:14px;max-width:560px;margin:0 auto}.names-cn{display:flex;align-items:center;justify-content:center;gap:18px;margin:28px 0 32px;font:400 22px Georgia,"Noto Serif TC",serif}.names-cn i{font-size:12px;color:#b29b7e}.story-section{padding-left:0;padding-right:0}.story-photo-wrap{width:86%;margin:0 auto 55px}.story-photo{display:block;width:100%;aspect-ratio:4/5;object-fit:cover}.story-copy{padding:0 24px}.story-dates{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:38px auto 0;max-width:520px;border-top:1px solid #cfc3b5;border-bottom:1px solid #cfc3b5;padding:20px 0}.story-dates div{display:flex;flex-direction:column;gap:7px}.story-dates small,.schedule span{font-size:8px;letter-spacing:.15em;color:#998b7a}.story-dates strong{font:400 14px Georgia,serif}.countdown{background:#25352f;color:#f5f0e8;max-width:none}.countdown .eyebrow,.countdown .section-no{color:#cab89f}.count-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;max-width:650px;margin:0 auto}.count-grid div{border-left:1px solid rgba(255,255,255,.25)}.count-grid div:first-child{border-left:0}.count-grid strong{display:block;font:400 clamp(28px,8vw,48px) Georgia,serif}.count-grid span{font-size:7px;letter-spacing:.15em}.date-display{font:400 22px Georgia,serif;letter-spacing:.08em;margin:25px 0}.schedule{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:28px 0 36px}.schedule div{display:flex;flex-direction:column;gap:7px}.schedule strong{font:400 19px Georgia,serif}.venue-section h3{font:500 19px "Noto Serif TC",serif;margin-bottom:6px}.line-btn{display:inline-block;color:#243540;text-decoration:none;border-bottom:1px solid #243540;padding-bottom:5px;margin-top:20px;font-size:10px;letter-spacing:.13em}.gallery-section{max-width:900px}.gallery-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.gallery-grid img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block}.gallery-grid img:nth-child(3n){grid-column:1/-1;aspect-ratio:16/11}.rsvp-section{background:#e3d5c4;max-width:none}.rsvp-section form{max-width:520px;margin:0 auto;text-align:left}.rsvp-section label{display:block;font-size:12px;margin:14px 0}.rsvp-section input,.rsvp-section textarea,.rsvp-section select{width:100%;margin-top:7px;border:0;border-bottom:1px solid #b7a58f;background:transparent;padding:10px 2px;outline:none}.rsvp-btn{width:100%;border:0;background:#25352f;color:#fff;padding:15px;margin-top:22px;letter-spacing:.15em}.rsvp-section #rsvpMessage{text-align:center;font-size:13px}footer{text-align:center;background:#243540;color:#f7f2eb;padding:80px 20px}footer p,footer small{font-size:9px;letter-spacing:.25em}footer h2{font:400 33px Georgia,serif;margin:24px 0 14px}.music-btn{position:fixed;right:16px;top:16px;z-index:50;width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.6);background:rgba(34,45,41,.6);color:#fff;backdrop-filter:blur(8px);cursor:pointer}.muted{color:#81776d}@media(min-width:800px){body{background:#ded6cc}#invitationRoot{width:520px;margin:0 auto;background:#f1ebe2;box-shadow:0 0 80px rgba(0,0,0,.12)}.music-btn{right:calc(50% - 244px)}}
body[data-template="style02"]{background:#f5e6e4;color:#4b2f33}body[data-template="style02"] #invitationRoot{background:#f8ecea}body[data-template="style02"] .countdown,body[data-template="style02"] footer{background:#9b5d64}body[data-template="style02"] .rsvp-section{background:#ecd4d2}body[data-template="style02"] .line-btn{color:#6d4046;border-color:#6d4046}
body[data-template="style03"]{background:#e8e8e5;color:#202326}body[data-template="style03"] #invitationRoot{background:#f4f4f1}body[data-template="style03"] .countdown,body[data-template="style03"] footer{background:#202326}body[data-template="style03"] .rsvp-section{background:#dededa}body[data-template="style03"] .hero-overlay{background:linear-gradient(to bottom,rgba(0,0,0,.18),rgba(0,0,0,.58))}body[data-template="style03"] .section h2,body[data-template="style03"] footer h2{font-family:Arial,"Noto Sans TC",sans-serif;font-weight:500;letter-spacing:-.03em}

.guest-greeting{font-size:12px;letter-spacing:.08em;color:#9a8064;margin:0 0 12px}

/* V5 — hero scroll cue */
.scroll-chevron{
  display:block;
  width:14px;
  height:14px;
  border-right:1.5px solid rgba(255,255,255,.92);
  border-bottom:1.5px solid rgba(255,255,255,.92);
  transform:rotate(45deg);
  animation:beScrollCue 1.8s ease-in-out infinite;
  filter:drop-shadow(0 1px 3px rgba(0,0,0,.18));
}
@keyframes beScrollCue{
  0%,100%{transform:translateY(-4px) rotate(45deg);opacity:.45}
  50%{transform:translateY(5px) rotate(45deg);opacity:1}
}

/* V5 — STYLE 01 commercial polish */
body[data-template="style01"] .hero-content{
  padding-left:34px;
  padding-right:34px;
}
body[data-template="style01"] .hero-content h1{
  letter-spacing:.015em;
  text-shadow:0 2px 18px rgba(0,0,0,.12);
}
body[data-template="style01"] .hero-kicker{
  font-size:9px;
  letter-spacing:.34em;
  opacity:.94;
}
body[data-template="style01"] .hero-date{
  font-family:Georgia,"Times New Roman",serif;
  letter-spacing:.2em;
  font-size:13px;
}
body[data-template="style01"] .invitation-section{
  padding-top:102px;
  padding-bottom:102px;
}
body[data-template="style01"] .section h2{
  letter-spacing:.01em;
}
body[data-template="style01"] .gallery-grid{
  gap:7px;
}
body[data-template="style01"] .gallery-grid img{
  transition:transform .45s ease, opacity .45s ease;
}
@media (hover:hover){
  body[data-template="style01"] .gallery-grid img:hover{
    transform:scale(1.015);
  }
}
@media(prefers-reduced-motion:reduce){
  .scroll-chevron{animation:none}
  body[data-template="style01"] .gallery-grid img{transition:none}
}

/* V6 — 主婚人區塊 */
.honorees{
  width:min(100%,560px);
  margin:0 auto 34px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 1px minmax(0,1fr);
  align-items:start;
  gap:18px;
}
.honoree-side{
  min-width:0;
  text-align:center;
}
.honoree-label{
  margin-bottom:12px;
  color:#9d8267;
  font-size:9px;
  letter-spacing:.18em;
}
.honoree-row{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:4px 13px;
  min-height:20px;
  margin:5px 0;
  color:#4d4944;
  font-family:"Noto Serif TC",Georgia,serif;
  font-size:13px;
  line-height:1.75;
}
.honoree-row span:empty{
  display:none;
}
.honoree-divider{
  width:1px;
  min-height:70px;
  margin-top:4px;
  background:#d8cec1;
}
.elder-row{
  color:#796f64;
}
.invitation-section .body-copy{
  width:min(100%,560px);
  max-width:560px;
  padding-left:0;
  padding-right:0;
  margin-top:6px;
}
@media(max-width:430px){
  .honorees{
    gap:11px;
    width:100%;
    margin-bottom:30px;
  }
  .honoree-row{
    gap:2px 8px;
    font-size:12px;
    line-height:1.65;
  }
  .honoree-label{
    font-size:8px;
    margin-bottom:9px;
  }
  .honoree-divider{
    min-height:64px;
  }
  .invitation-section{
    padding-left:20px;
    padding-right:20px;
  }
  .invitation-section .body-copy{
    width:100%;
    max-width:100%;
    font-size:13px;
    line-height:2;
  }
}

/* V7 — Google Map */
.map-embed-wrap{
  width:100%;
  max-width:560px;
  margin:34px auto 0;
  border-radius:2px;
  overflow:hidden;
  background:#ded6cc;
  aspect-ratio:16/9;
}
.map-embed-wrap iframe{
  display:block;
  width:100%;
  height:100%;
  border:0;
  filter:saturate(.82) contrast(.96);
}
@media(max-width:430px){
  .map-embed-wrap{
    margin-top:28px;
    aspect-ratio:4/3;
  }
}

/* V8 — 地圖載入與主婚人修正 */
.map-embed-wrap{
  position:relative;
  min-height:220px;
  background:
    linear-gradient(rgba(241,235,226,.86),rgba(241,235,226,.86)),
    repeating-linear-gradient(45deg,#ddd3c6 0,#ddd3c6 1px,transparent 1px,transparent 12px);
}
.map-embed-wrap::before{
  content:"GOOGLE MAP";
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#a08f7d;
  font-size:9px;
  letter-spacing:.22em;
  pointer-events:none;
}
.map-embed-wrap iframe{
  position:relative;
  z-index:1;
  background:#f1ebe2;
}
.honoree-row span{
  display:inline-block;
  white-space:nowrap;
}

/* V9 — 愛情故事日期為選填 */
.story-dates > div:only-child{
  grid-column:1 / -1;
}
.story-dates:has(> div[style*="display: none"]) > div:not([style*="display: none"]){
  grid-column:1 / -1;
}

/* V10 — YouTube / MP3 背景音樂 */
.youtube-player-host{
  position:fixed;
  width:1px;
  height:1px;
  overflow:hidden;
  opacity:.001;
  pointer-events:none;
  left:-9999px;
  top:-9999px;
}
.music-btn{
  transition:transform .25s ease, background .25s ease, opacity .25s ease;
}
.music-btn.is-playing{
  animation:beMusicPulse 2.2s ease-in-out infinite;
}
@keyframes beMusicPulse{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.07)}
}
@media(prefers-reduced-motion:reduce){
  .music-btn.is-playing{animation:none}
}

.external-rsvp-section{background:#ebe2d6;max-width:none;}
.external-rsvp-copy{max-width:440px;margin-bottom:30px;}
.external-rsvp-btn{
  display:inline-block;min-width:220px;padding:15px 24px;
  border:1px solid #283a42;color:#283a42;text-decoration:none;
  font-size:10px;letter-spacing:.16em;transition:background .25s ease,color .25s ease;
}
@media(hover:hover){
  .external-rsvp-btn:hover{background:#283a42;color:#fff;}
}
body[data-template="style02"] .external-rsvp-section{background:#ecd9d6;}
body[data-template="style02"] .external-rsvp-btn{border-color:#7e4c52;color:#7e4c52;}
body[data-template="style03"] .external-rsvp-section{background:#e2e2de;}
@media(max-width:430px){
  .external-rsvp-btn{width:100%;max-width:310px;}
}


/* =========================================================
   V12 — TEMPLATE 02 / ROSE ATELIER
   Romantic editorial, soft rose + ivory, arch photography
========================================================= */
body[data-template="style02"]{
  background:#eadeda;
  color:#513c40;
}
body[data-template="style02"] #invitationRoot{
  background:#f8f0ed;
}
body[data-template="style02"] .hero{
  background:#a76b73;
  padding:7vh 28px 8vh;
  display:flex;
  align-items:center;
  justify-content:center;
}
body[data-template="style02"] .hero-image{
  width:min(82%,420px);
  height:72%;
  min-height:500px;
  object-fit:cover;
  border-radius:210px 210px 8px 8px;
  box-shadow:0 24px 60px rgba(86,49,55,.22);
}
body[data-template="style02"] .hero-overlay{
  background:linear-gradient(to bottom,rgba(73,42,47,.06),rgba(73,42,47,.34));
}
body[data-template="style02"] .hero-content{
  justify-content:flex-end;
  padding:0 38px 64px;
}
body[data-template="style02"] .hero-content h1{
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(42px,11vw,74px);
  line-height:.92;
  text-transform:none;
  letter-spacing:-.035em;
}
body[data-template="style02"] .hero-content h1 span{
  text-transform:capitalize;
}
body[data-template="style02"] .hero-content h1 em{
  font-style:italic;
  font-size:.42em;
  margin:.3em 0;
}
body[data-template="style02"] .hero-kicker{
  letter-spacing:.28em;
}
body[data-template="style02"] .scroll-chevron{
  border-color:rgba(255,255,255,.9);
}
body[data-template="style02"] .template-deco.deco-a{
  position:absolute;
  z-index:2;
  width:120px;
  height:120px;
  border:1px solid rgba(255,255,255,.38);
  border-radius:50%;
  left:22px;
  top:52px;
}
body[data-template="style02"] .template-deco.deco-b{
  position:absolute;
  z-index:2;
  width:82px;
  height:82px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:50%;
  right:24px;
  bottom:90px;
}
body[data-template="style02"] .section{
  padding-top:105px;
  padding-bottom:105px;
}
body[data-template="style02"] .section-no{
  color:#ad7980;
}
body[data-template="style02"] .eyebrow{
  color:#a76b73;
}
body[data-template="style02"] .section h2{
  color:#513c40;
  font-size:36px;
  font-style:italic;
}
body[data-template="style02"] .names-cn{
  font-size:21px;
}
body[data-template="style02"] .honorees{
  max-width:500px;
}
body[data-template="style02"] .honoree-label{
  color:#a76b73;
}
body[data-template="style02"] .story-section{
  padding-top:35px;
}
body[data-template="style02"] .story-photo-wrap{
  width:74%;
  position:relative;
  margin-bottom:70px;
}
body[data-template="style02"] .story-photo-wrap::before{
  content:"";
  position:absolute;
  inset:-16px 18px 16px -18px;
  border:1px solid #cbaeb1;
  pointer-events:none;
}
body[data-template="style02"] .story-photo{
  aspect-ratio:3/4;
}
body[data-template="style02"] .story-dates{
  border-color:#cdb5b4;
}
body[data-template="style02"] .countdown{
  background:#a76b73;
  color:#fffaf7;
}
body[data-template="style02"] .countdown h2{
  color:#fffaf7;
}
body[data-template="style02"] .count-grid div{
  border-left-color:rgba(255,255,255,.32);
}
body[data-template="style02"] .venue-section{
  position:relative;
}
body[data-template="style02"] .venue-section::before{
  content:"";
  display:block;
  width:38px;
  height:1px;
  background:#a76b73;
  margin:0 auto 34px;
}
body[data-template="style02"] .line-btn{
  color:#7d4f55;
  border-color:#7d4f55;
}
body[data-template="style02"] .map-embed-wrap{
  border-radius:150px 150px 6px 6px;
  overflow:hidden;
  max-width:430px;
}
body[data-template="style02"] .gallery-grid{
  grid-template-columns:1fr 1fr;
  gap:14px;
}
body[data-template="style02"] .gallery-grid img{
  border-radius:120px 120px 4px 4px;
}
body[data-template="style02"] .gallery-grid img:nth-child(3n){
  border-radius:4px;
}
body[data-template="style02"] .external-rsvp-section{
  background:#ead4d3;
}
body[data-template="style02"] .rsvp-section{
  background:#dfc3c2;
}
body[data-template="style02"] footer{
  background:#7d4f55;
}
body[data-template="style02"] footer h2{
  font-style:italic;
}
body[data-template="style02"] .footer-editorial-word{
  display:block;
  font:italic 48px/1 Georgia,serif;
  opacity:.12;
  margin-bottom:34px;
  letter-spacing:.06em;
}


/* =========================================================
   V12 — TEMPLATE 03 / BLACK & WHITE
   High-fashion editorial, asymmetric, monochrome
========================================================= */
body[data-template="style03"]{
  background:#d7d7d2;
  color:#17191a;
}
body[data-template="style03"] #invitationRoot{
  background:#f5f5f1;
}
body[data-template="style03"] .hero{
  background:#111315;
  height:100svh;
}
body[data-template="style03"] .hero-image{
  width:100%;
  height:72%;
  position:absolute;
  top:0;
  left:0;
  filter:grayscale(1) contrast(1.06);
}
body[data-template="style03"] .hero-overlay{
  background:linear-gradient(to bottom,rgba(0,0,0,.02) 0 58%,rgba(0,0,0,.94) 78%);
}
body[data-template="style03"] .hero-content{
  align-items:flex-start;
  justify-content:flex-end;
  text-align:left;
  padding:0 28px 60px;
}
body[data-template="style03"] .hero-kicker{
  order:2;
  color:#fff;
  margin-top:14px;
  letter-spacing:.22em;
}
body[data-template="style03"] .hero-content h1{
  order:1;
  display:block;
  margin:0;
  width:100%;
  font-family:Arial,"Noto Sans TC",sans-serif;
  font-weight:700;
  font-size:clamp(52px,14vw,88px);
  line-height:.78;
  letter-spacing:-.075em;
}
body[data-template="style03"] .hero-content h1 span{
  display:block;
}
body[data-template="style03"] .hero-content h1 em{
  display:block;
  font:italic 400 .33em Georgia,serif;
  margin:.4em 0;
  letter-spacing:0;
}
body[data-template="style03"] .hero-date{
  order:3;
  margin-top:20px;
  border-top:1px solid rgba(255,255,255,.5);
  padding-top:15px;
  width:100%;
  font-family:Arial,sans-serif;
}
body[data-template="style03"] .scroll-mark{
  left:auto;
  right:20px;
  transform:none;
}
body[data-template="style03"] .template-deco.deco-a{
  position:absolute;
  z-index:3;
  top:28px;
  left:25px;
  width:60px;
  height:60px;
  border-top:1px solid #fff;
  border-left:1px solid #fff;
}
body[data-template="style03"] .template-deco.deco-b{
  position:absolute;
  z-index:3;
  top:28px;
  right:25px;
  width:60px;
  height:60px;
  border-top:1px solid #fff;
  border-right:1px solid #fff;
}
body[data-template="style03"] .section{
  text-align:left;
  padding-left:28px;
  padding-right:28px;
}
body[data-template="style03"] .section-no,
body[data-template="style03"] .eyebrow{
  color:#17191a;
}
body[data-template="style03"] .section h2{
  font-family:Arial,"Noto Sans TC",sans-serif;
  font-size:42px;
  line-height:1.03;
  letter-spacing:-.045em;
  max-width:430px;
}
body[data-template="style03"] .names-cn{
  justify-content:flex-start;
  font-family:Arial,"Noto Sans TC",sans-serif;
  font-size:23px;
  font-weight:600;
}
body[data-template="style03"] .body-copy{
  margin-left:0;
  max-width:470px;
}
body[data-template="style03"] .honorees{
  margin-left:0;
  max-width:500px;
  text-align:left;
}
body[data-template="style03"] .honoree-side{
  text-align:left;
}
body[data-template="style03"] .honoree-row{
  justify-content:flex-start;
  font-family:Arial,"Noto Sans TC",sans-serif;
}
body[data-template="style03"] .story-section{
  display:grid;
  grid-template-columns:42% 58%;
  max-width:900px;
  padding:0;
  min-height:720px;
}
body[data-template="style03"] .story-photo-wrap{
  width:100%;
  height:100%;
  margin:0;
}
body[data-template="style03"] .story-photo{
  height:100%;
  aspect-ratio:auto;
  filter:grayscale(1);
}
body[data-template="style03"] .story-copy{
  padding:80px 34px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
body[data-template="style03"] .story-dates{
  margin-left:0;
  width:100%;
}
body[data-template="style03"] .countdown{
  background:#111315;
  color:#fff;
  text-align:left;
}
body[data-template="style03"] .countdown .section-no,
body[data-template="style03"] .countdown .eyebrow,
body[data-template="style03"] .countdown h2{
  color:#fff;
}
body[data-template="style03"] .count-grid{
  margin-left:0;
  max-width:560px;
}
body[data-template="style03"] .count-grid div{
  text-align:left;
  padding-left:13px;
}
body[data-template="style03"] .count-grid div:first-child{
  padding-left:0;
}
body[data-template="style03"] .venue-section{
  text-align:left;
}
body[data-template="style03"] .schedule{
  max-width:430px;
}
body[data-template="style03"] .date-display{
  font-family:Arial,"Noto Sans TC",sans-serif;
  font-size:19px;
}
body[data-template="style03"] .line-btn{
  color:#17191a;
  border-color:#17191a;
}
body[data-template="style03"] .map-embed-wrap{
  margin-left:0;
  max-width:100%;
  border-radius:0;
  border:1px solid #17191a;
}
body[data-template="style03"] .gallery-section{
  max-width:900px;
}
body[data-template="style03"] .gallery-grid{
  grid-template-columns:2fr 1fr;
  gap:4px;
}
body[data-template="style03"] .gallery-grid img{
  filter:grayscale(1);
  aspect-ratio:3/4;
}
body[data-template="style03"] .gallery-grid img:nth-child(3n){
  grid-column:auto;
  aspect-ratio:3/4;
}
body[data-template="style03"] .gallery-grid img:nth-child(4n+1){
  grid-row:span 2;
  height:100%;
}
body[data-template="style03"] .external-rsvp-section{
  background:#e1e1dc;
}
body[data-template="style03"] .external-rsvp-btn{
  border-color:#17191a;
  color:#17191a;
}
body[data-template="style03"] .rsvp-section{
  background:#d8d8d2;
}
body[data-template="style03"] footer{
  background:#111315;
  text-align:left;
  padding-left:30px;
}
body[data-template="style03"] footer h2{
  font-family:Arial,"Noto Sans TC",sans-serif;
  font-weight:700;
  font-size:46px;
  letter-spacing:-.045em;
}
body[data-template="style03"] .footer-editorial-word{
  display:block;
  font:bold 72px/.8 Arial,sans-serif;
  letter-spacing:-.075em;
  opacity:.08;
  margin-bottom:34px;
}

@media(max-width:520px){
  body[data-template="style03"] .story-section{
    display:block;
    min-height:0;
  }
  body[data-template="style03"] .story-photo-wrap{
    height:auto;
  }
  body[data-template="style03"] .story-photo{
    aspect-ratio:4/5;
    height:auto;
  }
  body[data-template="style03"] .story-copy{
    padding:72px 28px;
  }
  body[data-template="style03"] .section h2{
    font-size:36px;
  }
  body[data-template="style03"] .gallery-grid{
    grid-template-columns:1fr 1fr;
  }
  body[data-template="style03"] .gallery-grid img:nth-child(4n+1){
    grid-row:auto;
  }
}


/* =========================================================
   STYLE 04 — SAGE MANOR
   European garden / botanical / quiet luxury
========================================================= */
body[data-template="style04"]{
  background:#dcded5;
  color:#39423a;
}
body[data-template="style04"] #invitationRoot{
  background:#f3f0e8;
}
body[data-template="style04"] .hero{
  background:#6f806f;
  padding:24px;
}
body[data-template="style04"] .hero-image{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:220px 220px 0 0;
  box-shadow:0 18px 55px rgba(48,63,51,.18);
}
body[data-template="style04"] .hero-overlay{
  background:linear-gradient(to bottom,rgba(32,50,37,.06),rgba(32,50,37,.42));
}
body[data-template="style04"] .hero-content{
  justify-content:flex-end;
  padding:40px 34px 68px;
}
body[data-template="style04"] .hero-content h1{
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(44px,12vw,78px);
  font-style:italic;
  line-height:.92;
  text-transform:none;
}
body[data-template="style04"] .hero-kicker{
  color:#f5f1e8;
}
body[data-template="style04"] .template-deco.deco-a{
  position:absolute;z-index:2;left:18px;top:22px;width:70px;height:110px;
  border-left:1px solid rgba(255,255,255,.55);
  border-top:1px solid rgba(255,255,255,.55);
  border-radius:60px 0 0 0;
}
body[data-template="style04"] .template-deco.deco-b{
  position:absolute;z-index:2;right:18px;bottom:22px;width:70px;height:110px;
  border-right:1px solid rgba(255,255,255,.45);
  border-bottom:1px solid rgba(255,255,255,.45);
  border-radius:0 0 60px 0;
}
body[data-template="style04"] .section{
  padding-top:100px;
  padding-bottom:100px;
}
body[data-template="style04"] .eyebrow,
body[data-template="style04"] .section-no{
  color:#71806f;
}
body[data-template="style04"] .section h2{
  font-size:35px;
  color:#39423a;
}
body[data-template="style04"] .names-cn{
  color:#455045;
}
body[data-template="style04"] .story-photo-wrap{
  width:82%;
}
body[data-template="style04"] .story-photo{
  border-radius:180px 180px 0 0;
}
body[data-template="style04"] .story-dates{
  border-color:#a8b0a2;
}
body[data-template="style04"] .countdown{
  background:#71806f;
}
body[data-template="style04"] .countdown h2{
  color:#f4f1e9;
}
body[data-template="style04"] .venue-section{
  background:#ece9df;
}
body[data-template="style04"] .map-embed-wrap{
  border-radius:180px 180px 8px 8px;
  overflow:hidden;
}
body[data-template="style04"] .gallery-grid{
  gap:10px;
}
body[data-template="style04"] .gallery-grid img{
  border-radius:110px 110px 0 0;
}
body[data-template="style04"] .gallery-grid img:nth-child(3n){
  border-radius:0;
}
body[data-template="style04"] .external-rsvp-section{
  background:#dde2d9;
}
body[data-template="style04"] .external-rsvp-btn{
  border-color:#536153;color:#536153;
}
body[data-template="style04"] .rsvp-section{
  background:#cfd7cc;
}
body[data-template="style04"] footer{
  background:#4e5b50;
}
body[data-template="style04"] .footer-editorial-word{
  display:block;
  font:italic 54px/1 Georgia,serif;
  opacity:.09;
  margin-bottom:34px;
}


/* =========================================================
   STYLE 05 — ROUGE CINEMA
   Burgundy / cinematic / dramatic luxury
========================================================= */
body[data-template="style05"]{
  background:#2b1a1f;
  color:#541d29;
}
body[data-template="style05"] #invitationRoot{
  background:#f4e8e0;
}
body[data-template="style05"] .hero{
  background:#641f2d;
}
body[data-template="style05"] .hero-image{
  filter:saturate(.82) contrast(1.04);
}
body[data-template="style05"] .hero-overlay{
  background:linear-gradient(to bottom,rgba(70,13,27,.08),rgba(56,8,21,.65));
}
body[data-template="style05"] .hero-content{
  justify-content:flex-end;
  padding:0 28px 62px;
}
body[data-template="style05"] .hero-content h1{
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(48px,13vw,82px);
  font-weight:400;
  line-height:.88;
  text-transform:uppercase;
  letter-spacing:.01em;
}
body[data-template="style05"] .hero-content h1 em{
  color:#f0b9a7;
}
body[data-template="style05"] .hero-date{
  color:#f0d8ce;
}
body[data-template="style05"] .template-deco.deco-a,
body[data-template="style05"] .template-deco.deco-b{
  position:absolute;z-index:3;width:42px;height:42px;border:1px solid rgba(255,230,218,.65);
}
body[data-template="style05"] .template-deco.deco-a{left:22px;top:22px;border-right:0;border-bottom:0}
body[data-template="style05"] .template-deco.deco-b{right:22px;bottom:22px;border-left:0;border-top:0}
body[data-template="style05"] .section{
  padding-top:96px;
  padding-bottom:96px;
}
body[data-template="style05"] .eyebrow,
body[data-template="style05"] .section-no{
  color:#9a4b58;
}
body[data-template="style05"] .section h2{
  color:#541d29;
  font-size:36px;
}
body[data-template="style05"] .invitation-section{
  position:relative;
}
body[data-template="style05"] .invitation-section::before{
  content:"";
  display:block;
  width:1px;
  height:54px;
  background:#9a4b58;
  margin:0 auto 34px;
}
body[data-template="style05"] .story-section{
  background:#7a2635;
  color:#f7eae3;
}
body[data-template="style05"] .story-section .eyebrow,
body[data-template="style05"] .story-section .section-no,
body[data-template="style05"] .story-section h2,
body[data-template="style05"] .story-section .body-copy,
body[data-template="style05"] .story-section small,
body[data-template="style05"] .story-section strong{
  color:#f6e6de;
}
body[data-template="style05"] .story-photo-wrap{
  width:78%;
}
body[data-template="style05"] .story-photo{
  border:8px solid #f0d8ce;
}
body[data-template="style05"] .story-dates{
  border-color:rgba(255,255,255,.35);
}
body[data-template="style05"] .countdown{
  background:#2c171d;
}
body[data-template="style05"] .venue-section{
  background:#f4e8e0;
}
body[data-template="style05"] .line-btn{
  color:#7a2635;border-color:#7a2635;
}
body[data-template="style05"] .map-embed-wrap{
  border:6px solid #7a2635;
  border-radius:0;
}
body[data-template="style05"] .gallery-grid{
  gap:6px;
}
body[data-template="style05"] .gallery-grid img{
  border-radius:0;
}
body[data-template="style05"] .external-rsvp-section{
  background:#8a3140;color:#fff4ef;
}
body[data-template="style05"] .external-rsvp-section .eyebrow,
body[data-template="style05"] .external-rsvp-section h2,
body[data-template="style05"] .external-rsvp-section .body-copy{
  color:#fff4ef;
}
body[data-template="style05"] .external-rsvp-btn{
  border-color:#fff4ef;color:#fff4ef;
}
body[data-template="style05"] .rsvp-section{
  background:#e3c2bb;
}
body[data-template="style05"] footer{
  background:#2c171d;
}
body[data-template="style05"] footer h2{
  color:#f7eae3;
}
body[data-template="style05"] .footer-editorial-word{
  display:block;
  font:400 58px/.9 Georgia,serif;
  letter-spacing:.04em;
  opacity:.1;
  margin-bottom:34px;
}


/* =========================================================
   STYLE 06 — BLUE MAISON
   French blue / airy editorial / elegant hotel wedding
========================================================= */
body[data-template="style06"]{
  background:#dce4e7;
  color:#2e4350;
}
body[data-template="style06"] #invitationRoot{
  background:#f7f3ec;
}
body[data-template="style06"] .hero{
  background:#587486;
}
body[data-template="style06"] .hero-image{
  width:88%;
  height:76%;
  position:absolute;
  top:7%;
  left:6%;
  object-fit:cover;
  border:10px solid #f7f3ec;
  box-shadow:0 20px 65px rgba(44,67,79,.23);
}
body[data-template="style06"] .hero-overlay{
  background:linear-gradient(to bottom,rgba(51,77,91,.05),rgba(41,62,74,.5));
}
body[data-template="style06"] .hero-content{
  justify-content:flex-end;
  padding:0 34px 48px;
}
body[data-template="style06"] .hero-content h1{
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(42px,11vw,72px);
  line-height:.93;
  text-transform:none;
}
body[data-template="style06"] .hero-kicker{
  letter-spacing:.3em;
}
body[data-template="style06"] .template-deco.deco-a{
  position:absolute;z-index:3;left:12px;top:12px;width:120px;height:1px;background:rgba(255,255,255,.7)
}
body[data-template="style06"] .template-deco.deco-b{
  position:absolute;z-index:3;right:12px;bottom:12px;width:120px;height:1px;background:rgba(255,255,255,.7)
}
body[data-template="style06"] .section{
  padding-top:102px;
  padding-bottom:102px;
}
body[data-template="style06"] .eyebrow,
body[data-template="style06"] .section-no{
  color:#6a8798;
}
body[data-template="style06"] .section h2{
  color:#2e4350;
  font-size:34px;
}
body[data-template="style06"] .names-cn{
  font-size:22px;
}
body[data-template="style06"] .story-section{
  background:#e9eef0;
}
body[data-template="style06"] .story-photo-wrap{
  width:84%;
}
body[data-template="style06"] .story-photo{
  border:10px solid #f7f3ec;
  box-shadow:0 14px 40px rgba(67,91,103,.12);
}
body[data-template="style06"] .story-dates{
  border-color:#aabcc5;
}
body[data-template="style06"] .countdown{
  background:#587486;
}
body[data-template="style06"] .venue-section{
  background:#f7f3ec;
}
body[data-template="style06"] .line-btn{
  color:#49697b;border-color:#49697b;
}
body[data-template="style06"] .map-embed-wrap{
  border:10px solid #e3e9eb;
  border-radius:0;
}
body[data-template="style06"] .gallery-grid{
  gap:12px;
}
body[data-template="style06"] .gallery-grid img{
  border:7px solid #f7f3ec;
  box-shadow:0 10px 30px rgba(67,91,103,.1);
}
body[data-template="style06"] .external-rsvp-section{
  background:#d9e4e8;
}
body[data-template="style06"] .external-rsvp-btn{
  border-color:#49697b;color:#49697b;
}
body[data-template="style06"] .rsvp-section{
  background:#cad9df;
}
body[data-template="style06"] footer{
  background:#395463;
}
body[data-template="style06"] .footer-editorial-word{
  display:block;
  font:italic 52px/1 Georgia,serif;
  opacity:.08;
  margin-bottom:34px;
}

@media(max-width:430px){
  body[data-template="style04"] .hero{padding:16px}
  body[data-template="style05"] .story-photo-wrap{width:84%}
  body[data-template="style06"] .hero-image{width:90%;left:5%;border-width:7px}
}


/* =========================================================
   V14 REFERENCE REDESIGN
   STYLE 04 — 只為你留白
   參考：大量白留白 / 黑色古典 serif / 矩形照片 / 雙欄資訊
========================================================= */
body[data-template="style04"]{background:#eeeae4;color:#191919;}
body[data-template="style04"] #invitationRoot{background:#fff;}
body[data-template="style04"] .hero{
  height:100svh;background:#fff;padding:0;display:flex;align-items:center;justify-content:center;
}
body[data-template="style04"] .hero-image{
  position:absolute;left:14%;top:18%;width:72%;height:36%;min-height:0;
  object-fit:cover;border-radius:0;box-shadow:none;
}
body[data-template="style04"] .hero-overlay{background:none;}
body[data-template="style04"] .hero-content{
  color:#161616;justify-content:flex-start;padding:9vh 9% 0;text-align:center;
}
body[data-template="style04"] .hero-kicker{
  color:#161616;font:500 11px/1.3 Georgia,serif;letter-spacing:.42em;
}
body[data-template="style04"] .hero-content h1{
  color:#161616;font:400 clamp(34px,9vw,58px)/1 Georgia,serif;
  font-style:normal;letter-spacing:.015em;margin-top:48vh;text-transform:uppercase;
}
body[data-template="style04"] .hero-content h1 em{
  font-size:.38em;font-style:normal;margin:.35em 0;color:#777;
}
body[data-template="style04"] .hero-date{
  color:#161616;font:500 12px/1.4 Georgia,serif;letter-spacing:.18em;
  border-top:1px solid #222;padding-top:14px;margin-top:18px;
}
body[data-template="style04"] .template-deco{display:none!important;}
body[data-template="style04"] .scroll-mark{filter:invert(1);}
body[data-template="style04"] .section{
  background:#fff;padding:86px 9%;text-align:center;
}
body[data-template="style04"] .section-no,
body[data-template="style04"] .eyebrow{color:#777;letter-spacing:.28em;}
body[data-template="style04"] .section h2{
  color:#171717;font:400 32px/1.15 Georgia,"Noto Serif TC",serif;
}
body[data-template="style04"] .names-cn{
  color:#171717;font:400 21px/1.5 Georgia,"Noto Serif TC",serif;
}
body[data-template="style04"] .body-copy{max-width:440px;line-height:2.15;}
body[data-template="style04"] .honorees{
  border-top:1px solid #222;border-bottom:1px solid #222;padding:22px 0;
}
body[data-template="style04"] .story-section{padding-top:30px;}
body[data-template="style04"] .story-photo-wrap{width:100%;margin-bottom:54px;}
body[data-template="style04"] .story-photo{
  width:100%;aspect-ratio:16/10;border-radius:0;object-fit:cover;
}
body[data-template="style04"] .story-dates{
  border-top:1px solid #222;border-bottom:1px solid #222;border-left:0;border-right:0;
}
body[data-template="style04"] .countdown{
  background:#fff;color:#171717;border-top:1px solid #171717;border-bottom:1px solid #171717;
}
body[data-template="style04"] .countdown h2,
body[data-template="style04"] .countdown .eyebrow,
body[data-template="style04"] .countdown .section-no{color:#171717;}
body[data-template="style04"] .count-grid div{border-left-color:#bbb;}
body[data-template="style04"] .venue-section{background:#fff;}
body[data-template="style04"] .map-embed-wrap{
  max-width:100%;border:1px solid #222;border-radius:0;overflow:hidden;
}
body[data-template="style04"] .gallery-grid{grid-template-columns:1fr 1fr;gap:5px;}
body[data-template="style04"] .gallery-grid img{
  border-radius:0!important;aspect-ratio:4/5;object-fit:cover;
}
body[data-template="style04"] .gallery-grid img:nth-child(3n){
  grid-column:1/-1;aspect-ratio:16/10;
}
body[data-template="style04"] .external-rsvp-section,
body[data-template="style04"] .rsvp-section{background:#f7f7f5;}
body[data-template="style04"] .external-rsvp-btn{
  border:1px solid #171717;color:#171717;background:#fff;
}
body[data-template="style04"] footer{background:#fff;color:#171717;border-top:1px solid #171717;}
body[data-template="style04"] footer h2{color:#171717;}
body[data-template="style04"] .footer-editorial-word{
  color:#171717;opacity:.05;font:400 54px/1 Georgia,serif;
}


/* =========================================================
   STYLE 05 — 清新小囍事
   參考：白底 / 霧紅點綴 / 小囍章 / 照片框 / 細緻文青排版
========================================================= */
body[data-template="style05"]{background:#eee9e2;color:#3b3030;}
body[data-template="style05"] #invitationRoot{background:#fffdf9;}
body[data-template="style05"] .hero{
  height:100svh;background:#fffdf9;padding:0;
}
body[data-template="style05"] .hero-image{
  position:absolute;left:10%;top:15%;width:80%;height:43%;object-fit:cover;
  filter:none;border-radius:0;box-shadow:none;
}
body[data-template="style05"] .hero-overlay{
  background:linear-gradient(to bottom,transparent 0 48%,rgba(255,253,249,.08) 56%,#fffdf9 72%);
}
body[data-template="style05"] .hero-content{
  justify-content:flex-end;color:#4b3637;padding:0 10% 10vh;
}
body[data-template="style05"] .hero-kicker{
  color:#9c5358;font-size:10px;letter-spacing:.34em;
}
body[data-template="style05"] .hero-content h1{
  color:#4b3637;font:italic 400 clamp(40px,11vw,68px)/.95 Georgia,serif;
  text-transform:none;letter-spacing:-.02em;
}
body[data-template="style05"] .hero-content h1 em{
  color:#a95b60;font-size:.42em;
}
body[data-template="style05"] .hero-date{color:#6d5657;}
body[data-template="style05"] .template-deco.deco-a{
  display:block;position:absolute;z-index:5;left:50%;top:5%;transform:translateX(-50%);
  width:42px;height:42px;border:1px solid #a65b5d;border-radius:0;
}
body[data-template="style05"] .template-deco.deco-a::after{
  content:"囍";position:absolute;inset:0;display:grid;place-items:center;
  color:#a65b5d;font:700 22px/1 "Noto Serif TC",serif;
}
body[data-template="style05"] .template-deco.deco-b{display:none;}
body[data-template="style05"] .section{
  background:#fffdf9;padding:92px 10%;text-align:center;
}
body[data-template="style05"] .section::before{display:none;}
body[data-template="style05"] .section-no,
body[data-template="style05"] .eyebrow{color:#a65b5d;}
body[data-template="style05"] .section h2{
  color:#493536;font:400 31px/1.2 Georgia,"Noto Serif TC",serif;
}
body[data-template="style05"] .names-cn{color:#493536;}
body[data-template="style05"] .honorees{
  border:0;position:relative;padding-top:28px;
}
body[data-template="style05"] .honorees::before{
  content:"";position:absolute;left:50%;top:0;width:34px;height:1px;background:#a65b5d;transform:translateX(-50%);
}
body[data-template="style05"] .story-section{
  background:#fffdf9;color:#493536;
}
body[data-template="style05"] .story-section .eyebrow,
body[data-template="style05"] .story-section .section-no,
body[data-template="style05"] .story-section h2,
body[data-template="style05"] .story-section .body-copy,
body[data-template="style05"] .story-section small,
body[data-template="style05"] .story-section strong{color:inherit;}
body[data-template="style05"] .story-photo-wrap{
  width:82%;padding:8px;border:1px solid #b66a6d;margin-bottom:60px;
}
body[data-template="style05"] .story-photo{border:0;aspect-ratio:4/3;}
body[data-template="style05"] .story-dates{border-color:#d8c4c2;}
body[data-template="style05"] .countdown{
  background:#fffdf9;color:#493536;border-top:1px solid #b66a6d;border-bottom:1px solid #b66a6d;
}
body[data-template="style05"] .countdown h2,
body[data-template="style05"] .countdown .section-no,
body[data-template="style05"] .countdown .eyebrow{color:#493536;}
body[data-template="style05"] .count-grid div{border-left-color:#d9c3c2;}
body[data-template="style05"] .venue-section{background:#fffdf9;}
body[data-template="style05"] .date-display{
  display:inline-block;border:1px solid #a65b5d;padding:16px 22px;color:#7f3f44;
}
body[data-template="style05"] .map-embed-wrap{
  border:1px solid #a65b5d;border-radius:0;
}
body[data-template="style05"] .gallery-grid{
  grid-template-columns:1fr;gap:14px;max-width:380px;margin-left:auto;margin-right:auto;
}
body[data-template="style05"] .gallery-grid img{
  border:0;border-radius:0;aspect-ratio:16/9;
}
body[data-template="style05"] .external-rsvp-section{
  background:#fffdf9;color:#493536;border-top:1px solid #a65b5d;
}
body[data-template="style05"] .external-rsvp-section .eyebrow,
body[data-template="style05"] .external-rsvp-section h2,
body[data-template="style05"] .external-rsvp-section .body-copy{color:#493536;}
body[data-template="style05"] .external-rsvp-btn{
  background:#a65b5d;border-color:#a65b5d;color:#fff;
}
body[data-template="style05"] .rsvp-section{background:#f5e9e5;}
body[data-template="style05"] footer{background:#fffdf9;color:#493536;border-top:1px solid #a65b5d;}
body[data-template="style05"] footer h2{color:#493536;}
body[data-template="style05"] .footer-editorial-word{
  color:#a65b5d;opacity:.08;font:italic 56px/1 Georgia,serif;
}


/* =========================================================
   STYLE 06 — 囍氣洋洋
   參考：正紅主視覺 / 白底 / 中式囍字 / 紅色資訊卡 / 直式拼貼
========================================================= */
body[data-template="style06"]{background:#eadfd8;color:#4a211d;}
body[data-template="style06"] #invitationRoot{background:#fffaf4;}
body[data-template="style06"] .hero{
  height:100svh;background:#a51f18;padding:0;
}
body[data-template="style06"] .hero-image{
  position:absolute;left:13%;top:17%;width:74%;height:46%;
  object-fit:cover;border:0;box-shadow:none;filter:none;
}
body[data-template="style06"] .hero-overlay{
  background:linear-gradient(to bottom,rgba(80,0,0,.08),rgba(110,9,4,.15));
}
body[data-template="style06"] .hero-content{
  justify-content:flex-end;padding:0 10% 9vh;color:#fff8ef;
}
body[data-template="style06"] .hero-kicker{
  color:#fff8ef;letter-spacing:.28em;
}
body[data-template="style06"] .hero-content h1{
  color:#fff8ef;font:400 clamp(40px,10vw,66px)/.98 Georgia,"Noto Serif TC",serif;
  text-transform:none;
}
body[data-template="style06"] .hero-content h1 em{color:#f1c3b0;}
body[data-template="style06"] .hero-date{color:#fff1e7;}
body[data-template="style06"] .template-deco.deco-a{
  display:block;position:absolute;z-index:5;right:8%;top:56%;width:62px;height:62px;
  background:#a51f18;border:2px solid #fff4e9;border-radius:50%;
}
body[data-template="style06"] .template-deco.deco-a::after{
  content:"囍";position:absolute;inset:0;display:grid;place-items:center;
  color:#fff4e9;font:700 31px/1 "Noto Serif TC",serif;
}
body[data-template="style06"] .template-deco.deco-b{display:none;}
body[data-template="style06"] .section{
  background:#fffaf4;padding:90px 9%;text-align:center;
}
body[data-template="style06"] .section-no,
body[data-template="style06"] .eyebrow{color:#a51f18;}
body[data-template="style06"] .section h2{
  color:#7f1713;font:600 32px/1.2 "Noto Serif TC",Georgia,serif;
}
body[data-template="style06"] .names-cn{
  color:#7f1713;font-weight:600;
}
body[data-template="style06"] .honorees{
  border-top:1px solid #b6493f;border-bottom:1px solid #b6493f;padding:22px 0;
}
body[data-template="style06"] .story-section{
  display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:center;max-width:900px;
}
body[data-template="style06"] .story-photo-wrap{
  width:100%;margin:0;grid-row:1/span 2;
}
body[data-template="style06"] .story-photo{
  border:0;box-shadow:none;aspect-ratio:3/4;
}
body[data-template="style06"] .story-copy{
  text-align:left;padding:24px 12px;
}
body[data-template="style06"] .story-dates{
  border:0;border-left:4px solid #a51f18;margin-left:0;padding-left:16px;
}
body[data-template="style06"] .countdown{
  background:#a51f18;color:#fff8ef;
}
body[data-template="style06"] .countdown h2,
body[data-template="style06"] .countdown .eyebrow,
body[data-template="style06"] .countdown .section-no{color:#fff8ef;}
body[data-template="style06"] .venue-section{background:#fffaf4;}
body[data-template="style06"] .date-display{
  background:#a51f18;color:#fff;padding:22px 18px;border-radius:0;
}
body[data-template="style06"] .line-btn{
  color:#8d1b16;border-color:#8d1b16;
}
body[data-template="style06"] .map-embed-wrap{
  border:0;border-radius:0;box-shadow:0 0 0 1px #a51f18;
}
body[data-template="style06"] .gallery-grid{
  grid-template-columns:1fr 1fr;gap:7px;
}
body[data-template="style06"] .gallery-grid img{
  border:0;box-shadow:none;border-radius:0;aspect-ratio:3/4;
}
body[data-template="style06"] .gallery-grid img:nth-child(3n){
  grid-column:1/-1;aspect-ratio:16/9;
}
body[data-template="style06"] .external-rsvp-section{
  background:#a51f18;color:#fff8ef;
}
body[data-template="style06"] .external-rsvp-section .eyebrow,
body[data-template="style06"] .external-rsvp-section h2,
body[data-template="style06"] .external-rsvp-section .body-copy{color:#fff8ef;}
body[data-template="style06"] .external-rsvp-btn{
  border-color:#fff8ef;color:#fff8ef;background:transparent;
}
body[data-template="style06"] .rsvp-section{background:#f1d9cf;}
body[data-template="style06"] footer{background:#8d1712;}
body[data-template="style06"] .footer-editorial-word{
  display:block;color:#fff;opacity:.08;font:700 70px/.85 "Noto Serif TC",serif;
}

@media(max-width:520px){
  body[data-template="style06"] .story-section{display:block;}
  body[data-template="style06"] .story-photo-wrap{margin-bottom:35px;}
  body[data-template="style06"] .story-copy{text-align:center;padding:15px 0;}
  body[data-template="style06"] .story-dates{
    border-left:0;border-top:1px solid #a51f18;padding-left:0;
  }
}

/* V16 — Wedding date display modes */
.date-display-text{display:block}
.date-display-calendar{
  width:min(100%,390px);
  margin:38px auto 42px;
  display:grid!important;
  grid-template-columns:58px 1px 1fr;
  gap:20px;
  align-items:start;
  text-align:left;
  padding:0!important;
  background:transparent!important;
  color:inherit!important;
  border:0!important;
  border-radius:0!important;
}
.calendar-date-stack{
  display:flex;flex-direction:column;align-items:center;
  font:400 27px/.78 Georgia,"Times New Roman",serif;
  letter-spacing:.02em;
}
.calendar-date-stack strong{font-weight:400}
.calendar-divider{width:1px;height:88px;background:currentColor;opacity:.55}
.calendar-panel{min-width:0}
.calendar-week,.calendar-days{
  display:grid;grid-template-columns:repeat(7,1fr);
  text-align:center;
}
.calendar-week{margin-bottom:7px}
.calendar-week b{
  font:500 7px/1 sans-serif;opacity:.68;
}
.calendar-days{row-gap:5px}
.calendar-days span{
  position:relative;display:grid;place-items:center;
  height:17px;font:400 8px/1 Georgia,serif;
}
.calendar-days .other-month{opacity:.2}
.calendar-days .wedding-day{
  color:#fff;z-index:0;
}
.calendar-days .wedding-day::before{
  content:"";position:absolute;width:16px;height:16px;border-radius:50%;
  background:#a33b43;z-index:-1;
}
.calendar-full-date{
  margin-top:15px;text-align:center;
  font:500 15px/1.2 Georgia,"Times New Roman",serif;
  letter-spacing:.13em;
}
.calendar-full-date small{font-size:8px;letter-spacing:0}
body[data-template="style06"] .calendar-days .wedding-day::before{background:#a51f18}
body[data-template="style05"] .calendar-days .wedding-day::before{background:#a65b5d}
body[data-template="style03"] .calendar-days .wedding-day::before{background:#222}
body[data-template="style04"] .calendar-days .wedding-day::before{background:#222}
body[data-template="style01"] .calendar-days .wedding-day::before{background:#6f806f}
body[data-template="style02"] .calendar-days .wedding-day::before{background:#a75f67}
@media(max-width:390px){
  .date-display-calendar{grid-template-columns:48px 1px 1fr;gap:14px}
  .calendar-date-stack{font-size:23px}
}

/* V17 — custom base background for STYLE 01–06 */
body.has-custom-bg #invitationRoot,
body.has-custom-bg .invitation-section,
body.has-custom-bg .venue-section,
body.has-custom-bg .gallery-section{background:var(--custom-invitation-bg)!important}
body.has-custom-bg[data-template="style01"] .story-section,
body.has-custom-bg[data-template="style02"] .story-section,
body.has-custom-bg[data-template="style04"] .story-section,
body.has-custom-bg[data-template="style05"] .story-section,
body.has-custom-bg[data-template="style06"] .story-section{background:var(--custom-invitation-bg)!important}
body.has-custom-bg[data-template="style04"] .hero,
body.has-custom-bg[data-template="style05"] .hero{background:var(--custom-invitation-bg)!important}

/* =========================================================
   V18 — compact wedding calendar card
========================================================= */
.date-display-calendar{
  width:min(100%,280px)!important;
  margin:36px auto 38px!important;
  display:block!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  color:inherit!important;
}
.calendar-card{
  --calendar-accent:#7d6d5d;
  color:#fff;
  background:var(--calendar-accent);
  border-radius:10px;
  padding:14px 14px 16px;
  box-shadow:
    0 0 0 2px #fff,
    0 0 0 3px color-mix(in srgb,var(--calendar-accent) 65%,#6d6258);
}
.calendar-card-date{
  text-align:left;
  font:500 9px/1.2 "Noto Serif TC",Georgia,serif;
  letter-spacing:.08em;
  margin-bottom:13px;
}
.calendar-card-week,
.calendar-card-days{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  text-align:center;
}
.calendar-card-week{
  margin-bottom:7px;
}
.calendar-card-week b{
  font:500 7px/1 sans-serif;
  opacity:.8;
}
.calendar-card-days{
  row-gap:4px;
}
.calendar-card-days span{
  position:relative;
  display:grid;
  place-items:center;
  height:16px;
  font:400 8px/1 Georgia,serif;
}
.calendar-card-days .other-month{opacity:.22}
.calendar-card-days .wedding-day{
  color:var(--calendar-accent);
  font-weight:700;
  z-index:0;
}
.calendar-card-days .wedding-day::before{
  content:"";
  position:absolute;
  width:15px;height:15px;
  border-radius:50%;
  background:#fff;
  z-index:-1;
}
.calendar-card-rule{
  height:1px;
  background:rgba(255,255,255,.52);
  margin:12px 2px 10px;
}
.calendar-card-times{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.calendar-card-times div{
  display:flex;
  align-items:baseline;
  justify-content:center;
  gap:5px;
}
.calendar-card-times strong{
  font:500 13px/1 Georgia,serif;
}
.calendar-card-times span{
  font-size:8px;
  letter-spacing:.05em;
}
.calendar-card-caption{
  margin-top:14px;
  text-align:center;
  font:500 9px/1.4 "Noto Serif TC",serif;
  letter-spacing:.08em;
  color:currentColor;
}

/* style-specific calendar theme colors */
body[data-template="style01"] .calendar-card{--calendar-accent:#6f806f}
body[data-template="style02"] .calendar-card{--calendar-accent:#a75f67}
body[data-template="style03"] .calendar-card{--calendar-accent:#222426}
body[data-template="style04"] .calendar-card{--calendar-accent:#242424}
body[data-template="style05"] .calendar-card{--calendar-accent:#a65b5d}
body[data-template="style06"] .calendar-card{--calendar-accent:#a51f18}

/* remove prior calendar layout remnants */
.date-display-calendar .calendar-date-stack,
.date-display-calendar .calendar-divider,
.date-display-calendar .calendar-panel,
.date-display-calendar .calendar-week,
.date-display-calendar .calendar-days,
.date-display-calendar .calendar-full-date{display:none!important}

@media(max-width:390px){
  .date-display-calendar{width:min(100%,248px)!important}
}

.hero,.story-photo-wrap,.gallery-image-frame{overflow:hidden}
.hero-image,.story-photo,.gallery-image-frame img{transition:transform .16s ease,object-position .16s ease}
.gallery-grid .gallery-image-frame{width:100%;aspect-ratio:4/5;overflow:hidden;min-width:0}
.gallery-grid .gallery-image-frame img{width:100%;height:100%;display:block;object-fit:cover}
.gallery-grid .gallery-image-frame:nth-child(3n){grid-column:1/-1;aspect-ratio:16/11}
body[data-template="style02"] .gallery-grid .gallery-image-frame{border-radius:120px 120px 4px 4px}
body[data-template="style02"] .gallery-grid .gallery-image-frame:nth-child(3n){border-radius:4px}
body[data-template="style03"] .gallery-grid .gallery-image-frame{aspect-ratio:3/4}
body[data-template="style03"] .gallery-grid .gallery-image-frame:nth-child(3n){grid-column:auto;aspect-ratio:3/4}
body[data-template="style03"] .gallery-grid .gallery-image-frame:nth-child(4n+1){grid-row:span 2;height:100%}
body[data-template="style04"] .gallery-grid .gallery-image-frame{border-radius:0;aspect-ratio:4/5}
body[data-template="style04"] .gallery-grid .gallery-image-frame:nth-child(3n){grid-column:1/-1;aspect-ratio:16/10}
body[data-template="style05"] .gallery-grid .gallery-image-frame{aspect-ratio:16/9;border-radius:0}
body[data-template="style06"] .gallery-grid .gallery-image-frame{aspect-ratio:3/4;border-radius:0}
body[data-template="style06"] .gallery-grid .gallery-image-frame:nth-child(3n){grid-column:1/-1;aspect-ratio:16/9}
@media(max-width:520px){body[data-template="style03"] .gallery-grid .gallery-image-frame:nth-child(4n+1){grid-row:auto}}

.hero.hero-text-top .hero-content{justify-content:flex-start!important;padding-top:48px!important}
.hero.hero-text-center .hero-content{justify-content:center!important}
.hero.hero-text-bottom .hero-content{justify-content:flex-end!important;padding-bottom:48px!important}

/* =========================================================
   V23 — Public Gallery Lightbox
========================================================= */
#galleryGrid img,
.gallery-grid img,
[data-image-key^="gallery"]{
  cursor:zoom-in;
}
.public-gallery-lightbox{
  position:fixed;
  inset:0;
  z-index:10000;
  display:none;
  align-items:center;
  justify-content:center;
  padding:28px 74px;
  background:rgba(17,16,15,.94);
  backdrop-filter:blur(5px);
}
.public-gallery-lightbox.show{display:flex}
.public-gallery-image{
  max-width:min(92vw,1200px);
  max-height:88vh;
  object-fit:contain;
  transform:none!important;
  object-position:center!important;
  box-shadow:0 22px 80px rgba(0,0,0,.48);
}
.public-gallery-close{
  position:absolute;
  right:22px;
  top:18px;
  width:44px;
  height:44px;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.12);
  color:#fff;
  font-size:29px;
  line-height:1;
}
.public-gallery-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:48px;
  height:58px;
  border:0;
  border-radius:12px;
  background:rgba(255,255,255,.12);
  color:#fff;
  font-size:32px;
}
.public-gallery-prev{left:18px}
.public-gallery-next{right:18px}
.public-gallery-count{
  position:absolute;
  bottom:18px;
  left:50%;
  transform:translateX(-50%);
  color:rgba(255,255,255,.85);
  font-size:12px;
  letter-spacing:.1em;
}
.gallery-lightbox-open{overflow:hidden}
@media(max-width:640px){
  .public-gallery-lightbox{padding:70px 16px}
  .public-gallery-nav{width:40px;height:52px;background:rgba(0,0,0,.35)}
  .public-gallery-prev{left:8px}
  .public-gallery-next{right:8px}
  .public-gallery-image{max-width:96vw;max-height:80vh}
}


/* V26 optional palette; inactive unless colorScheme exists */
body.has-custom-palette{background:var(--be-base-bg,inherit)!important}
body.has-custom-palette #invitationRoot,body.has-custom-palette .invitation-section,body.has-custom-palette .venue-section,body.has-custom-palette .gallery-section{background:var(--be-base-bg,inherit)!important}
body.has-custom-palette .story-section,body.has-custom-palette .external-rsvp-section,body.has-custom-palette .rsvp-section{background:var(--be-section-bg,var(--be-base-bg,inherit))!important}
body.has-custom-palette .countdown,body.has-custom-palette footer{background:var(--be-accent-bg,inherit)!important}


/* =========================================================
   V26.1 — Gallery display modes
   Existing projects fall back to data-gallery-display="default".
   ========================================================= */
body[data-gallery-display="rounded"] .gallery-grid .gallery-image-frame{
  border-radius:22px!important;overflow:hidden!important;
}
body[data-gallery-display="arch"] .gallery-grid{
  grid-template-columns:1fr 1fr!important;gap:10px!important;
}
body[data-gallery-display="arch"] .gallery-grid .gallery-image-frame{
  grid-column:auto!important;grid-row:auto!important;height:auto!important;
  aspect-ratio:4/5!important;border-radius:999px 999px 18px 18px!important;overflow:hidden!important;
}
body[data-gallery-display="circle"] .gallery-grid{
  grid-template-columns:1fr 1fr!important;gap:14px!important;
}
body[data-gallery-display="circle"] .gallery-grid .gallery-image-frame{
  grid-column:auto!important;grid-row:auto!important;height:auto!important;
  aspect-ratio:1/1!important;border-radius:50%!important;overflow:hidden!important;
}
body[data-gallery-display="circle"] .gallery-grid .gallery-image-frame img,
body[data-gallery-display="arch"] .gallery-grid .gallery-image-frame img,
body[data-gallery-display="rounded"] .gallery-grid .gallery-image-frame img{
  width:100%!important;height:100%!important;object-fit:cover!important;
}
body[data-gallery-display="slideshow"] .gallery-grid{
  display:block!important;position:relative!important;width:100%!important;overflow:hidden!important;
}
body[data-gallery-display="slideshow"] .gallery-grid .gallery-image-frame{
  display:none!important;grid-column:auto!important;grid-row:auto!important;height:auto!important;
  width:100%!important;aspect-ratio:4/5!important;border-radius:18px!important;overflow:hidden!important;
}
body[data-gallery-display="slideshow"] .gallery-grid .gallery-image-frame.is-active{
  display:block!important;animation:beGalleryFade .45s ease both;
}
body[data-gallery-display="slideshow"] .gallery-grid .gallery-image-frame img{
  width:100%!important;height:100%!important;object-fit:cover!important;
}
.gallery-slideshow-controls{display:none}
body[data-gallery-display="slideshow"] .gallery-slideshow-controls{
  display:grid;grid-template-columns:42px 1fr 42px;align-items:center;gap:10px;margin:14px auto 0;max-width:360px;
}
.gallery-slide-nav{width:42px;height:42px;border:1px solid rgba(35,49,58,.22);border-radius:50%;background:transparent;color:inherit;font-size:26px;line-height:1;cursor:pointer}
.gallery-slide-dots{display:flex;align-items:center;justify-content:center;gap:7px;min-width:0;flex-wrap:wrap}
.gallery-slide-dot{width:7px;height:7px;padding:0;border:0;border-radius:50%;background:currentColor;opacity:.25;cursor:pointer}
.gallery-slide-dot.active{opacity:1;transform:scale(1.25)}
@keyframes beGalleryFade{from{opacity:.2;transform:translateX(8px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){body[data-gallery-display="slideshow"] .gallery-grid .gallery-image-frame.is-active{animation:none}}


/* =========================================================
   V26.2 — Gallery shape correction
   Shape is applied directly to each image so STYLE-specific
   frame rules cannot cancel the selected appearance.
   ========================================================= */
body[data-gallery-display="rounded"] .gallery-grid .gallery-image-frame,
body[data-gallery-display="rounded"] .gallery-grid .gallery-image-frame img{
  border-radius:18px!important;
  overflow:hidden!important;
}
body[data-gallery-display="rounded"] .gallery-grid .gallery-image-frame img{
  display:block!important;
}

/* Arch: rounded dome on top, straight bottom corners */
body[data-gallery-display="arch"] .gallery-grid .gallery-image-frame{
  aspect-ratio:4/5!important;
  border-radius:999px 999px 0 0!important;
  overflow:hidden!important;
}
body[data-gallery-display="arch"] .gallery-grid .gallery-image-frame img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  aspect-ratio:auto!important;
  object-fit:cover!important;
  border-radius:999px 999px 0 0!important;
}

/* Circle: every gallery photo itself becomes a true 1:1 circle */
body[data-gallery-display="circle"] .gallery-grid .gallery-image-frame{
  aspect-ratio:1/1!important;
  border-radius:50%!important;
  overflow:hidden!important;
}
body[data-gallery-display="circle"] .gallery-grid .gallery-image-frame img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  aspect-ratio:1/1!important;
  object-fit:cover!important;
  border-radius:50%!important;
}

/* Keep slideshow image independent from STYLE-specific gallery rules */
body[data-gallery-display="slideshow"] .gallery-grid .gallery-image-frame img{
  display:block!important;
}


/* =========================================================
   V26.3 — Gallery display hard override + cache-safe stylesheet
   Neutralizes STYLE-specific nth-child rules whenever a custom
   gallery display mode is selected.
   ========================================================= */

/* Rounded: preserve existing grid geometry, only round the actual images */
body[data-gallery-display="rounded"] #galleryGrid .gallery-image-frame,
body[data-gallery-display="rounded"] #galleryGrid .gallery-image-frame:nth-child(n),
body[data-gallery-display="rounded"] #galleryGrid img{
  border-radius:20px!important;
  overflow:hidden!important;
}

/* Arch: all photos use the same 4:5 dome card, including every 3rd image */
body[data-gallery-display="arch"] #galleryGrid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
}
body[data-gallery-display="arch"] #galleryGrid .gallery-image-frame,
body[data-gallery-display="arch"] #galleryGrid .gallery-image-frame:nth-child(n){
  grid-column:auto!important;
  grid-row:auto!important;
  width:100%!important;
  height:auto!important;
  aspect-ratio:4/5!important;
  border-radius:999px 999px 0 0!important;
  overflow:hidden!important;
}
body[data-gallery-display="arch"] #galleryGrid .gallery-image-frame img,
body[data-gallery-display="arch"] #galleryGrid img:nth-child(n){
  display:block!important;
  width:100%!important;
  height:100%!important;
  aspect-ratio:auto!important;
  object-fit:cover!important;
  border-radius:999px 999px 0 0!important;
}

/* Circle: every photo card is a real square, then clipped into a circle */
body[data-gallery-display="circle"] #galleryGrid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:14px!important;
}
body[data-gallery-display="circle"] #galleryGrid .gallery-image-frame,
body[data-gallery-display="circle"] #galleryGrid .gallery-image-frame:nth-child(n){
  grid-column:auto!important;
  grid-row:auto!important;
  width:100%!important;
  height:auto!important;
  aspect-ratio:1/1!important;
  border-radius:50%!important;
  overflow:hidden!important;
}
body[data-gallery-display="circle"] #galleryGrid .gallery-image-frame img,
body[data-gallery-display="circle"] #galleryGrid img:nth-child(n){
  display:block!important;
  width:100%!important;
  height:100%!important;
  aspect-ratio:1/1!important;
  object-fit:cover!important;
  border-radius:50%!important;
}


/* V28.8 — couple profile */
.couple-profile-section{padding-top:66px;padding-bottom:92px}.couple-profile-list{display:grid;gap:42px;max-width:620px;margin:34px auto 0}.couple-profile-card{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);align-items:center;gap:26px;text-align:left}.couple-profile-card:nth-child(even) .couple-profile-photo-wrap{order:2}.couple-profile-card:nth-child(even) .couple-profile-copy{text-align:right}.couple-profile-photo-wrap{overflow:hidden;border-radius:999px 999px 22px 22px;aspect-ratio:4/5;background:rgba(0,0,0,.04)}.couple-profile-photo{width:100%;height:100%;display:block;object-fit:cover}.couple-profile-copy small{display:block;margin-bottom:10px;font-size:9px;letter-spacing:.22em;opacity:.6}.couple-profile-copy h3{margin:0 0 12px;font:400 25px/1.2 Georgia,"Noto Serif TC",serif}.couple-profile-copy p{margin:0;white-space:pre-line;font-size:13px;line-height:1.9;color:#716a63}.scroll-reveal{opacity:0;transform:translate3d(0,28px,0);transition:opacity .8s ease,transform .9s cubic-bezier(.2,.7,.2,1);transition-delay:var(--reveal-delay,0ms);will-change:opacity,transform}.scroll-reveal.is-visible{opacity:1;transform:translate3d(0,0,0)}@media(max-width:560px){.couple-profile-list{gap:54px}.couple-profile-card{grid-template-columns:1fr;gap:20px;text-align:center}.couple-profile-card:nth-child(even) .couple-profile-photo-wrap{order:0}.couple-profile-card:nth-child(even) .couple-profile-copy{text-align:center}.couple-profile-photo-wrap{width:min(74vw,290px);margin:0 auto}.couple-profile-copy{padding:0 8px}}@media(prefers-reduced-motion:reduce){.scroll-reveal{opacity:1!important;transform:none!important;transition:none!important}}


/* =========================================================
   V28.9 — Wedding information date display modes + color
========================================================= */
.date-display-roc,
.date-display-western{
  color:var(--custom-wedding-date-color, currentColor);
}
.date-display-western{
  font-family:Georgia,"Times New Roman",serif;
  letter-spacing:.10em;
  text-transform:uppercase;
}
.date-display-calendar .calendar-card-caption{
  color:var(--custom-wedding-date-color, currentColor);
}


/* =========================================================
   V28.10 — Minimal calendar + independent wedding date size
========================================================= */
.date-display-roc,.date-display-western{font-size:var(--wedding-date-font-size,30pt)!important}
.date-display-calendar{width:min(100%,300px)!important;margin:30px auto 36px!important;color:inherit!important}
.date-display-calendar .calendar-card,.date-display-calendar .calendar-card-caption{display:none!important}
.calendar-minimal{--calendar-accent:var(--custom-wedding-date-color,#b85a5a);width:min(100%,250px);margin:0 auto;padding:2px 4px 0;background:transparent;color:#3c3936;font-family:Georgia,"Noto Serif TC",serif}
.calendar-minimal-month{margin-bottom:13px;text-align:center;font:400 10px/1.2 Georgia,"Noto Serif TC",serif;letter-spacing:.2em;opacity:.58}
.calendar-minimal-week,.calendar-minimal-days{display:grid;grid-template-columns:repeat(7,1fr);text-align:center}
.calendar-minimal-week{margin-bottom:9px}
.calendar-minimal-week b{font:400 9px/1 "Noto Serif TC",Georgia,serif;color:#5f5a55}
.calendar-minimal-days{row-gap:8px}
.calendar-minimal-days span{position:relative;height:20px;display:grid;place-items:center;font:400 10px/1 Georgia,serif;color:#4b4742}
.calendar-minimal-days .calendar-empty{visibility:hidden}
.calendar-minimal-days .wedding-day{color:#fff;font-weight:700;z-index:0}
.calendar-minimal-days .wedding-day::before{content:"";position:absolute;width:20px;height:20px;border-radius:50%;background:var(--calendar-accent);z-index:-1;box-shadow:0 0 0 1px color-mix(in srgb,var(--calendar-accent) 75%,#fff)}
.calendar-main-date{margin-top:28px;text-align:center;color:var(--custom-wedding-date-color,currentColor);font:400 var(--wedding-date-font-size,30pt)/1.2 Georgia,"Times New Roman","Noto Serif TC",serif;letter-spacing:.08em;white-space:nowrap}
.calendar-main-date small{font-size:.44em;vertical-align:.14em;letter-spacing:.02em}


/* V28.10.1 — ROC date on two lines + 30pt default */
.date-display-roc{display:flex!important;flex-direction:column;align-items:center;gap:.22em;line-height:1.18!important;white-space:nowrap}
.date-display-roc .roc-date-main,.date-display-roc .roc-date-weekday{display:block}
.date-display-roc .roc-date-weekday{font-size:.78em;letter-spacing:.08em}


/* V28.10.2 — hard two-line ROC + western weekday */
.date-display-roc{
  display:grid!important;
  grid-template-columns:1fr!important;
  justify-items:center!important;
  width:100%!important;
  white-space:normal!important;
}
.date-display-roc .roc-date-main,
.date-display-roc .roc-date-weekday{
  display:block!important;
  width:100%!important;
  text-align:center!important;
  white-space:nowrap!important;
}
.date-display-western{
  display:flex!important;
  align-items:baseline!important;
  justify-content:center!important;
  gap:.24em!important;
  white-space:nowrap!important;
}
.date-display-western .western-date-main,
.date-display-western .western-date-weekday{display:inline-block!important}
.date-display-western .western-date-weekday{font-size:.62em;letter-spacing:.02em}
