body{margin:0;background:#f6f1e8;color:#272321;font-family:"DM Sans",sans-serif;font-weight:300}*{box-sizing:border-box}button,input,select,textarea{font:inherit}.opening{position:fixed;inset:0;z-index:50;display:grid;place-items:center;min-height:100svh;background:#f6f1e8;transition:.75s;overflow:hidden}.opening.hidden{opacity:0;visibility:hidden}.cover-arc{position:absolute;width:min(78vw,720px);height:min(62vw,530px);border:1.5px solid #756c66;border-bottom:0;border-radius:50% 50% 0 0;top:6vh;left:50%;transform:translateX(-50%)}.cover-line{position:absolute;right:9vw;top:18vh;height:20vh;width:2px;background:#8b1e2d}.cover-copy{text-align:center;position:relative;z-index:2;padding:2rem}.cover-monogram,.closing-monogram{width:min(280px,56vw);display:block;margin:0 auto 1rem}.kicker{letter-spacing:.36em;font-size:.72rem;color:#756c66}.cover-copy h1,.section-heading h2,.story-copy h3,.event-panel h3,.couple-details h3,.bank-name,.account-number,.cover-date,.count-box strong{font-family:"Italiana",serif;font-weight:400}.cover-copy h1{font-size:clamp(3rem,10vw,6rem);margin:.1em 0}.cover-copy h1 em,.soft-amp,blockquote{font-family:"Allura",cursive;font-weight:400;color:#b38c4a}.cover-date{color:#8b1e2d;font-size:clamp(1.6rem,5vw,2.6rem);font-weight:700}.cover-side{position:absolute;left:3vw;bottom:10vh;writing-mode:vertical-rl;transform:rotate(180deg);letter-spacing:.35em;color:#756c66;font-size:.78rem}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 24px;text-decoration:none;text-transform:uppercase;letter-spacing:.13em;font-size:.74rem;border:1px solid transparent;cursor:pointer}.btn-primary{background:#8b1e2d;color:#fff}.btn-outline{border-color:#756c66;color:#756c66;background:transparent}.site{opacity:0;transition:.75s}.site.visible{opacity:1}.section{max-width:1200px;margin:auto;padding:110px max(24px,6vw)}.section-heading>span{color:rgba(117,108,102,.16);font-family:"Italiana",serif;font-size:clamp(4.5rem,10vw,8rem);line-height:.8}.section-heading p{font-size:.7rem;letter-spacing:.34em;color:#756c66}.section-heading h2{font-size:clamp(2.8rem,6vw,5rem);margin:0}.section-heading h2:after{content:"";display:block;width:74px;height:2px;background:#8b1e2d;margin-top:18px}.verse-section{text-align:center;min-height:90svh;display:grid;align-content:center}.ornament-line{width:88px;height:1px;background:#8b1e2d;margin:0 auto 30px}blockquote{font-size:clamp(2.5rem,6vw,5rem);line-height:1.05;margin:0 auto;max-width:850px;color:#756c66}.verse-ref{letter-spacing:.16em;text-transform:uppercase;color:#8b1e2d}.intro-copy,.gift-copy{max-width:760px;margin:32px auto;line-height:1.85}.countdown{max-width:720px;margin:44px auto 0;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.count-box{border:1px solid rgba(117,108,102,.32);padding:22px 8px}.count-box strong{display:block;font-size:2rem;color:#8b1e2d}.count-box span{font-size:.68rem;letter-spacing:.14em}.couple-layout{display:grid;grid-template-columns:1.05fr .95fr;gap:40px}.couple-photo{margin:0;min-height:680px}.couple-photo img{width:100%;height:100%;object-fit:cover}.couple-details{border-left:1px solid rgba(117,108,102,.32);padding:50px;display:grid;align-content:center;gap:26px}.couple-details h3{font-size:2rem;margin:0}.call-name{font-family:"Italiana",serif;color:#8b1e2d}.soft-amp{font-size:3.2rem}.story-list{display:grid;gap:26px}.story-card{display:grid;grid-template-columns:130px 1fr 1.25fr;gap:30px;border-top:1px solid rgba(117,108,102,.32);padding-top:26px}.story-meta span{font-family:"Italiana",serif;font-size:2rem;color:#8b1e2d}.story-meta i{display:block;width:2px;height:60px;background:#8b1e2d;margin-top:16px}.story-photos{display:grid;grid-template-columns:1fr 1fr;gap:12px}.photo-placeholder,.gallery-placeholder{min-height:220px;border:1px solid rgba(117,108,102,.32);display:grid;place-items:center;color:#756c66}.event-stack{display:grid;grid-template-columns:1fr 1fr;gap:24px}.event-panel{position:relative;border:1px solid rgba(117,108,102,.32);padding:48px}.event-rule{position:absolute;left:0;top:48px;width:5px;height:70px;background:#8b1e2d}.venue{font-family:"Italiana",serif;font-size:1.4rem}.time{color:#8b1e2d;font-weight:600}.address{line-height:1.75}.gallery-grid{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:70px;gap:14px}.gallery-item,.gallery-placeholder{border:0;padding:0;overflow:hidden;background:transparent}.gallery-item img{width:100%;height:100%;object-fit:cover}.g1{grid-column:1/6;grid-row:1/8}.g2{grid-column:6/13;grid-row:1/5}.g3{grid-column:6/10;grid-row:5/11}.g4{grid-column:10/13;grid-row:5/9}.g5{grid-column:1/5;grid-row:8/13}.g6{grid-column:5/9;grid-row:11/16}.g7{grid-column:9/13;grid-row:9/16}.gallery-placeholder{grid-column:1/5;grid-row:13/16}.rsvp-form{max-width:860px;margin:auto;padding:44px;border:1px solid rgba(117,108,102,.32)}.rsvp-form label{display:grid;gap:10px;margin-bottom:24px}.form-columns{display:grid;grid-template-columns:1fr 1fr;gap:28px}input,select,textarea{width:100%;border:0;border-bottom:1px solid rgba(117,108,102,.32);background:transparent;padding:12px 0}.gift-section{text-align:center}.bank-block{max-width:760px;margin:38px auto;border-top:1px solid rgba(117,108,102,.32);border-bottom:1px solid rgba(117,108,102,.32);padding:40px}.bank-name{font-size:2.8rem;color:#b38c4a}.account-number{font-size:2.1rem;color:#8b1e2d}.wish-list{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.wish-list article{border-top:2px solid #8b1e2d;padding:24px 0}.closing-section{min-height:90svh;display:grid;place-content:center;text-align:center}.closing-section h2,.closing-date{font-size:24px}.closing-section h2{color:#b38c4a}.closing-date{font-family:"Italiana",serif;color:#8b1e2d}.music-toggle{position:fixed;right:18px;bottom:18px;z-index:20;width:44px;height:44px;border-radius:50%;border:1px solid #756c66;background:#f6f1e8}.reveal{opacity:0;transform:translateY(24px);transition:.8s}.reveal.in{opacity:1;transform:none}dialog{border:0;padding:0;width:100vw;height:100vh;max-width:none;max-height:none;background:#000e}dialog img{width:100%;height:100%;object-fit:contain}dialog button{position:absolute;right:18px;top:12px;background:transparent;border:0;color:#fff;font-size:2.4rem}@media(max-width:820px){.section{padding:82px 20px}.couple-layout,.event-stack{grid-template-columns:1fr}.couple-details{border-left:0;border-top:1px solid rgba(117,108,102,.32);padding:34px 0}.story-card{grid-template-columns:1fr}.form-columns{grid-template-columns:1fr}.gallery-grid{grid-template-columns:1fr 1fr;grid-auto-rows:180px}.gallery-item,.gallery-placeholder{grid-column:auto!important;grid-row:auto!important}}@media(max-width:520px){.countdown{grid-template-columns:repeat(2,1fr)}.gallery-grid{grid-template-columns:1fr;grid-auto-rows:320px}}

/* Revision: section titles, opening verse, and closing signature */
.section-heading > span{display:none!important;}
.verse-section blockquote{font-size:36px!important;}
.closing-section h2{
  font-family:"Allura",cursive!important;
  font-size:24px!important;
  font-weight:400!important;
  letter-spacing:.02em;
}
@media(max-width:520px){
  .verse-section blockquote{font-size:36px!important;}
}


/* COVER REVISION — mengikuti komposisi referensi editorial */
.opening{
  position:fixed;
  inset:0;
  z-index:50;
  display:block;
  min-height:100svh;
  background:#f7f5f1;
  color:#6f6965;
  overflow:hidden;
  transition:opacity .75s ease,visibility .75s ease;
}
.opening.hidden{opacity:0;visibility:hidden}

.cover-frame-reference{
  position:absolute;
  inset:4.5vh 5vw;
  pointer-events:none;
}
.frame-arc{
  position:absolute;
  left:4%;
  top:0;
  width:76%;
  height:48%;
  border:2px solid #756f6b;
  border-right-color:transparent;
  border-bottom-color:transparent;
  border-radius:52% 48% 0 0;
  transform:rotate(-1deg);
}
.frame-left{
  position:absolute;
  left:4%;
  top:31%;
  bottom:6%;
  width:2px;
  background:#756f6b;
}
.frame-bottom{
  position:absolute;
  left:4%;
  right:4%;
  bottom:6%;
  height:2px;
  background:#756f6b;
  border-radius:999px;
}
.frame-right{
  position:absolute;
  right:4%;
  top:42%;
  bottom:6%;
  width:2px;
  background:#756f6b;
}

.cover-side{
  position:absolute;
  left:2.6vw;
  top:50%;
  bottom:auto;
  transform:translateY(-50%) rotate(180deg);
  writing-mode:vertical-rl;
  color:#756f6b;
  font-family:"Bodoni Moda",serif;
  font-size:clamp(.82rem,1.2vw,1.05rem);
  letter-spacing:.32em;
  text-transform:lowercase;
  margin:0;
}

.cover-date-stack{
  position:absolute;
  right:6.4vw;
  top:13vh;
  display:grid;
  gap:.18em;
  color:#8b1e2d;
  font-family:"Bodoni Moda",serif;
  font-size:clamp(1.4rem,3.2vw,2.2rem);
  line-height:.95;
  text-align:center;
}
.cover-date-stack strong{font-weight:500}

.cover-reference-copy{
  position:absolute;
  left:51%;
  top:48%;
  width:min(34vw,350px);
  transform:translate(-5%,-35%);
  text-align:center;
}
.cover-reference-kicker{
  margin:0 0 1rem;
  font-family:"DM Sans",sans-serif;
  color:#7b7470;
  font-size:clamp(.68rem,1.1vw,.86rem);
  line-height:1.55;
  letter-spacing:.34em;
  text-transform:uppercase;
  font-weight:400;
}
.cover-reference-names{
  display:grid!important;
  justify-items:center;
  gap:0;
  margin:0!important;
  font-family:"Allura",cursive!important;
  color:#6e6864!important;
  font-size:clamp(3rem,7vw,5.7rem)!important;
  line-height:.62!important;
  font-weight:400!important;
}
.cover-reference-names span,
.cover-reference-names em{
  display:block;
  font-family:"Allura",cursive!important;
  font-style:normal;
  font-weight:400;
  color:#6e6864;
}
.cover-reference-names em{
  font-size:.64em!important;
  margin:.14em 0 .08em;
}

.cover-open-link{
  margin-top:2.3rem;
  border:0;
  padding:.5rem .2rem;
  background:transparent;
  color:#8b827e;
  font-family:"DM Sans",sans-serif;
  font-size:clamp(.64rem,.9vw,.76rem);
  font-weight:400;
  letter-spacing:.32em;
  cursor:pointer;
  border-bottom:1px solid transparent;
  transition:.25s ease;
}
.cover-open-link:hover{
  color:#8b1e2d;
  border-bottom-color:#8b1e2d;
}

@media(max-width:700px){
  .cover-frame-reference{inset:3.5vh 5vw}
  .frame-arc{width:80%;height:40%;left:3%}
  .frame-left{left:3%;top:29%;bottom:5%}
  .frame-bottom{left:3%;right:3%;bottom:5%}
  .frame-right{right:3%;top:39%;bottom:5%}
  .cover-side{left:1.3vw;font-size:.76rem}
  .cover-date-stack{right:7vw;top:11vh;font-size:1.55rem}
  .cover-reference-copy{
    left:49%;
    top:50%;
    width:58vw;
    transform:translate(-2%,-30%);
  }
  .cover-reference-names{font-size:clamp(3.4rem,15vw,5rem)!important}
  .cover-reference-kicker{font-size:.64rem}
}


/* COVER OPTION 1 — portrait invitation card centered on desktop */
.opening{
  position:fixed;
  inset:0;
  z-index:50;
  display:grid;
  place-items:center;
  min-height:100svh;
  background:
    radial-gradient(circle at 50% 10%, rgba(255,255,255,.72), transparent 42%),
    linear-gradient(135deg,#f9f5ef,#f1e9df);
  overflow:hidden;
  transition:opacity .75s ease,visibility .75s ease;
}
.opening.hidden{opacity:0;visibility:hidden}

.cover-stage{
  width:100%;
  min-height:100svh;
  display:grid;
  place-items:center;
  padding:28px;
}

.portrait-cover-card{
  position:relative;
  width:min(430px,88vw);
  aspect-ratio:9/15;
  background:#f8f4ee;
  box-shadow:
    0 28px 60px rgba(74,58,48,.14),
    0 2px 10px rgba(74,58,48,.08);
  overflow:hidden;
  border-radius:0 0 24px 24px;
}

.portrait-frame{
  position:absolute;
  inset:5.5% 8.5%;
  pointer-events:none;
}
.portrait-arc{
  position:absolute;
  left:0;
  top:0;
  width:78%;
  height:34%;
  border:1.6px solid #7b746f;
  border-right-color:transparent;
  border-bottom-color:transparent;
  border-radius:54% 46% 0 0;
}
.portrait-left{
  position:absolute;
  left:0;
  top:23%;
  bottom:7%;
  width:1.6px;
  background:#7b746f;
}
.portrait-right{
  position:absolute;
  right:0;
  top:33%;
  bottom:7%;
  width:1.6px;
  background:#7b746f;
}
.portrait-bottom{
  position:absolute;
  left:0;
  right:0;
  bottom:7%;
  height:1.6px;
  background:#7b746f;
  border-radius:999px;
}

.portrait-save-date{
  position:absolute;
  left:5.6%;
  top:50%;
  transform:translateY(-50%) rotate(180deg);
  writing-mode:vertical-rl;
  margin:0;
  font-family:"Bodoni Moda","Italiana",serif;
  font-size:clamp(.72rem,1.8vw,.88rem);
  letter-spacing:.32em;
  color:#7b746f;
  text-transform:lowercase;
}

.portrait-date{
  position:absolute;
  right:9.8%;
  top:13%;
  display:grid;
  gap:.05em;
  text-align:center;
  font-family:"Bodoni Moda","Italiana",serif;
  font-size:clamp(1.45rem,4.8vw,2rem);
  line-height:.95;
  color:#8b1e2d;
}
.portrait-date strong{font-weight:500}

.portrait-copy{
  position:absolute;
  left:50%;
  top:48%;
  width:64%;
  transform:translate(-50%,-35%);
  text-align:center;
}
.portrait-kicker{
  margin:0 0 1rem;
  font-family:"DM Sans",sans-serif;
  font-size:clamp(.62rem,1.8vw,.76rem);
  line-height:1.6;
  letter-spacing:.32em;
  color:#7f7772;
  text-transform:uppercase;
  font-weight:400;
}

.portrait-names{
  display:grid!important;
  justify-items:center;
  margin:0!important;
  font-family:"Allura",cursive!important;
  color:#77706b!important;
  font-size:clamp(3.15rem,11vw,4.8rem)!important;
  line-height:.68!important;
  font-weight:400!important;
}
.portrait-names span,
.portrait-names em{
  display:block;
  font-family:"Allura",cursive!important;
  font-style:normal;
  font-weight:400;
  color:#77706b;
}
.portrait-names em{
  font-size:.62em!important;
  margin:.08em 0 .03em;
}

.portrait-cta-wrap{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin:2.3rem auto .7rem;
  width:76%;
}
.portrait-cta-line{
  display:block;
  height:1px;
  flex:1;
  background:#c2a66d;
}
.portrait-cta-star{
  color:#c2a66d;
  font-size:.72rem;
}

.portrait-open-button{
  border:0;
  background:transparent;
  color:#817974;
  font-family:"DM Sans",sans-serif;
  font-size:clamp(.6rem,1.7vw,.72rem);
  letter-spacing:.3em;
  cursor:pointer;
  padding:.45rem .2rem;
  transition:.25s ease;
}
.portrait-open-button:hover{
  color:#8b1e2d;
  transform:translateY(-1px);
}

@media(max-width:600px){
  .cover-stage{padding:12px}
  .portrait-cover-card{
    width:min(94vw,430px);
    aspect-ratio:9/15.4;
    box-shadow:0 18px 36px rgba(74,58,48,.12);
  }
  .portrait-frame{inset:4.8% 7.5%}
  .portrait-save-date{left:4.2%}
  .portrait-date{right:8.6%;top:11.8%}
  .portrait-copy{top:49%;width:68%}
  .portrait-cta-wrap{margin-top:2rem}
}


/* Rev6 cover tidy fixes */
.portrait-save-date{
  left:4.2%;
  z-index:2;
  background:#f8f4ee;
  padding:.2rem .05rem;
}
.portrait-left{
  left:1.8%;
}
.portrait-copy{
  top:49%;
}
.portrait-names em{
  font-size:.72em!important;
  margin:.02em 0 .04em;
}
.portrait-open-button{
  border:1px solid #b9a07a;
  padding:.78rem 1.35rem;
  letter-spacing:.28em;
  background:transparent;
}
.portrait-open-button:hover{
  border-color:#8b1e2d;
  color:#8b1e2d;
  transform:translateY(-1px);
}
@media(max-width:600px){
  .portrait-save-date{
    left:3.4%;
    padding:.18rem 0;
  }
  .portrait-left{left:1.2%;}
  .portrait-open-button{padding:.72rem 1.1rem;}
}


/* Rev7 arc alignment refinement */
.portrait-arc{
  width:89%;
  height:35%;
  border-width:1.6px;
  border-radius:58% 42% 0 0;
}
.portrait-date{
  right:8.9%;
}
@media(max-width:600px){
  .portrait-arc{
    width:88%;
    height:34%;
  }
  .portrait-date{right:8.2%;}
}


/* Rev8 – tune cover to match approved mockup at browser zoom 100% */
.opening{
  background:
    radial-gradient(circle at 50% 12%, rgba(255,255,255,.85), transparent 36%),
    linear-gradient(135deg,#f7f3ed 0%, #efe9e0 48%, #f6f2eb 100%);
}
.cover-stage{
  padding:20px;
}
.portrait-cover-card{
  width:min(485px, 88vw);
  aspect-ratio: 0.69;
  background:#f8f5ef;
  border-radius:0 0 26px 26px;
  box-shadow:0 24px 55px rgba(74,58,48,.12), 0 2px 10px rgba(74,58,48,.06);
}
.portrait-frame{
  inset:4.8% 7.6%;
}
.portrait-arc{
  left:2.5%;
  top:0.2%;
  width:84.2%;
  height:28.8%;
  border-width:1.5px;
  border-color:#8a837d;
  border-right-color:transparent;
  border-bottom-color:transparent;
  border-radius:57% 43% 0 0;
}
/* split left guide line so save-the-date sits cleanly between line segments */
.portrait-left{display:none;}
.portrait-frame::before,
.portrait-frame::after{
  content:"";
  position:absolute;
  left:2.5%;
  width:1.5px;
  background:#8a837d;
}
.portrait-frame::before{
  top:24.7%;
  height:10.5%;
}
.portrait-frame::after{
  top:67.8%;
  bottom:7.2%;
}
.portrait-right{
  right:2.5%;
  top:36.5%;
  bottom:7.2%;
  width:1.5px;
  background:#8a837d;
}
.portrait-bottom{
  left:2.5%;
  right:2.5%;
  bottom:7.2%;
  height:1.5px;
  background:#8a837d;
  border-radius:0 0 999px 999px;
}
.portrait-save-date{
  left:4.2%;
  top:52.6%;
  transform:translateY(-50%) rotate(180deg);
  font-family:"Bodoni Moda","Italiana",serif;
  font-size:clamp(.76rem,1.55vw,.98rem);
  line-height:1;
  letter-spacing:.24em;
  color:#8a837d;
  background:#f8f5ef;
  padding:.38rem .06rem;
  z-index:3;
}
.portrait-date{
  right:8.8%;
  top:12.9%;
  gap:.06em;
  font-size:clamp(2rem,4.2vw,2.5rem);
  line-height:.9;
  color:#972536;
}
.portrait-copy{
  left:50%;
  top:56%;
  width:49%;
  transform:translate(-50%,-40%);
}
.portrait-kicker{
  margin:0 0 1.1rem;
  font-size:clamp(.82rem,1.22vw,.98rem);
  line-height:1.62;
  letter-spacing:.36em;
  color:#948b84;
}
.portrait-names{
  font-size:clamp(4rem,7.2vw,5.3rem)!important;
  line-height:.68!important;
  color:#8d857e!important;
}
.portrait-names span,
.portrait-names em{
  color:#8d857e!important;
}
.portrait-names em{
  font-size:.52em!important;
  margin:.04em 0 .05em;
}
.portrait-cta-wrap{
  width:78%;
  margin:2.55rem auto .95rem;
  gap:10px;
}
.portrait-cta-line{
  background:#d7bb81;
}
.portrait-cta-star{
  color:#d7bb81;
  font-size:.66rem;
}
.portrait-open-button{
  min-width:220px;
  padding:.86rem 1.45rem;
  border:1px solid rgba(215,187,129,.72);
  color:#8a837d;
  font-size:clamp(.69rem,1vw,.8rem);
  letter-spacing:.29em;
  background:transparent;
}
@media(max-width:900px){
  .portrait-cover-card{width:min(455px, 90vw);}
}
@media(max-width:600px){
  .cover-stage{padding:12px;}
  .portrait-cover-card{
    width:min(95vw, 460px);
  }
  .portrait-frame{inset:4.6% 7%;}
  .portrait-arc{
    left:2.4%;
    width:84%;
    height:28%;
  }
  .portrait-frame::before,
  .portrait-frame::after{left:2.4%;}
  .portrait-right,.portrait-bottom{right:2.4%;}
  .portrait-bottom{left:2.4%;}
  .portrait-save-date{
    left:3.35%;
    top:52.8%;
    font-size:.8rem;
  }
  .portrait-date{
    right:7.7%;
    top:12.7%;
    font-size:2rem;
  }
  .portrait-copy{
    width:53%;
    top:56.5%;
  }
  .portrait-kicker{
    font-size:.78rem;
    letter-spacing:.28em;
  }
  .portrait-names{
    font-size:clamp(3.8rem,14vw,5rem)!important;
  }
  .portrait-open-button{
    min-width:200px;
    padding:.82rem 1.1rem;
  }
}


/* Rev9 — Bride & Groom heading font */
.couple-section .section-heading h2{
  font-family:"Cormorant Garamond", Georgia, serif;
  font-weight:500;
  letter-spacing:-0.025em;
}

/* Rev10 — cover names use Parisienne */
.portrait-names,
.portrait-names span,
.portrait-names em{
  font-family:"Parisienne", cursive !important;
}

/* Rev11 — cover names use Great Vibes */
.portrait-names,
.portrait-names span,
.portrait-names em{
  font-family:"Great Vibes", cursive !important;
}


/* Rev12 – adjust Great Vibes spacing so Kale & Ancis breathes more */
.portrait-copy{
  width:44%;
  top:54.8%;
}
.portrait-names{
  font-size:clamp(3.25rem, 6.2vw, 4.75rem) !important;
  line-height:.82 !important;
}
.portrait-names em{
  font-size:.42em !important;
  margin:.12em 0 .14em;
}
.portrait-cta-wrap{
  margin:2.15rem auto .9rem;
}
@media(max-width:600px){
  .portrait-copy{
    width:49%;
    top:55.4%;
  }
  .portrait-names{
    font-size:clamp(3.1rem, 12.3vw, 4.35rem) !important;
    line-height:.84 !important;
  }
  .portrait-names em{
    margin:.1em 0 .12em;
  }
}


/* Rev13 – more airy & spacious Great Vibes cover name */
.portrait-copy{
  width:42%;
  top:54.5%;
}
.portrait-names{
  font-size:clamp(3.0rem, 5.7vw, 4.35rem) !important;
  line-height:.93 !important;
}
.portrait-names em{
  font-size:.36em !important;
  margin:.22em 0 .24em;
}
.portrait-cta-wrap{
  margin:2.45rem auto 1rem;
}
.portrait-open-button{
  min-width:230px;
}
@media(max-width:900px){
  .portrait-copy{
    width:44%;
    top:54.9%;
  }
}
@media(max-width:600px){
  .portrait-copy{
    width:48%;
    top:55.8%;
  }
  .portrait-names{
    font-size:clamp(2.95rem, 11.5vw, 4.05rem) !important;
    line-height:.96 !important;
  }
  .portrait-names em{
    font-size:.35em !important;
    margin:.2em 0 .22em;
  }
  .portrait-cta-wrap{
    margin:2.2rem auto .95rem;
  }
}


/* Rev14 – increase space between “FOR THE WEDDING OF” and “Kale” */
.portrait-kicker{
  margin-bottom:1.9rem;
}
@media(max-width:600px){
  .portrait-kicker{
    margin-bottom:1.65rem;
  }
}


/* Rev15 — editorial wedding event cards, plain background */
.event-section{
  background:transparent;
}
.event-heading{
  text-align:center;
}
.event-heading h2::after{
  margin-left:auto;
  margin-right:auto;
}
.event-stack-editorial{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:34px;
  align-items:stretch;
}
.event-panel-editorial{
  position:relative;
  background:transparent;
  border:1px solid rgba(179,140,74,.48);
  padding:56px 44px 46px;
  text-align:center;
  min-height:520px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  clip-path:polygon(
    8% 0, 92% 0,
    92% 2%, 96% 2%,
    96% 6%, 100% 6%,
    100% 100%, 0 100%,
    0 6%, 4% 6%,
    4% 2%, 8% 2%
  );
}
.event-panel-editorial::before{
  content:"";
  position:absolute;
  inset:8px;
  border:1px solid rgba(179,140,74,.22);
  pointer-events:none;
  clip-path:inherit;
}
.event-border-accent{
  width:66px;
  height:2px;
  background:#8b1e2d;
  margin:0 auto 28px;
}
.event-type{
  margin:0 0 12px;
  color:#756c66;
  font-family:"DM Sans",sans-serif;
  font-size:.75rem;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.event-venue-highlight{
  margin:0 0 24px;
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(2rem,3.2vw,3rem);
  line-height:1.05;
  font-weight:500;
  color:#3a332f;
}
.event-date,
.event-time,
.event-address{
  margin:0;
  font-family:"DM Sans",sans-serif;
  color:#4f4843;
}
.event-date{
  margin-top:10px;
  font-weight:500;
}
.event-time{
  margin-top:4px;
  color:#8b1e2d;
  font-weight:600;
}
.event-address{
  margin-top:28px;
  line-height:1.75;
  max-width:420px;
}
.event-location-button{
  margin-top:auto;
  min-width:180px;
  border-color:rgba(179,140,74,.75);
  color:#8b1e2d;
}
.event-location-button:hover{
  border-color:#8b1e2d;
}
@media(max-width:820px){
  .event-stack-editorial{
    grid-template-columns:1fr;
    gap:24px;
  }
  .event-panel-editorial{
    min-height:0;
    padding:46px 28px 38px;
  }
  .event-location-button{
    margin-top:34px;
  }
}

/* Final integration: music and RSVP status */
.music-toggle{display:grid;place-items:center;transition:.25s ease;cursor:pointer}
.music-toggle.playing{background:#8b1e2d;color:#fff;border-color:#8b1e2d;animation:musicPulse 2s ease-in-out infinite}
@keyframes musicPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
.form-note{min-height:1.5em;color:#8b1e2d;line-height:1.5}
#rsvpSubmit:disabled{opacity:.6;cursor:wait}


/* Final refinement — align “save the date” with the frame line */
.portrait-save-date{
  left:9.7%;
  transform:translate(-50%,-50%) rotate(180deg);
}

@media(max-width:600px){
  .portrait-save-date{
    left:9.25%;
    transform:translate(-50%,-50%) rotate(180deg);
  }
}

/* Final mobile gallery — preserve the desktop collage composition */
@media(max-width:820px){
  .gallery-grid{
    grid-template-columns:repeat(12,minmax(0,1fr));
    grid-auto-rows:clamp(20px,5vw,38px);
    gap:clamp(4px,1vw,8px);
  }

  .g1{grid-column:1/6!important;grid-row:1/8!important}
  .g2{grid-column:6/13!important;grid-row:1/5!important}
  .g3{grid-column:6/10!important;grid-row:5/11!important}
  .g4{grid-column:10/13!important;grid-row:5/9!important}
  .g5{grid-column:1/5!important;grid-row:8/13!important}
  .g6{grid-column:5/9!important;grid-row:11/16!important}
  .g7{grid-column:9/13!important;grid-row:9/16!important}

  .gallery-item{
    min-width:0;
    min-height:0;
  }
}

@media(max-width:520px){
  .gallery-grid{
    grid-template-columns:repeat(12,minmax(0,1fr));
    grid-auto-rows:clamp(18px,5vw,24px);
    gap:4px;
  }
}


/* Mobile gallery v2 — compact asymmetric collage, no empty half-row */
@media(max-width:820px){
  .gallery-section{
    padding-top:72px;
    padding-bottom:72px;
  }

  .gallery-section .section-heading{
    margin-bottom:28px;
  }

  .gallery-grid{
    display:grid!important;
    grid-template-columns:repeat(12,minmax(0,1fr))!important;
    grid-template-rows:repeat(15,clamp(22px,5.6vw,34px))!important;
    grid-auto-rows:unset!important;
    gap:6px!important;
    width:100%;
    overflow:hidden;
  }

  .gallery-item{
    width:100%;
    height:100%;
    min-width:0;
    min-height:0;
    display:block;
  }

  .gallery-item img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
  }

  .g1{grid-column:1/6!important;grid-row:1/8!important}
  .g2{grid-column:6/13!important;grid-row:1/5!important}
  .g3{grid-column:6/10!important;grid-row:5/11!important}
  .g4{grid-column:10/13!important;grid-row:5/9!important}
  .g5{grid-column:1/5!important;grid-row:8/13!important}
  .g6{grid-column:5/9!important;grid-row:11/16!important}
  .g7{grid-column:9/13!important;grid-row:9/16!important}
}

@media(max-width:520px){
  .gallery-section{
    padding-left:20px;
    padding-right:20px;
    padding-bottom:64px;
  }

  .gallery-grid{
    grid-template-columns:repeat(12,minmax(0,1fr))!important;
    grid-template-rows:repeat(15,clamp(18px,5.2vw,25px))!important;
    gap:5px!important;
  }
}

/* Live Wishes */
.wish-list article p{
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  line-height:1.7;
}
.wish-loading,
.wish-empty{
  grid-column:1/-1;
  margin:0;
  padding:24px 0;
  color:#756c66;
  line-height:1.7;
}


/* =========================================================
   FINAL PREMIUM COVER POLISH
   Same approved editorial layout, refined for desktop/mobile
   ========================================================= */

.opening{
  background:
    radial-gradient(circle at 50% 7%, rgba(255,255,255,.92), transparent 34%),
    linear-gradient(135deg,#f8f4ed 0%,#eee7dd 48%,#f7f2ea 100%);
}

.cover-stage{
  padding:clamp(12px,2vw,24px);
}

.portrait-cover-card{
  isolation:isolate;
  overflow:hidden;
  background:
    radial-gradient(circle at 22% 14%, rgba(255,255,255,.55), transparent 25%),
    linear-gradient(180deg,#faf7f1 0%,#f7f2ea 100%);
  border:1px solid rgba(130,114,99,.12);
  box-shadow:
    0 32px 70px rgba(67,50,39,.14),
    0 8px 24px rgba(67,50,39,.07),
    inset 0 1px 0 rgba(255,255,255,.85);
}

.portrait-cover-card::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:.16;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(95,78,65,.10) 0 .45px, transparent .6px),
    radial-gradient(circle at 70% 65%, rgba(95,78,65,.08) 0 .4px, transparent .55px);
  background-size:8px 8px,11px 11px;
  mix-blend-mode:multiply;
}

.portrait-frame{
  filter:drop-shadow(0 .3px 0 rgba(255,255,255,.8));
}

.portrait-arc,
.portrait-frame::before,
.portrait-frame::after,
.portrait-right,
.portrait-bottom{
  background-color:#817973;
  border-color:#817973;
}

.portrait-arc{
  border-width:1.55px;
}

.portrait-frame::before,
.portrait-frame::after,
.portrait-right,
.portrait-bottom{
  width:1.55px;
}

.portrait-bottom{
  height:1.55px;
}

.portrait-save-date{
  left:4.25%;
  color:#817973;
  background:#f8f4ed;
  padding:.46rem .08rem;
  letter-spacing:.27em;
  font-weight:400;
}

.portrait-date{
  color:#9a3947;
  font-weight:500;
  letter-spacing:.01em;
  text-shadow:0 1px 0 rgba(255,255,255,.75);
}

.portrait-kicker{
  color:#8d827a;
  font-weight:400;
  letter-spacing:.35em;
}

.portrait-names,
.portrait-names span,
.portrait-names em{
  color:#756d67!important;
  text-shadow:0 1px 0 rgba(255,255,255,.8);
}

.portrait-names em{
  color:#a88a56!important;
}

.portrait-cta-wrap{
  margin-top:2.35rem;
}

.portrait-cta-line{
  background:linear-gradient(90deg,transparent,#c5a66b 18%,#c5a66b 82%,transparent);
}

.portrait-cta-star{
  color:#bd9b5f;
  transform:translateY(-.5px);
}

.portrait-open-button{
  min-width:224px;
  min-height:48px;
  border:1px solid rgba(177,140,77,.62);
  color:#766e68;
  background:rgba(255,255,255,.14);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.45),
    0 6px 16px rgba(84,63,46,.04);
  transition:
    transform .25s ease,
    border-color .25s ease,
    background-color .25s ease,
    color .25s ease,
    box-shadow .25s ease;
}

.portrait-open-button:hover,
.portrait-open-button:focus-visible{
  color:#8b1e2d;
  border-color:rgba(139,30,45,.7);
  background:rgba(255,255,255,.34);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.58),
    0 9px 22px rgba(84,63,46,.08);
  transform:translateY(-2px);
  outline:none;
}

.portrait-open-button:active{
  transform:translateY(0);
}

@media(max-width:600px){
  .opening{
    min-height:100svh;
  }

  .cover-stage{
    min-height:100svh;
    padding:10px;
  }

  .portrait-cover-card{
    width:min(94vw,430px);
    max-height:calc(100svh - 20px);
    aspect-ratio:9/15.55;
    border-radius:0 0 22px 22px;
    box-shadow:
      0 22px 48px rgba(67,50,39,.14),
      0 5px 16px rgba(67,50,39,.06);
  }

  .portrait-frame{
    inset:4.4% 6.8%;
  }

  .portrait-arc{
    left:2.35%;
    width:84.4%;
    height:28.5%;
  }

  .portrait-frame::before,
  .portrait-frame::after{
    left:2.35%;
  }

  .portrait-right{
    right:2.35%;
  }

  .portrait-bottom{
    left:2.35%;
    right:2.35%;
  }

  .portrait-save-date{
    left:3.18%;
    top:52.4%;
    font-size:clamp(.72rem,3.1vw,.84rem);
    padding:.34rem .05rem;
    letter-spacing:.23em;
  }

  .portrait-date{
    right:7.5%;
    top:12.6%;
    font-size:clamp(1.75rem,8vw,2.15rem);
  }

  .portrait-copy{
    top:55.2%;
    width:52%;
  }

  .portrait-kicker{
    margin-bottom:1rem;
    font-size:clamp(.66rem,2.8vw,.78rem);
    line-height:1.55;
    letter-spacing:.26em;
  }

  .portrait-names{
    font-size:clamp(3rem,13.2vw,4.35rem)!important;
    line-height:.84!important;
  }

  .portrait-names em{
    margin:.11em 0 .13em;
  }

  .portrait-cta-wrap{
    width:82%;
    margin:1.9rem auto .82rem;
  }

  .portrait-open-button{
    min-width:188px;
    min-height:44px;
    padding:.76rem 1rem;
    font-size:.66rem;
    letter-spacing:.25em;
  }
}

@media(max-width:380px){
  .portrait-copy{
    top:54.7%;
    width:54%;
  }

  .portrait-save-date{
    left:3.05%;
    font-size:.7rem;
  }

  .portrait-open-button{
    min-width:176px;
  }
}


/* Wedding Gift preference note */
.gift-preference-note{
  max-width:760px;
  margin:34px auto 0;
  padding-top:28px;
  border-top:1px solid rgba(117,108,102,.22);
  text-align:center;
  color:#83766d;
}

.gift-preference-note p{
  max-width:680px;
  margin:0 auto;
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(.76rem,.95vw,.92rem);
  font-style:italic;
  font-weight:400;
  line-height:1.55;
  letter-spacing:.01em;
}

.gift-preference-icons{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:16px;
  margin-top:18px;
}

.gift-preference-icon{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  color:#9a8c81;
}

.gift-preference-icon svg{
  width:100%;
  height:100%;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.gift-preference-divider{
  width:1px;
  height:28px;
  background:rgba(154,140,129,.34);
}

@media(max-width:820px){
  .gift-preference-note{
    max-width:620px;
    margin-top:28px;
    padding-top:24px;
  }
}

@media(max-width:520px){
  .gift-section{
    padding-left:20px;
    padding-right:20px;
  }

  .gift-preference-note{
    width:100%;
    margin-top:24px;
    padding-top:20px;
  }

  .gift-preference-note p{
    max-width:300px;
    font-size:.72rem;
    line-height:1.5;
  }

  .gift-preference-icons{
    gap:13px;
    margin-top:15px;
  }

  .gift-preference-icon{
    width:32px;
    height:32px;
  }

  .gift-preference-divider{
    height:24px;
  }
}


/* Explicit custom icons: Indonesian standing flower board + oversized gift */
.gift-preference-icon{
  width:42px;
  height:42px;
}

.gift-preference-icon svg{
  overflow:visible;
}

.gift-preference-icon .icon-ring,
.gift-preference-icon .icon-main,
.gift-preference-icon .icon-slash{
  fill:none;
  stroke:currentColor;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.gift-preference-icon .icon-ring{
  stroke-width:1.45;
  opacity:.82;
}

.gift-preference-icon .icon-main{
  stroke-width:1.7;
}

.gift-preference-icon .icon-slash{
  stroke-width:2.1;
}

.gift-preference-icon .icon-dot{
  fill:currentColor;
  stroke:none;
}

@media(max-width:520px){
  .gift-preference-icon{
    width:34px;
    height:34px;
  }
}
