:root{
  --navy:#17395f;
  --royal:#315d91;
  --sky:#c6d8e9;
  --ivory:#f8f5ed;
  --paper:#fffdf7;
  --gold:#b5975c;
  --gold-light:#e0cfaa;
  --ink:#27364a;
  --muted:#667184;
  --serif:'Cormorant Garamond',Georgia,serif;
  --script:'Great Vibes','Brush Script MT',cursive;
  --ease:cubic-bezier(.22,.72,.24,1)
}

*{
  box-sizing:border-box
}
 [hidden]{
  display:none!important
}
html{
  scroll-behavior:smooth;
  scroll-padding-top:24px
}
body{
  margin:0;
  color:var(--ink);
  background:var(--ivory);
  font-family:var(--serif);
  font-size:18px;
  line-height:1.55
}
body.cover-lock{
  overflow:hidden
}
button,input,select,textarea{
  font:inherit
}
button,a,select,input{
   -webkit-tap-highlight-color:transparent
}
a{
  color:inherit
}
.section-shell{
  width:min(1160px,calc(100% - 64px));
  margin-inline:auto
}
.brand{
  margin:0;
  color:var(--navy);
  font-family:var(--serif);
  font-size:1.15rem;
  letter-spacing:.22em;
  text-align:center
}
.brand span{
  display:block;
  margin-top:-4px;
  color:var(--gold);
  font-size:.67rem;
  letter-spacing:.31em;
  text-transform:uppercase
}
.brand--small{
  font-size:.88rem
}
.brand--small span{
  font-size:.58rem
}
.gold-rule{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin:22px auto;
  width:132px;
  color:var(--gold)
}
.gold-rule:before,.gold-rule:after{
  content:"";
  height:1px;
  flex:1;
  background:linear-gradient(90deg,transparent,var(--gold))
}
.gold-rule:after{
  transform:rotate(180deg)
}
.gold-rule i{
  width:7px;
  height:7px;
  border:1px solid var(--gold);
  transform:rotate(45deg)
}
.eyebrow{
  margin:0 0 10px;
  color:#9b7d48;
  font-size:.75rem;
  letter-spacing:.22em;
  text-transform:uppercase
}
.section-title{
  margin:0;
  color:var(--navy);
  font-weight:500;
  font-size:clamp(2.2rem,4vw,3.55rem);
  line-height:1.05
}
.text-link{
  display:inline-flex;
  gap:10px;
  align-items:center;
  color:var(--navy);
  font-size:.9rem;
  letter-spacing:.08em;
  text-decoration:none;
  border-bottom:1px solid var(--gold);
  padding-bottom:5px
}


/* Gift introduction */
.welcome{
  position:fixed;
  z-index:20;
  inset:0;
  display:grid;
  place-items:center;
  overflow:hidden;
  visibility:visible;
  opacity:1;
  background:radial-gradient(ellipse at 50% 46%,#fffdf9 0,#f8f5ed 48%,#e9edf0 100%);
  transition:opacity 1.15s var(--ease),visibility 1.15s
}
.welcome:before{
  position:absolute;
  inset:18px;
  content:"";
  border:1px solid rgba(181,151,92,.56);
  outline:1px solid rgba(181,151,92,.2);
  outline-offset:6px;
  pointer-events:none
}
.welcome-frame{
  position:absolute;
  inset:34px;
  border:1px solid rgba(181,151,92,.25);
  pointer-events:none
}
.welcome-flower{
  position:absolute;
  width:min(34vw,420px);
  height:auto;
  pointer-events:none;
  opacity:.82
}
.welcome-flower--top{
  top:-8%;
  left:-6%;
  transform:rotate(4deg)
}
.welcome-flower--bottom{
  right:-7%;
  bottom:-13%;
  transform:rotate(180deg)
}
.welcome-rose{position:absolute;z-index:1;top:3%;right:8%;width:min(19vw,245px);opacity:.72;transform:rotate(9deg);filter:drop-shadow(0 10px 18px rgba(31,49,68,.12));pointer-events:none}
.welcome-content{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  width:min(790px,92vw);
  padding:24px 18px;
  text-align:center
}
.welcome-kicker{
  margin:10px 0 0;
  color:var(--muted);
  font-size:.87rem;
  letter-spacing:.15em
}
.welcome h1{
  margin:2px 0 0;
  color:var(--navy);
  font-family:var(--script);
  font-size:clamp(2.25rem,6.7vw,4.55rem);
  font-weight:400;
  line-height:1.15
}
.welcome h1 span{
  color:var(--gold);
  font-size:.8em
}
.welcome-subtitle{
  margin:0;
  color:#9b7d48;
  font-size:.86rem;
  letter-spacing:.24em;
  text-transform:uppercase
}
.open-hint{
  margin:0;
  color:var(--navy);
  font-size:.75rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  transition:opacity .7s
}
.wedding-date{
  margin:12px 0 0;
  color:#8b754e;
  font-size:.8rem;
  letter-spacing:.2em
}


/* Main invitation: first section retains its established composition */
.invitation-page{
  overflow:hidden;
  background:var(--ivory);
  opacity:1;
  transition:opacity 1.25s var(--ease)
}
.invitation-page[aria-hidden="true"]{
  opacity:0
}
.hero{
  position:relative;
  display:grid;
  min-height:min(850px,100svh);
  place-items:center;
  padding:100px 0 82px;
  isolation:isolate
}
.hero:before{
  position:absolute;
  z-index:-1;
  inset:28px 0;
  border:1px solid rgba(181,151,92,.43);
  content:""
}
.hero:after{
  position:absolute;
  z-index:-1;
  inset:38px 10px;
  border:1px solid rgba(181,151,92,.22);
  content:""
}
.hero-copy{
  max-width:650px;
  text-align:center
}
.hero-copy .eyebrow{
  margin-top:25px
}
.hero h2{
  margin:4px 0 12px;
  color:var(--navy);
  font-family:var(--script);
  font-size:clamp(3.2rem,7.8vw,6rem);
  font-weight:400;
  line-height:.95
}
.hero h2 i{
  color:var(--gold);
  font-weight:400
}
.hero-lead{
  max-width:460px;
  margin:14px auto;
  color:var(--muted);
  font-size:1.13rem
}
.hero-date{
  margin:18px 0 27px;
  color:var(--navy);
  font-size:1.1rem;
  letter-spacing:.1em
}
.hero-emblem{
  position:absolute;
  right:7%;
  bottom:12%;
  display:grid;
  width:138px;
  height:138px;
  place-content:center;
  border:1px solid var(--gold);
  border-radius:50%;
  outline:1px solid rgba(181,151,92,.45);
  outline-offset:6px;
  color:var(--navy);
  text-align:center;
  background:rgba(255,253,247,.72)
}
.hero-emblem span,.hero-emblem i{
  font-size:.72rem;
  font-style:normal;
  letter-spacing:.06em
}
.hero-emblem strong{
  font-size:2.7rem;
  font-weight:500;
  line-height:.95
}
.hero-emblem b{
  font-size:.82rem;
  letter-spacing:.1em
}
.hero-flower{
  position:absolute;
  z-index:-1;
  width:min(31vw,370px);
  opacity:.72;
  pointer-events:none
}
.hero-flower--left{
  top:2%;
  left:-3%;
  transform:rotate(5deg)
}
.hero-flower--right{
  right:-3%;
  bottom:0;
  transform:rotate(180deg)
}
.hero-ornament{
  position:absolute;
  bottom:34px;
  left:50%;
  display:flex;
  align-items:center;
  gap:9px;
  transform:translateX(-50%);
  color:var(--gold)
}
.hero-ornament span{
  width:32px;
  height:1px;
  background:var(--gold)
}
.hero-ornament i{
  width:8px;
  height:8px;
  border:1px solid var(--gold);
  transform:rotate(45deg)
}


/* Secondary sections */
.countdown-section{
  position:relative;
  display:grid;
  grid-template-columns:minmax(230px,.85fr) 1.3fr;
  align-items:center;
  gap:clamp(36px,7vw,100px);
  padding-block:92px 112px
}
.countdown-copy{
  text-align:center
}
.countdown-copy .section-title{
  font-size:clamp(2rem,4vw,3.2rem)
}
.countdown-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin:33px 0 16px
}
.clock-unit{
  position:relative;
  padding:12px 5px 10px;
  border-top:1px solid var(--gold);
  border-bottom:1px solid rgba(181,151,92,.5)
}
.clock-unit:before,.clock-unit:after{
  position:absolute;
  top:-4px;
  width:7px;
  height:7px;
  border:1px solid var(--gold);
  background:var(--ivory);
  content:"";
  transform:rotate(45deg)
}
.clock-unit:before{
  left:-3px
}
.clock-unit:after{
  right:-3px
}
.clock-unit strong{
  display:block;
  color:var(--navy);
  font-size:clamp(1.75rem,3.3vw,2.8rem);
  font-weight:500;
  line-height:1
}
.clock-unit span{
  display:block;
  margin-top:7px;
  color:var(--muted);
  font-size:.7rem;
  letter-spacing:.12em;
  text-transform:uppercase
}
.countdown-note{
  margin:0;
  color:var(--muted);
  font-size:.85rem
}
.memory-photo,.story-photo,.attire-photo{
  position:relative;
  z-index:1;
  margin:0;
  text-align:center
}
.photo-frame{
  padding:13px;
  background:var(--paper);
  box-shadow:0 20px 45px rgba(31,49,68,.12);
  outline:1px solid rgba(181,151,92,.65);
  outline-offset:5px
}
.photo-mat{
  overflow:hidden;
  padding:7px;
  border:1px solid var(--gold-light);
  background:#f4efe4
}
.photo-mat img{
  display:block;
  width:100%;
  height:auto;
  max-height:590px;
  object-fit:contain;
  object-position:center
}
.photo-frame--oval{
  width:min(300px,100%);
  margin-inline:auto;
  border-radius:48% 48% 4px 4px
}
.photo-frame--oval .photo-mat{
  border-radius:48% 48% 2px 2px
}
.photo-frame--oval .photo-mat img{
  max-height:none;
  border-radius:48% 48% 0 0
}
.photo-frame figcaption{
  padding:12px 4px 1px;
  color:#806d4a;
  font-family:var(--script);
  font-size:1.55rem
}
.section-flower{
  position:absolute;
  z-index:0;
  width:min(28vw,320px);
  opacity:.36;
  pointer-events:none
}
.section-flower--countdown{
  right:-10%;
  bottom:-12%;
  transform:rotate(180deg)
}
.story-section{
  position:relative;
  padding:88px 0 96px;
  background:linear-gradient(115deg,#e8eef2 0%,#f4f2ec 55%,#e2ebf2 100%);
  isolation:isolate
}
.story-section:before{
  position:absolute;
  inset:20px 0;
  border-block:1px solid rgba(181,151,92,.45);
  content:"";
  pointer-events:none
}
.story-layout{
  position:relative;
  display:grid;
  grid-template-columns:1fr minmax(280px,.83fr);
  align-items:center;
  gap:clamp(40px,9vw,130px)
}
.ornate-panel{
  position:relative;
  padding:clamp(32px,5vw,58px);
  text-align:center
}
.ornate-panel:before{
  position:absolute;
  inset:9px;
  border:1px solid rgba(181,151,92,.62);
  content:"";
  pointer-events:none
}
.ornate-panel:after{
  position:absolute;
  inset:0;
  border:1px solid rgba(181,151,92,.25);
  content:"";
  clip-path:polygon(0 0,18% 0,18% 1px,82% 1px,82% 0,100% 0,100% 18%,99% 18%,99% 82%,100% 82%,100% 100%,82% 100%,82% 99%,18% 99%,18% 100%,0 100%,0 82%,1% 82%,1% 18%,0 18%);
  pointer-events:none
}
.ornate-panel--blue{
  background:rgba(255,253,247,.47)
}
.ornate-panel--light{
  background:rgba(255,253,247,.78)
}
.story-copy p:not(.eyebrow),.attire-copy p:not(.eyebrow){
  max-width:440px;
  margin:20px auto 0;
  color:var(--muted);
  font-size:1.15rem
}
.story-photo{
  width:min(370px,100%);
  justify-self:center;
  transform:rotate(1deg)
}
.photo-frame--tall .photo-mat img{
  max-height:none
}
.section-flower--story{
  right:-8%;
  bottom:-18%;
  transform:rotate(182deg);
  opacity:.27
}
.events-section{
  position:relative;
  padding-block:105px 110px;
  text-align:center;
  isolation:isolate
}
.section-heading{
  position:relative;
  width:max-content;
  max-width:100%;
  margin:0 auto 48px;
  padding:0 35px 22px
}
.ornate-heading:after{
  position:absolute;
  right:25%;
  bottom:0;
  left:25%;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
  content:""
}
.event-date{
  margin:16px 0 0;
  color:#816f4c;
  letter-spacing:.09em
}
.events-grid{
  position:relative;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:26px;
  text-align:center
}
.event-panel{
  position:relative;
  min-height:300px;
  padding:42px 36px 36px;
  background:linear-gradient(145deg,rgba(255,253,247,.93),rgba(239,237,227,.76));
  outline:1px solid rgba(181,151,92,.55);
  outline-offset:-8px;
  border:1px solid rgba(181,151,92,.22);
  box-shadow:0 18px 45px rgba(31,49,68,.07)
}
.event-panel:before,.event-panel:after{
  position:absolute;
  width:33px;
  height:33px;
  border-color:var(--gold);
  border-style:solid;
  content:""
}
.event-panel:before{
  top:13px;
  left:13px;
  border-width:1px 0 0 1px
}
.event-panel:after{
  right:13px;
  bottom:13px;
  border-width:0 1px 1px 0
}
.event-index{
  display:inline-grid;
  width:34px;
  height:34px;
  place-items:center;
  margin-bottom:11px;
  border:1px solid var(--gold);
  border-radius:50%;
  color:#927749;
  font-size:.84rem
}
.event-panel h3{
  margin:3px 0 13px;
  color:var(--navy);
  font-size:1.65rem;
  font-weight:500;
  line-height:1.12
}
.event-panel p:not(.eyebrow){
  max-width:370px;
  margin:0 auto 20px;
  color:var(--muted)
}
.map-button{
  display:inline-flex;
  gap:14px;
  align-items:center;
  padding:9px 0;
  border-bottom:1px solid var(--gold);
  color:var(--navy);
  font-size:.88rem;
  letter-spacing:.08em;
  text-decoration:none
}
.schedule-note{
  margin:29px 0 0;
  color:var(--muted);
  font-size:.87rem
}
.section-flower--events{
  top:4%;
  left:-11%;
  opacity:.27
}
.attire-section{
  position:relative;
  padding:83px 0 96px;
  background:#e7edf0;
  isolation:isolate
}
.attire-section:before{
  position:absolute;
  inset:18px 0;
  border-block:1px solid rgba(181,151,92,.48);
  content:""
}
.attire-layout{
  display:grid;
  grid-template-columns:minmax(300px,1.05fr) .95fr;
  align-items:center;
  gap:clamp(45px,8vw,110px)
}
.attire-photo{
  transform:rotate(-1deg)
}
.photo-frame--wide .photo-mat img{
  max-height:none
}
.music-section{
  position:relative;
  display:grid;
  grid-template-columns:.75fr 1.4fr;
  align-items:center;
  gap:40px;
  padding-block:100px
}
.music-copy .section-title{
  font-size:clamp(2rem,4vw,3rem)
}
.music-player{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:58px 1fr minmax(130px,.7fr);
  align-items:center;
  gap:20px;
  padding:22px 24px;
  border:1px solid rgba(181,151,92,.62);
  background:linear-gradient(130deg,#fffdf8,#f1eee5);
  box-shadow:0 18px 42px rgba(31,49,68,.09)
}
.music-player:before{
  position:absolute;
  inset:6px;
  border:1px solid rgba(181,151,92,.24);
  content:"";
  pointer-events:none
}
.music-player audio{
  display:none
}
.play-button{
  position:relative;
  z-index:1;
  display:grid;
  width:48px;
  height:48px;
  place-items:center;
  border:1px solid var(--gold);
  border-radius:50%;
  color:var(--navy);
  background:transparent;
  cursor:pointer
}
.play-button svg{
  width:20px;
  height:20px;
  fill:currentColor
}
.icon-pause{
  display:none
}
.music-player.is-playing .icon-play{
  display:none
}
.music-player.is-playing .icon-pause{
  display:block
}
.track-info,.volume-control{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column
}
.track-label,.volume-control span{
  color:#90774b;
  font-size:.68rem;
  letter-spacing:.14em;
  text-transform:uppercase
}
.track-status{
  margin-top:5px;
  color:var(--muted);
  font-size:.78rem
}
.volume-control input{
  width:100%;
  margin:10px 0 0;
  accent-color:#9a7b43
}
.audio-unlock{
  position:absolute;
  right:18px;
  bottom:-39px;
  border:0;
  border-bottom:1px solid var(--gold);
  color:var(--navy);
  background:none;
  font-size:.8rem;
  cursor:pointer
}
.music-flower{
  position:absolute;
  z-index:0;
  right:-10%;
  bottom:-25%;
  width:min(27vw,300px);
  opacity:.27;
  transform:rotate(180deg)
}


/* Attendance and footer */
.rsvp-section{
  position:relative;
  padding:95px 0 100px;
  background:linear-gradient(125deg,#24486e,#315d86 60%,#193b60);
  color:#f9f5eb
}
.rsvp-section:before{
  position:absolute;
  inset:18px;
  border:1px solid rgba(224,207,170,.65);
  content:"";
  pointer-events:none
}
.rsvp-layout{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:clamp(40px,8vw,100px);
  align-items:start
}
.rsvp-copy{
  color:var(--ink)
}
.rsvp-copy .section-title{
  font-size:clamp(2.1rem,4vw,3rem)
}
.rsvp-copy p:not(.eyebrow){
  color:#576577
}
.rsvp-copy strong{
  color:var(--navy)
}
.privacy-note{
  font-size:.9rem
}
.rsvp-form{
  display:grid;
  gap:18px;
  padding:28px;
  border:1px solid rgba(224,207,170,.55);
  background:rgba(255,253,247,.97);
  color:var(--ink)
}
.field{
  display:grid;
  gap:7px
}
.field>span,.field legend{
  color:var(--navy);
  font-size:.9rem
}
.field small{
  color:var(--muted)
}
.field input[type=text],.field select,.field textarea{
  width:100%;
  padding:11px 12px;
  border:1px solid #c8b98f;
  border-radius:0;
  color:var(--ink);
  background:#fffefa
}
.field textarea{
  resize:vertical
}
.attendance-field{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  border:0;
  padding:0
}
.attendance-field legend{
  width:100%;
  padding:0 0 5px
}
.choice{
  display:flex;
  gap:8px;
  align-items:center;
  color:var(--muted);
  font-size:.92rem
}
.choice input{
  accent-color:var(--navy)
}
.submit-button{
  justify-self:start;
  padding:11px 24px;
  border:1px solid #c1a36d;
  color:#fffdf7;
  background:var(--navy);
  letter-spacing:.08em;
  cursor:pointer;
  transition:background .25s
}
.submit-button:hover{
  background:#244b76
}
.form-message{
  min-height:1.4em;
  margin:0;
  color:var(--navy);
  font-size:.9rem
}
.site-footer{
  padding:30px 20px 36px;
  text-align:center;
  background:#f0eee7
}
.site-footer>p:not(.brand){
  margin:10px 0 0;
  color:var(--navy)
}
.site-footer i{
  color:var(--gold);
  font-style:normal
}
.footer-date{
  font-size:.8rem;
  letter-spacing:.2em;
  color:#8a754f!important
}


/* Gentle scroll reveals */
.js-enabled .reveal{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .9s var(--ease),transform .9s var(--ease)
}
.js-enabled .reveal.is-visible{
  opacity:1;
  transform:translateY(0)
}

@media(max-width:760px){
  body{
  font-size:17px
}
.section-shell{
  width:min(100% - 38px,600px)
}
.welcome:before{
  inset:12px
}
.welcome-frame{
  inset:24px
}
.welcome-flower{
  width:48vw;
  opacity:.66
}
.welcome-flower--top{
  top:-3%;
  left:-15%
}
.welcome-flower--bottom{
  right:-15%;
  bottom:-7%
}
.welcome-content{
  padding:14px 4px
}
.welcome-kicker{
  margin-top:8px;
  font-size:.72rem
}
.welcome h1{
  font-size:clamp(2.35rem,10vw,3.55rem)
}
.open-hint{
  font-size:.67rem
}
.wedding-date{
  font-size:.73rem
}
.hero{
  min-height:max(780px,92svh);
  padding:100px 8px 100px
}
.hero:before{
  inset:20px 0
}
.hero:after{
  inset:29px 9px
}
.hero-copy .eyebrow{
  margin-top:21px
}
.hero h2{
  font-size:clamp(3.2rem,12.5vw,4.8rem)
}
.hero-lead{
  max-width:355px;
  font-size:1.04rem
}
.hero-emblem{
  right:50%;
  bottom:74px;
  width:105px;
  height:105px;
  transform:translateX(50%)
}
.hero-emblem strong{
  font-size:2.1rem
}
.hero-emblem span,.hero-emblem i{
  font-size:.62rem
}
.hero-emblem b{
  font-size:.72rem
}
.hero-flower{
  width:47vw;
  opacity:.58
}
.hero-flower--left{
  top:1%;
  left:-12%
}
.hero-flower--right{
  right:-12%;
  bottom:1%
}
.hero-ornament{
  bottom:27px
}
.countdown-section{
  grid-template-columns:1fr;
  gap:38px;
  padding-block:75px 86px
}
.memory-photo{
  width:min(250px,70vw)
}
.countdown-copy{
  grid-row:1
}
.countdown-grid{
  gap:7px;
  margin:25px 0 14px
}
.clock-unit{
  padding:10px 2px 8px
}
.clock-unit strong{
  font-size:clamp(1.65rem,7vw,2.25rem)
}
.clock-unit span{
  font-size:.58rem;
  letter-spacing:.07em
}
.story-section{
  padding:72px 0
}
.story-layout{
  grid-template-columns:1fr;
  gap:35px
}
.story-copy{
  order:1
}
.story-photo{
  order:2;
  width:min(320px,82%)
}
.ornate-panel{
  padding:35px 25px
}
.section-flower--story{
  right:-16%;
  bottom:-12%;
  width:45vw
}
.events-section{
  padding-block:78px
}
.section-heading{
  margin-bottom:30px
}
.events-grid{
  grid-template-columns:1fr;
  gap:18px
}
.event-panel{
  min-height:0;
  padding:36px 28px
}
.section-flower--events{
  width:42vw;
  left:-19%;
  top:0
}
.attire-section{
  padding:72px 0
}
.attire-layout{
  grid-template-columns:1fr;
  gap:35px
}
.attire-photo{
  width:min(450px,90%);
  justify-self:center
}
.music-section{
  grid-template-columns:1fr;
  gap:25px;
  padding-block:75px
}
.music-copy{
  text-align:center
}
.music-player{
  grid-template-columns:48px 1fr;
  gap:14px;
  padding:18px
}
.volume-control{
  grid-column:2
}
.play-button{
  width:42px;
  height:42px
}
.music-flower{
  width:40vw;
  right:-17%;
  bottom:-15%
}
.rsvp-section{
  padding:75px 0
}
.rsvp-layout{
  grid-template-columns:1fr;
  gap:28px
}
.rsvp-form{
  padding:22px
}
.site-footer{
  padding-block:28px
}

}

@media(max-width:390px){
  .welcome h1{
  font-size:2.15rem
}
.envelope-stage{
  width:104vw;
  margin-left:-2vw
}
.hero h2{
  font-size:3rem
}
.countdown-grid{
  gap:4px
}
.clock-unit strong{
  font-size:1.55rem
}
.clock-unit span{
  font-size:.53rem
}
.event-panel h3{
  font-size:1.45rem
}

}

@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{
  scroll-behavior:auto!important;
  animation-duration:.01ms!important;
  animation-iteration-count:1!important;
  transition-duration:.01ms!important
}
}

/* Cinematic envelope: each registered artwork layer remains independent. */
.welcome{
  background-image:linear-gradient(rgba(248,245,237,.08),rgba(248,245,237,.08)),url("assets/invitacion/cover-backdrop.jpg");
  background-position:center;
  background-size:cover;
}
.welcome:after{
  position:absolute;
  inset:0;
  background:radial-gradient(ellipse at 50% 48%,rgba(255,253,247,.76) 0,rgba(255,253,247,.48) 45%,transparent 76%);
  content:"";
  pointer-events:none;
}
.welcome-frame{z-index:0}
.welcome-flower{z-index:1;filter:drop-shadow(0 8px 16px rgba(27,50,71,.08));animation:floral-breath 18s ease-in-out infinite alternate}
.hero-flower,.section-flower,.music-flower{animation:floral-breath 20s ease-in-out infinite alternate;transform-origin:center}
.welcome-content{z-index:2;max-width:960px;padding-block:20px}
.welcome-kicker{color:#6f7885}
.envelope-stage{
  position:relative;
  z-index:3;
  display:block;
  flex:0 0 auto;
  width:min(780px,94vw);
  margin:1px auto -20px;
  perspective:1500px;
  perspective-origin:50% 37%;
}
.envelope-scene{
  position:relative;
  display:block;
  width:100%;
  aspect-ratio:3/2;
  height:auto;
  min-height:0;
  overflow:visible;
  visibility:visible;
  opacity:1;
  transform-style:preserve-3d;
  isolation:isolate;
  filter:drop-shadow(0 26px 30px rgba(26,42,59,.22));
  transition:transform 2s var(--ease),filter 1.8s var(--ease);
}
.envelope-layer{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:fill;
  visibility:visible;
  opacity:1;
  pointer-events:none;
  /* PNG alpha is the registered silhouette. External SVG masks can resolve as transparent on file:// previews. */
  -webkit-mask-image:none;
  mask-image:none;
  clip-path:none;
  backface-visibility:hidden;
}
.envelope-body{z-index:1}
.envelope-interior{z-index:2}
.letter-lift{
  position:absolute;
  z-index:3;
  inset:0;
  opacity:0;
  transform:translate3d(0,17%,0) rotateX(-18deg) scale(.72);
  transform-origin:50% 85%;
  transform-style:preserve-3d;
  clip-path:inset(31% 14% 0);
  filter:drop-shadow(0 12px 15px rgba(24,36,48,.22));
  transition:transform 1.5s cubic-bezier(.2,.7,.2,1),opacity .8s ease,clip-path 1.35s var(--ease),z-index 0s 1s;
  pointer-events:none;
}
.letter-paper{position:absolute;inset:0;width:100%;height:100%;object-fit:fill}
.letter-copy{
  position:absolute;
  top:18%;
  left:29%;
  display:flex;
  width:42%;
  min-height:44%;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  color:#354b66;
  text-align:center;
  opacity:0;
  transform:translateY(10px);
  transition:opacity 1.2s ease .3s,transform 1.2s var(--ease) .3s;
}
.letter-copy p{margin:0 0 2px;color:#957b4e;font-size:clamp(10px,1.2vw,17px);letter-spacing:.14em;text-transform:uppercase}
.letter-copy h2{margin:0;color:#243f60;font-family:var(--script);font-size:clamp(28px,4.1vw,60px);font-weight:400;line-height:1.05;white-space:nowrap}
.letter-copy h2 i{color:var(--gold);font-style:normal}
.letter-copy span{margin-top:7px;font-size:clamp(11px,1.25vw,18px);font-style:italic}
.letter-copy b{margin-top:12px;color:#977b46;font-size:clamp(10px,1.15vw,16px);font-weight:500;letter-spacing:.22em}
.flap-assembly{
  position:absolute;
  z-index:5;
  inset:0;
  transform-style:preserve-3d;
  transform-origin:50% 23.3333%;
  transition:transform 1.8s cubic-bezier(.25,.72,.18,1);
  backface-visibility:visible;
}
.flap-face{z-index:1;backface-visibility:hidden}
.flap-face--inner{z-index:2;transform:rotateX(180deg)}
.envelope-pocket{z-index:6}
.ribbon-release{position:absolute;z-index:7;inset:0;pointer-events:none}
.ribbon{z-index:1}
.envelope-bow{z-index:8}
.envelope-seal{z-index:9;transform-origin:50% 58%;filter:drop-shadow(0 5px 8px rgba(86,58,20,.4));transition:transform 1.25s cubic-bezier(.18,.7,.18,1),opacity 1s ease,filter .7s ease}
.ring-reveal{position:absolute;z-index:10;inset:24% 34% 27%;display:grid;place-items:center;opacity:0;transform:translate3d(0,24%,45px) scale(.62);transition:opacity 1.1s ease,transform 1.65s var(--ease);pointer-events:none}
.ring-reveal img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 12px 14px rgba(62,41,16,.28));animation:none}
.ring-glints{position:absolute;z-index:11;inset:23% 30% 25%;opacity:0;pointer-events:none}
.ring-glints i{position:absolute;width:7px;height:7px;border-radius:50%;background:#fff6d6;box-shadow:0 0 13px 4px rgba(255,224,157,.6);opacity:0}
.ring-glints i:nth-child(1){left:20%;top:32%}.ring-glints i:nth-child(2){left:77%;top:19%}.ring-glints i:nth-child(3){left:82%;top:65%}.ring-glints i:nth-child(4){left:35%;top:77%}.ring-glints i:nth-child(5){left:55%;top:8%}.ring-glints i:nth-child(6){left:12%;top:60%}.ring-glints i:nth-child(7){left:66%;top:88%}
.envelope-trigger{position:absolute;z-index:15;inset:0;width:100%;height:100%;border:0;border-radius:8px;background:transparent;cursor:pointer}
.envelope-trigger:focus-visible{outline:2px solid var(--gold);outline-offset:7px}
.petal-drift{position:absolute;z-index:1;inset:12% 4%;overflow:hidden;pointer-events:none}
.petal-drift i{position:absolute;width:13px;height:24px;border-radius:80% 10% 80% 10%;background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(174,199,230,.65));box-shadow:0 4px 12px rgba(92,122,158,.12);opacity:0;animation:petal-glide 19s ease-in-out 1 both}
.petal-drift i:nth-child(1){top:7%;left:16%;animation-delay:1s}.petal-drift i:nth-child(2){top:48%;right:15%;animation-delay:5s;transform:scale(.7)}.petal-drift i:nth-child(3){top:80%;left:72%;animation-delay:9s;transform:scale(.55)}

/* Richer detailing and photographic map windows on the invitation sections. */
.countdown-section,.events-section,.music-section{isolation:isolate}
.countdown-section:before,.music-section:before{position:absolute;z-index:-1;inset:24px -3vw;border-block:1px solid rgba(181,151,92,.37);background:linear-gradient(100deg,rgba(255,253,247,.56),rgba(233,239,242,.32),rgba(255,253,247,.62));content:"";pointer-events:none}
.countdown-section{padding-block:112px 122px}
.story-section{background-image:linear-gradient(115deg,rgba(232,238,242,.92),rgba(248,245,237,.9),rgba(226,235,242,.92)),url("assets/invitacion/capas/paper-texture.jpg");background-size:auto,cover}
.story-copy,.attire-copy,.rsvp-copy{box-shadow:0 18px 50px rgba(44,61,77,.08)}
.events-section{padding-block:120px 128px;background:radial-gradient(ellipse at 50% 45%,rgba(255,253,247,.95),rgba(244,240,229,.55) 68%,transparent)}
.event-panel{overflow:hidden;border:0;background:linear-gradient(142deg,rgba(255,253,247,.94),rgba(239,237,227,.86));box-shadow:0 20px 55px rgba(31,49,68,.11),inset 0 0 0 1px rgba(181,151,92,.32)}
.event-panel:before,.event-panel:after{width:48px;height:48px;border-color:#b18e50}
.event-panel:before{top:17px;left:17px}.event-panel:after{right:17px;bottom:17px}
.map-preview{position:relative;width:min(100%,420px);height:158px;margin:20px auto 18px;overflow:hidden;border:1px solid rgba(181,151,92,.7);outline:1px solid rgba(181,151,92,.2);outline-offset:4px;background:linear-gradient(135deg,#e9ece4,#dce5e4 35%,#f3efe5 36%,#e4e9e6 72%,#d4e0e4)}
.map-preview:before{position:absolute;z-index:1;inset:0;border:7px solid rgba(255,253,247,.55);content:"";pointer-events:none}
.map-preview iframe{display:block;width:100%;height:100%;border:0;filter:saturate(.72) sepia(.12)}
.event-panel p:not(.eyebrow){margin-bottom:14px}
.map-button{padding:10px 15px;border:1px solid rgba(181,151,92,.7);background:rgba(255,253,247,.7);transition:background .25s,box-shadow .25s}
.map-button:hover{background:#fffdf7;box-shadow:0 7px 18px rgba(34,53,70,.1)}
.photo-frame{border:1px solid rgba(181,151,92,.48);box-shadow:0 22px 55px rgba(31,49,68,.14),0 3px 12px rgba(31,49,68,.07)}
.photo-frame .photo-mat{background:linear-gradient(145deg,#f8f5ed,#e9e4d8)}
.photo-frame figcaption{font-size:1.7rem}
.attire-section{background:linear-gradient(115deg,rgba(231,237,240,.94),rgba(243,239,230,.93)),url("assets/invitacion/capas/paper-texture.jpg");background-size:auto,cover}
.photo-frame--oval .photo-mat{border-radius:0;overflow:hidden}
.photo-frame--oval .photo-mat img{border-radius:0}
.rsvp-section{box-shadow:inset 0 1px rgba(255,255,255,.14),inset 0 40px 80px rgba(13,35,57,.16)}
.rsvp-form{border:1px solid rgba(224,207,170,.73);box-shadow:0 24px 55px rgba(9,28,46,.23)}
.replay-intro{margin-top:16px;padding:5px 0;border:0;border-bottom:1px solid rgba(181,151,92,.7);color:#7a6846;background:transparent;font-size:.75rem;letter-spacing:.1em;cursor:pointer}
.replay-intro:hover{color:var(--navy)}
@keyframes petal-glide{0%,22%{opacity:0;transform:translate3d(0,-7px,0) rotate(-22deg)}38%{opacity:.38}70%{opacity:.32;transform:translate3d(26px,36px,0) rotate(28deg)}100%{opacity:0;transform:translate3d(45px,65px,0) rotate(65deg)}}
@keyframes floral-breath{0%{translate:0 0;rotate:-.25deg}100%{translate:2px -3px;rotate:.35deg}}
@media(max-width:760px){
  .welcome{background-position:center;background-size:auto 100%}
  .welcome:after{background:radial-gradient(ellipse at 50% 44%,rgba(255,253,247,.82),rgba(255,253,247,.5) 58%,transparent 90%)}
  .welcome-content{padding-block:10px}
  .envelope-stage{width:min(100vw,540px);margin:4px auto -12px}
  .envelope-scene{filter:drop-shadow(0 18px 22px rgba(26,42,59,.2))}
  .letter-copy{top:23%;left:28%;width:44%}
  .letter-copy h2{font-size:clamp(27px,7.4vw,39px)}
  .letter-copy p,.letter-copy span,.letter-copy b{font-size:clamp(9px,2.8vw,13px)}
  .ring-reveal{inset:22% 27% 23%}
  .countdown-section{padding-block:82px 92px}
  .events-section{padding-block:86px 94px}
  .event-panel{padding:34px 25px}
  .map-preview{height:145px}
}
@media(max-width:390px){
  .welcome h1{font-size:2.05rem}
  .envelope-stage{width:106vw;margin-left:-3vw}
  .open-hint{font-size:.62rem}
  .letter-copy h2{font-size:25px}
}
@media(prefers-reduced-motion:reduce){
  .welcome-flower,.hero-flower,.section-flower,.music-flower,.petal-drift i{animation:none}
  .petal-drift{display:none}
  .ring-reveal img{animation:none!important}
}

/* Final composition and the shared cinematic timeline's resting states. */
.letter-lift{will-change:transform,opacity,clip-path;transform-style:preserve-3d}
.flap-assembly{transform-origin:50% 23.3333%;will-change:transform,filter}
.envelope-layer,.ring-reveal,.ring-reveal img,.ring-glints{will-change:transform,opacity,filter}
.hero.is-portal{
  position:fixed;
  z-index:30;
  inset:0;
  width:100vw;
  height:100vh;
  height:100svh;
  min-height:100vh;
  min-height:100svh;
  max-width:none;
  margin:0;
  padding:0 32px;
  transform-origin:center;
  clip-path:inset(49.5% 49.5% round 50%);
  filter:drop-shadow(0 12px 28px rgba(24,42,61,.2));
  pointer-events:none;
  will-change:clip-path,transform,opacity,filter
}
.hero.is-portal{background-image:none;background-color:transparent;overflow:hidden}
.hero.is-portal .reveal{opacity:0;transform:translateY(14px)}
.hero.is-portal:before,.hero.is-portal:after{inset:24px}
.hero.is-portal .hero-flower{opacity:0;animation:none}
.hero.is-portal .hero-emblem{right:7%;bottom:12%}
.hero.is-portal .hero-ornament{bottom:34px;opacity:0}

.welcome{background-position:center;background-size:cover}
.welcome-frame:before,.welcome-frame:after{position:absolute;inset:8px;border:1px solid rgba(181,151,92,.24);content:""}
.welcome-frame:after{inset:-8px 20%;border-inline:1px solid rgba(181,151,92,.2);border-block:0}
.welcome-kicker{font-style:italic}
.open-hint{font-size:clamp(.65rem,1.05vw,.78rem);font-weight:500;letter-spacing:.15em}
.envelope-stage{width:min(790px,94vw);margin:2px auto -16px}
.envelope-scene{transform-style:preserve-3d;backface-visibility:hidden}
.envelope-seal{transform:translateZ(20px)}
.envelope-trigger{border-radius:2px}
.envelope-trigger:disabled{cursor:wait}
.envelope-trigger:focus-visible{outline-offset:-6px}

/* Editorial section rhythm: ornament is integrated into the paper, not stacked cards. */
.countdown-section:before,.music-section:before{inset:30px -2vw;border-block:1px solid rgba(181,151,92,.4)}
.countdown-section:after,.events-section:after,.music-section:after{
  position:absolute;
  top:50%;
  left:50%;
  width:18px;
  height:18px;
  border:1px solid rgba(181,151,92,.68);
  background:var(--ivory);
  content:"";
  transform:translate(-50%,-50%) rotate(45deg)
}
.clock-unit{
  display:grid;
  aspect-ratio:1;
  align-content:center;
  justify-items:center;
  padding:8px;
  border:1px solid rgba(181,151,92,.78);
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,253,247,.94) 58%,rgba(226,214,183,.38) 59%,rgba(255,253,247,.62) 62%);
  box-shadow:inset 0 0 0 5px rgba(255,253,247,.8),0 6px 18px rgba(31,49,68,.06)
}
.clock-unit:before,.clock-unit:after{display:none}
.clock-unit strong{font-variant-numeric:tabular-nums}
.memory-photo{transform:rotate(-2deg)}
.story-section{padding-block:104px 112px}
.story-layout{grid-template-columns:minmax(0,1fr) minmax(280px,.78fr)}
.story-copy{max-width:560px;justify-self:start}
.story-photo{transform:rotate(2deg)}
.photo-frame{position:relative;padding:12px;background:linear-gradient(135deg,#fffdf7,#e9e4d8)}
.photo-frame:before,.photo-frame:after{position:absolute;z-index:2;width:38px;height:38px;border-color:#b5975c;border-style:solid;content:"";pointer-events:none}
.photo-frame:before{top:5px;left:5px;border-width:1px 0 0 1px}
.photo-frame:after{right:5px;bottom:5px;border-width:0 1px 1px 0}
.photo-frame--oval{border-radius:46% 46% 3px 3px;padding-top:19px}
.photo-frame--oval .photo-mat{border-radius:42% 42% 0 0}
.photo-frame--oval .photo-mat img{border-radius:40% 40% 0 0}
.photo-frame--tall{transform:rotate(2deg)}
.photo-frame figcaption{position:relative;z-index:3}
.events-section{background:linear-gradient(180deg,rgba(230,237,242,.52),rgba(248,245,237,.26) 45%,rgba(232,238,242,.44))}
.events-grid{gap:clamp(24px,5vw,72px);align-items:stretch}
.event-panel{
  min-height:0;
  padding:52px clamp(22px,3vw,42px) 42px;
  border:1px solid rgba(181,151,92,.44);
  border-radius:170px 170px 2px 2px;
  outline:0;
  background:radial-gradient(ellipse at 50% 16%,rgba(255,253,247,.98),rgba(241,239,231,.85) 68%,rgba(226,233,236,.62));
  box-shadow:0 22px 55px rgba(31,49,68,.09),inset 0 0 0 7px rgba(255,253,247,.55)
}
.event-panel:before{inset:9px 9px 9px;width:auto;height:auto;border:1px solid rgba(181,151,92,.34);border-radius:164px 164px 0 0}
.event-panel:after{inset:17px 17px 17px;width:auto;height:auto;border:1px solid rgba(181,151,92,.16);border-radius:158px 158px 0 0}
.event-index{position:relative;z-index:1;background:var(--ivory)}
.event-panel .eyebrow,.event-panel h3,.event-panel p,.event-panel .map-preview,.event-panel .map-button{position:relative;z-index:1}
.map-preview{border-radius:46% 46% 2px 2px;outline-offset:3px}
.map-preview iframe{border-radius:46% 46% 0 0}
.attire-section{padding-block:104px 116px}
.attire-layout{grid-template-columns:minmax(0,1fr) minmax(300px,.86fr)}
.attire-photo{max-width:600px}
.attire-copy{max-width:510px;justify-self:end}
.music-section{grid-template-columns:.72fr 1.48fr;padding-block:116px 126px}
.music-player{border-radius:2px;box-shadow:0 20px 50px rgba(31,49,68,.1),inset 0 0 0 5px rgba(255,253,247,.7)}
.music-player:after{position:absolute;inset:11px;border:1px solid rgba(181,151,92,.18);content:"";pointer-events:none}
.play-button,.track-info,.volume-control,.audio-unlock{z-index:2}
.music-note{margin:10px 0 0;color:var(--muted);font-size:.95rem;font-style:italic}
.rsvp-section{background-image:linear-gradient(125deg,rgba(26,58,91,.94),rgba(44,83,121,.96) 60%,rgba(23,57,91,.97)),url("assets/invitacion/capas/paper-texture.jpg");background-position:center;background-size:cover}
.rsvp-section{overflow:hidden}
.rsvp-section:before{z-index:0}
.rsvp-layout{position:relative;z-index:2;align-items:center;padding:clamp(30px,5vw,64px);border:1px solid rgba(181,151,92,.82);background:linear-gradient(140deg,rgba(255,253,247,.96),rgba(245,240,226,.94)),url("assets/invitacion/capas/paper-texture.jpg");background-size:auto,cover;box-shadow:0 24px 70px rgba(9,28,46,.32),inset 0 0 0 8px rgba(255,253,247,.68)}
.rsvp-layout:before{position:absolute;inset:12px;border:1px solid rgba(181,151,92,.32);content:"";pointer-events:none}
.rsvp-copy{border:0;background:transparent;box-shadow:none}
.rsvp-copy:before,.rsvp-copy:after{display:none}
.rsvp-form{position:relative;border:0;border-left:1px solid rgba(181,151,92,.48);background:rgba(255,253,247,.32);box-shadow:none}
.rsvp-form:before{position:absolute;inset:0;border:1px solid rgba(181,151,92,.24);content:"";pointer-events:none}
.rsvp-flower{position:absolute;z-index:1;width:min(32vw,360px);opacity:.44;pointer-events:none;filter:drop-shadow(0 12px 24px rgba(11,34,56,.26))}
.rsvp-flower--left{top:-10%;left:-9%;transform:rotate(-8deg)}
.rsvp-flower--right{right:-9%;bottom:-18%;transform:rotate(180deg)}
.rsvp-rose{width:min(28vw,320px);transform:rotate(-8deg)}
.field,.submit-button,.form-message{position:relative;z-index:1}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid rgba(181,151,92,.58);outline-offset:2px}
.closing-scene{
  position:relative;
  min-height:390px;
  display:grid;
  place-items:center;
  overflow:hidden;
  padding:80px 24px;
  background:radial-gradient(ellipse at 50% 48%,#fffdf7 0,rgba(245,241,232,.92) 48%,#e4ebef 100%);
  isolation:isolate
}
.closing-frame{position:absolute;inset:22px;border:1px solid rgba(181,151,92,.65);outline:1px solid rgba(181,151,92,.22);outline-offset:7px;pointer-events:none}
.closing-frame:before,.closing-frame:after{position:absolute;inset:11px;border:1px solid rgba(181,151,92,.22);content:""}
.closing-frame:after{inset:-10px 20%;border-inline:1px solid rgba(181,151,92,.18);border-block:0}
.closing-copy{position:relative;z-index:2;max-width:650px;text-align:center}
.closing-copy h2{margin:0;color:var(--navy);font-family:var(--script);font-size:clamp(2.5rem,5.5vw,4.3rem);font-weight:400;line-height:1.05}
.closing-copy>p:last-child{margin:0;color:var(--muted);font-style:italic}
.closing-flower{position:absolute;z-index:1;width:min(35vw,410px);opacity:.75;pointer-events:none;filter:drop-shadow(0 12px 22px rgba(24,42,61,.12))}
.closing-flower--left{left:-6%;top:-20%;transform:rotate(3deg)}
.closing-flower--right{right:-8%;bottom:-26%;transform:rotate(180deg)}
.closing-rose{position:absolute;z-index:1;top:-9%;right:9%;width:min(18vw,220px);opacity:.68;transform:rotate(12deg);filter:drop-shadow(0 12px 20px rgba(24,42,61,.1));pointer-events:none}
.site-footer{border-top:1px solid rgba(181,151,92,.48)}
.replay-intro{min-height:40px}

@media(max-width:760px){
  .welcome{background-position:50% 50%;background-size:auto 100%}
  .welcome-content{width:min(100vw,790px);max-width:100vw;min-width:0;box-sizing:border-box;padding:10px 16px}
  .welcome-flower{width:49vw}
  .welcome-flower--top{top:-3%;left:-16%}
  .welcome-flower--bottom{right:-17%;bottom:-9%}
  .welcome-rose{width:26vw;right:3%;top:6%;opacity:.62}
  .welcome h1{max-width:95vw;font-size:clamp(2.05rem,9.6vw,3.35rem);line-height:1.05}
  .envelope-stage{width:min(calc(100vw - 64px),540px);max-width:100%;margin:2px auto -9px}
  .open-hint{max-width:90vw;margin-inline:auto;text-wrap:balance}
  .hero.is-portal{padding-inline:12px}
  .hero.is-portal .hero-emblem{right:50%;bottom:74px;transform:translateX(50%)}
  .hero.is-portal .hero-ornament{bottom:27px}
  .countdown-section:before,.music-section:before{inset:18px 0}
  .countdown-section:after,.events-section:after,.music-section:after{width:13px;height:13px}
  .countdown-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(4px,2vw,10px)}
  .clock-unit{width:100%;max-width:86px;justify-self:center;aspect-ratio:1;padding:4px}
  .clock-unit strong{font-size:clamp(1.32rem,6vw,1.95rem)}
  .clock-unit span{font-size:clamp(.48rem,1.8vw,.62rem);letter-spacing:.06em}
  .story-layout{grid-template-columns:minmax(0,1fr);gap:32px}
  .story-copy{max-width:100%;justify-self:stretch}
  .story-photo{width:min(100%,360px);justify-self:center}
  .events-grid{gap:24px}
  .event-panel{width:min(100%,500px);margin-inline:auto;padding:48px 26px 36px;border-radius:150px 150px 2px 2px}
  .event-panel:before{border-radius:142px 142px 0 0}
  .event-panel:after{border-radius:134px 134px 0 0}
  .map-preview{height:142px}
  .attire-layout{grid-template-columns:minmax(0,1fr);gap:34px}
  .attire-photo{width:min(100%,430px);justify-self:center}
  .attire-copy{max-width:100%;justify-self:stretch}
  .music-section{grid-template-columns:minmax(0,1fr);gap:28px}
  .closing-scene{min-height:340px;padding:65px 22px}
  .closing-flower{width:55vw;opacity:.55}
  .closing-flower--left{left:-22%;top:-13%}
  .closing-flower--right{right:-26%;bottom:-16%}
  .closing-rose{width:28vw;right:3%;top:-5%;opacity:.5}
  .rsvp-layout{gap:22px;padding:25px 20px}
  .rsvp-form{border-left:0;border-top:1px solid rgba(181,151,92,.48)}
  .rsvp-flower{width:52vw;opacity:.2}
  .rsvp-flower--left{top:-2%;left:-28%}
  .rsvp-flower--right{right:-30%;bottom:-5%}
}
@media(max-width:390px){
  .welcome-content{padding-inline:8px}
  .welcome h1{font-size:clamp(1.95rem,9vw,2.3rem)}
  .envelope-stage{width:100%;margin-inline:auto}
  .letter-copy h2{font-size:24px}
  .letter-copy p,.letter-copy span,.letter-copy b{font-size:9px}
  .ring-reveal{inset:22% 25% 23%}
  .hero.is-portal{padding-inline:10px}
  .event-panel{padding-inline:19px}
  .rsvp-form{padding:21px 18px}
}
@media(max-height:780px) and (min-width:761px){
  .welcome-content{padding-block:8px}
  .gold-rule{margin-block:12px}
  .envelope-stage{width:min(620px,76vh);margin-block:-4px}
  .wedding-date{margin-top:6px}
}
@media(max-height:560px) and (max-width:760px){
  .welcome-content{padding-block:0}
  .welcome .brand{font-size:.85rem}
  .welcome .brand span{font-size:.53rem}
  .gold-rule{margin-block:8px}
  .welcome-kicker{margin-top:2px}
  .welcome h1{font-size:clamp(1.7rem,7vh,2.6rem)}
  .envelope-stage{width:min(82vw,380px);margin-block:-8px}
  .wedding-date{margin-top:3px}
}
@media(prefers-reduced-motion:reduce){
  .welcome-flower,.hero-flower,.section-flower,.music-flower,.closing-flower,.welcome-rose,.closing-rose,.petal-drift i{animation:none!important}
  .petal-drift{display:none}
}

/* Distinct paper frames for the invitation scenes. */
.countdown-copy{
  position:relative;
  padding:clamp(26px,4vw,48px);
  border:1px solid rgba(181,151,92,.62);
  outline:1px solid rgba(181,151,92,.22);
  outline-offset:6px;
  background:linear-gradient(145deg,rgba(255,253,247,.88),rgba(244,240,229,.82)),url("assets/invitacion/capas/paper-texture.jpg");
  background-size:auto,cover;
  box-shadow:inset 0 0 0 7px rgba(255,253,247,.6),0 18px 42px rgba(31,49,68,.08)
}
.countdown-copy:before,.countdown-copy:after{
  position:absolute;
  inset:10px;
  border:1px solid rgba(181,151,92,.27);
  content:"";
  pointer-events:none
}
.countdown-copy:after{inset:17px;border-style:dotted;opacity:.55}
.story-copy{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  border:1px solid rgba(181,151,92,.62);
  outline:1px solid rgba(181,151,92,.22);
  outline-offset:6px;
  background:linear-gradient(135deg,rgba(255,253,247,.92),rgba(240,238,229,.88)),url("assets/invitacion/capas/paper-texture.jpg");
  background-size:auto,cover;
  box-shadow:inset 0 0 0 8px rgba(255,253,247,.68),0 22px 50px rgba(31,49,68,.12)
}
.story-copy:before{inset:13px;border:1px solid rgba(181,151,92,.4);border-radius:94px 2px 2px 2px}
.story-copy:after{inset:21px;clip-path:none;border:1px solid rgba(181,151,92,.18);border-radius:82px 2px 2px 2px}
.story-copy>p,.story-copy>.section-title,.story-copy>.gold-rule{position:relative;z-index:1}
.story-flower{position:absolute;z-index:0;width:clamp(125px,17vw,205px);opacity:.2;filter:drop-shadow(0 8px 14px rgba(40,57,72,.1));pointer-events:none}
.story-flower--clove{left:-42px;bottom:-48px}
.story-flower--blue{right:-44px;top:-46px;transform:rotate(178deg)}
.attire-copy{
  position:relative;
  border:1px solid rgba(181,151,92,.62);
  outline:1px solid rgba(181,151,92,.22);
  outline-offset:6px;
  background:linear-gradient(140deg,rgba(255,253,247,.94),rgba(243,239,229,.9)),url("assets/invitacion/capas/paper-texture.jpg");
  background-size:auto,cover;
  box-shadow:inset 0 0 0 8px rgba(255,253,247,.66),0 22px 50px rgba(31,49,68,.1)
}
.attire-copy:before,.attire-copy:after{position:absolute;inset:13px;border:1px solid rgba(181,151,92,.34);content:"";pointer-events:none}
.attire-copy:after{inset:20px;border-color:rgba(181,151,92,.17);clip-path:none}
.attire-copy>*{position:relative;z-index:1}
.event-panel{box-shadow:0 24px 58px rgba(31,49,68,.1),inset 0 0 0 8px rgba(255,253,247,.62),inset 0 0 0 9px rgba(181,151,92,.2)}
.event-panel:before{border-color:rgba(181,151,92,.44)}
.event-panel:after{border-color:rgba(181,151,92,.23)}

/* The RSVP spread uses the existing paper texture and separate left/right leaves. */
.rsvp-layout{
  grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);
  gap:0;
  overflow:hidden;
  border-radius:3px;
  background-image:linear-gradient(90deg,rgba(255,253,247,.88),rgba(255,253,247,.72) 49.5%,rgba(214,196,158,.2) 50%,rgba(255,253,247,.72) 50.5%,rgba(255,253,247,.9)),url("assets/invitacion/capas/paper-texture.jpg");
  background-size:auto,cover
}
.rsvp-layout:after{
  position:absolute;
  z-index:1;
  top:28px;
  bottom:28px;
  left:50%;
  width:1px;
  background:linear-gradient(180deg,transparent,rgba(181,151,92,.46) 10%,rgba(124,105,70,.2) 50%,rgba(181,151,92,.46) 90%,transparent);
  box-shadow:0 0 12px rgba(80,64,40,.14);
  content:"";
  pointer-events:none
}
.rsvp-copy,.rsvp-form{position:relative;z-index:2;min-width:0}
.rsvp-copy{display:flex;flex-direction:column;justify-content:center;min-height:100%;padding:clamp(34px,4vw,58px) clamp(28px,4vw,54px)}
.rsvp-copy:before{display:block;inset:17px;border:1px solid rgba(181,151,92,.34);border-radius:100px 2px 2px 2px}
.rsvp-copy:after{display:block;inset:24px;border:1px solid rgba(181,151,92,.18);border-radius:88px 2px 2px 2px;clip-path:none}
.rsvp-copy>*:not(.rsvp-card-flower){position:relative;z-index:1}
.rsvp-card-flower{position:absolute;z-index:0;left:-64px;bottom:-68px;width:clamp(145px,18vw,225px);opacity:.14;filter:drop-shadow(0 8px 16px rgba(31,49,68,.12));pointer-events:none}
.rsvp-form{align-content:center;gap:17px;padding:clamp(28px,3.4vw,48px) clamp(25px,3vw,42px);border:0;border-left:1px solid rgba(181,151,92,.3);background:rgba(255,253,247,.36);box-shadow:none}
.rsvp-form:before{inset:17px;border-color:rgba(181,151,92,.32)}
.field textarea{min-height:82px}
.music-section{margin-block:28px 0;padding:clamp(54px,7vw,92px) clamp(20px,4vw,54px);border:1px solid rgba(181,151,92,.44);outline:1px solid rgba(181,151,92,.2);outline-offset:6px;background:linear-gradient(120deg,rgba(255,253,247,.9),rgba(233,239,242,.68),rgba(255,253,247,.88)),url("assets/invitacion/capas/paper-texture.jpg");background-size:auto,cover}
.music-section:before{inset:12px;border:1px solid rgba(181,151,92,.24);background:none}
.music-section:after{top:50%;width:12px;height:12px;background:#f8f5ed}
.music-player{border-radius:2px 28px 2px 28px;background:linear-gradient(140deg,#fffdf8,#f0ece0);box-shadow:0 20px 50px rgba(31,49,68,.12),inset 0 0 0 5px rgba(255,253,247,.76)}
.track-label{font-family:var(--serif);font-size:.82rem;letter-spacing:.1em;text-transform:uppercase}
.closing-frame{border-radius:2px 90px 2px 90px;outline-offset:8px}

@media(max-width:760px){
  .countdown-copy{padding:28px 20px}
  .story-copy{padding:36px 27px}
  .story-flower{width:145px;opacity:.14}
  .attire-copy{padding:36px 25px}
  .rsvp-layout{grid-template-columns:minmax(0,1fr);gap:0;padding:18px}
  .rsvp-layout:after{display:none}
  .rsvp-copy{min-height:300px;padding:38px 25px 52px}
  .rsvp-form{padding:36px 24px 28px;border-left:0;border-top:1px solid rgba(181,151,92,.3)}
  .rsvp-card-flower{left:-52px;bottom:-56px;width:164px;opacity:.11}
  .music-section{width:calc(100% - 32px);margin:24px auto 0;padding:48px 24px}
  .music-section:before{inset:10px}
}

/* Section finish: related gold filigree, with a distinct silhouette for each scene. */
.countdown-copy{
  border-radius:2px 76px 2px 2px;
  box-shadow:inset 0 0 0 7px rgba(255,253,247,.6),0 22px 48px rgba(31,49,68,.1)
}
.countdown-copy:before{inset:12px 12px 12px 12px;border-radius:2px 66px 2px 2px}
.countdown-copy:after{inset:19px 19px 19px 19px;border-style:solid;border-color:rgba(181,151,92,.18);border-radius:2px 58px 2px 2px}
.countdown-copy .eyebrow,.countdown-copy .section-title,.countdown-grid,.countdown-note{position:relative;z-index:1}
.story-copy{border-radius:92px 2px 2px 2px}
.story-copy:before{border-radius:82px 2px 2px 2px}
.story-copy:after{border-radius:72px 2px 2px 2px}
.story-section:after{
  position:absolute;inset:10px 18px;border:1px solid rgba(181,151,92,.2);content:"";pointer-events:none
}
.events-section:before{
  position:absolute;inset:30px 12px;border:1px solid rgba(181,151,92,.2);content:"";pointer-events:none
}
.event-panel--ceremony{border-radius:180px 180px 3px 3px}
.event-panel--ceremony:before{border-radius:164px 164px 0 0}
.event-panel--ceremony:after{border-radius:154px 154px 0 0}
.event-panel--reception{border-radius:3px 118px 3px 118px}
.event-panel--reception:before{border-radius:0 104px 0 104px}
.event-panel--reception:after{border-radius:0 94px 0 94px}
.event-panel .eyebrow{display:inline-block;padding-bottom:9px;border-bottom:1px solid rgba(181,151,92,.52)}
.attire-section{isolation:isolate}
.attire-layout{position:relative;z-index:1}
.attire-section:after{
  position:absolute;z-index:0;right:1%;bottom:-18%;width:min(25vw,285px);aspect-ratio:1;
  background:url("assets/invitacion/capas/flower-bottom.png") center/contain no-repeat;
  opacity:.13;filter:drop-shadow(0 10px 20px rgba(31,49,68,.1));content:"";pointer-events:none
}
.attire-copy{border-radius:2px 2px 88px 2px}
.attire-copy:before{inset:13px;border-radius:2px 2px 76px 2px}
.attire-copy:after{inset:21px;border-radius:2px 2px 66px 2px}
.rsvp-layout{
  border-radius:3px 92px 3px 3px;
  box-shadow:0 28px 74px rgba(9,28,46,.3),inset 0 0 0 8px rgba(255,253,247,.68),inset 0 0 24px rgba(113,91,54,.07)
}
.rsvp-copy{
  border-radius:84px 2px 2px 2px;
  background:linear-gradient(145deg,rgba(255,253,247,.4),rgba(250,246,235,.12)),url("assets/invitacion/capas/paper-texture.jpg") center/cover;
  box-shadow:inset -12px 0 22px -22px rgba(74,56,31,.7)
}
.rsvp-copy:before{inset:17px;border-radius:74px 2px 2px 2px}
.rsvp-copy:after{inset:25px;border-radius:65px 2px 2px 2px}
.rsvp-form{
  border-radius:2px 78px 2px 2px;
  background:linear-gradient(140deg,rgba(255,253,247,.7),rgba(246,241,228,.46)),url("assets/invitacion/capas/paper-texture.jpg") center/cover;
  box-shadow:inset 12px 0 22px -22px rgba(74,56,31,.7)
}
.rsvp-form:before{inset:17px;border-color:rgba(181,151,92,.36);border-radius:2px 67px 2px 2px}
.field input[type=text],.field select,.field textarea{background:rgba(255,254,250,.9);transition:border-color .22s,box-shadow .22s}
.field input[type=text]:focus,.field select:focus,.field textarea:focus{border-color:#9b7b43;box-shadow:0 0 0 3px rgba(181,151,92,.12)}
.submit-button{transition:background .25s,transform .25s,box-shadow .25s}
.submit-button:hover{transform:translateY(-1px);box-shadow:0 7px 16px rgba(27,52,77,.18)}
.music-section{border-radius:3px 74px 3px 3px}
.music-section:before{border-radius:2px 64px 2px 2px}

@media(max-width:760px){
  .story-section:after{inset:12px 8px}
  .events-section:before{inset:20px 3px}
  .event-panel--ceremony{border-radius:148px 148px 3px 3px}
  .event-panel--ceremony:before{border-radius:136px 136px 0 0}
  .event-panel--ceremony:after{border-radius:126px 126px 0 0}
  .event-panel--reception{border-radius:3px 88px 3px 88px}
  .event-panel--reception:before{border-radius:0 76px 0 76px}
  .event-panel--reception:after{border-radius:0 66px 0 66px}
  .attire-section:after{right:-8%;bottom:-5%;width:42vw;opacity:.11}
  .rsvp-layout{border-radius:3px 72px 3px 3px}
  .rsvp-copy{border-radius:60px 2px 2px 2px;box-shadow:inset 0 -12px 22px -22px rgba(74,56,31,.7)}
  .rsvp-copy:before{border-radius:52px 2px 2px 2px}
  .rsvp-copy:after{border-radius:44px 2px 2px 2px}
  .rsvp-form{border-radius:2px 2px 58px 2px;box-shadow:inset 0 12px 22px -22px rgba(74,56,31,.7)}
  .rsvp-form:before{border-radius:2px 2px 48px 2px}
  .music-section{border-radius:3px 54px 3px 3px}
}

/* Video-led cover and the 9:16 cinematic card-to-page transition. */
.welcome{
  background:linear-gradient(90deg,rgba(248,245,237,.1),rgba(255,253,247,.18),rgba(248,245,237,.1)),url("assets/invitacion/cover-backdrop.jpg") center/cover no-repeat
}
.welcome:before{inset:5px;border:0;outline:0;background:url("assets/invitacion/ornamentos/royal-scroll-frame.svg") center/100% 100% no-repeat;box-shadow:none;opacity:.88;z-index:0}
.welcome:after{position:absolute;z-index:1;inset:0;background:radial-gradient(ellipse at center,rgba(255,253,247,.58),rgba(255,253,247,.12) 53%,rgba(16,35,55,.08));content:"";pointer-events:none}
.welcome-flower{z-index:0;width:min(28vw,390px);opacity:.76;filter:drop-shadow(0 12px 20px rgba(31,49,68,.12))}
.welcome-flower--top{top:-5%;left:-7%;transform:rotate(6deg)}
.welcome-flower--bottom{right:-7%;bottom:-9%;transform:rotate(180deg)}
.welcome-rose{z-index:0;width:min(15vw,200px);opacity:.58}
.welcome-content{z-index:2;width:min(940px,96vw);height:100svh;max-height:100svh;display:grid;grid-template-rows:auto auto auto minmax(0,1fr) auto auto;align-content:center;justify-items:center;gap:clamp(3px,1.2vh,12px);padding:clamp(12px,2vh,22px) 20px;text-align:center;transform:translateY(-10px)}
.welcome-content>.gold-rule{margin:0 auto;width:92px}
.welcome-copy{transition:opacity .5s var(--ease),transform .5s var(--ease)}
.welcome-copy.is-leaving{opacity:0;transform:translateY(-9px);pointer-events:none}
.welcome-kicker{margin:3px 0 0;color:#746747;font-size:clamp(.72rem,1.2vw,.92rem);letter-spacing:.19em}
.welcome h1{max-width:94vw;margin:1px auto 0;font-size:clamp(2rem,5.6vw,4.4rem);line-height:1.03}
.welcome-subtitle{margin:0;color:#917446;font-size:.75rem;letter-spacing:.2em;text-transform:uppercase}
.opening-film{position:relative;isolation:isolate;height:min(58svh,560px);min-height:250px;max-height:calc(100svh - 250px);width:auto;aspect-ratio:9/16;max-width:calc(100vw - 38px);margin:0 auto;overflow:hidden;background:#17395f;box-shadow:0 20px 50px rgba(20,38,56,.23),0 3px 8px rgba(20,38,56,.18);transition:filter .5s}
.opening-film:before{position:absolute;z-index:2;inset:-1px;background:url("assets/invitacion/ornamentos/film-frame.svg") center/100% 100% no-repeat;content:"";pointer-events:none;filter:drop-shadow(0 2px 2px rgba(52,39,19,.32))}
.opening-film:after{position:absolute;z-index:2;inset:7px;border:1px solid rgba(255,238,194,.38);content:"";pointer-events:none}
.opening-video{display:block;width:100%;height:100%;object-fit:cover;object-position:center;background:#17395f}
.opening-trigger{min-width:220px;padding:10px 30px;border:1px solid #f0dcab;border-radius:2px;color:#fffdf7;background:linear-gradient(180deg,#315d91,#17395f 55%,#102c4a);box-shadow:0 0 0 3px rgba(181,151,92,.82),inset 0 1px rgba(255,255,255,.3),0 8px 20px rgba(22,39,56,.23);font-family:var(--serif);font-size:1rem;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:transform .25s,filter .25s,opacity .25s}
.opening-trigger:hover:not(:disabled){transform:translateY(-2px);filter:brightness(1.08)}
.opening-trigger:disabled{opacity:.68;cursor:wait}
.opening-trigger:focus-visible{outline:3px solid #d6b878;outline-offset:7px}
.open-hint{margin:0;color:#53627a;font-size:.72rem;letter-spacing:.08em;text-transform:none}
.wedding-date{margin:0;color:#8b754e;font-size:.73rem;letter-spacing:.2em}
.welcome.is-expanding .welcome-content>*:not(.opening-film){opacity:0;transform:translateY(-5px);pointer-events:none;transition:opacity .42s var(--ease),transform .42s var(--ease)}
.welcome.is-expanding .opening-film{filter:brightness(.96)}
.welcome[hidden]{display:none!important}
.hero-gilt-frame{position:absolute;z-index:0;inset:0;width:100%;height:100%;padding:18px;overflow:visible;filter:drop-shadow(0 3px 3px rgba(112,80,34,.11));pointer-events:none}
.hero-copy,.hero-emblem{position:relative;z-index:1}
.hero.portal-opening{position:fixed;inset:0;z-index:40;width:100vw;height:100svh;min-height:100svh;max-height:100svh;margin:0;padding:0;overflow:hidden;transform-origin:top left;isolation:isolate;background:linear-gradient(135deg,rgba(255,253,247,.94),rgba(248,245,237,.98) 52%,rgba(237,239,233,.94)),url("assets/invitacion/capas/paper-texture.jpg") center/cover;box-shadow:inset 0 0 0 20px rgba(181,151,92,.12)}
.hero.portal-opening:before{inset:28px;border-color:rgba(181,151,92,.4)}
.hero.portal-opening:after{inset:38px 38px;border-color:rgba(181,151,92,.22)}
.hero.portal-opening .hero-copy,.hero.portal-opening .hero-emblem,.hero.portal-opening .hero-ornament{opacity:0}
.hero.portal-opening .hero-flower{opacity:0}
.hero.portal-opening .hero-gilt-frame{padding:18px}
.hero.portal-opening .hero-copy{position:relative;z-index:2}
.hero.portal-opening .hero-emblem{z-index:2}

/* Distinct, illustrated goldwork is layered with real floral art and paper textures. */
.hero:not(.portal-opening){background:radial-gradient(ellipse at center,rgba(255,253,247,.48),transparent 66%)}
.photo-frame{border:0;outline:0;background-image:url("assets/invitacion/ornamentos/portrait-ornament.svg"),linear-gradient(135deg,#fffdf7,#e9e4d8);background-size:100% 100%,cover;background-repeat:no-repeat, no-repeat;filter:drop-shadow(0 17px 22px rgba(31,49,68,.14))}
.photo-frame:before,.photo-frame:after{display:none}
.photo-mat{border-color:rgba(181,151,92,.7);background:linear-gradient(145deg,#fffdf7,#e9e4d8);box-shadow:inset 0 1px 6px rgba(104,76,37,.09)}
.countdown-copy{background-image:url("assets/invitacion/ornamentos/delicate-corners.svg"),linear-gradient(145deg,rgba(255,253,247,.95),rgba(244,240,229,.9)),url("assets/invitacion/capas/paper-texture.jpg");background-size:100% 100%,auto,cover;background-repeat:no-repeat,repeat,no-repeat}
.story-copy{background-image:url("assets/invitacion/ornamentos/rococo-panel.svg"),linear-gradient(145deg,rgba(255,253,247,.9),rgba(233,239,242,.79)),url("assets/invitacion/capas/paper-texture.jpg");background-size:100% 100%,auto,cover;background-repeat:no-repeat,repeat,no-repeat}
.event-panel{background-image:url("assets/invitacion/ornamentos/arch-medallion.svg"),linear-gradient(145deg,rgba(255,253,247,.95),rgba(239,237,227,.88)),url("assets/invitacion/capas/paper-texture.jpg");background-size:100% 100%,auto,cover;background-repeat:no-repeat,repeat,no-repeat}
.event-panel--reception{background-image:url("assets/invitacion/ornamentos/delicate-corners.svg"),linear-gradient(145deg,rgba(255,253,247,.95),rgba(239,237,227,.88)),url("assets/invitacion/capas/paper-texture.jpg")}
.attire-copy{background-image:url("assets/invitacion/ornamentos/delicate-corners.svg"),linear-gradient(145deg,rgba(255,253,247,.95),rgba(244,240,229,.86)),url("assets/invitacion/capas/paper-texture.jpg");background-size:100% 100%,auto,cover;background-repeat:no-repeat,repeat,no-repeat}
.rsvp-layout{background-image:url("assets/invitacion/ornamentos/open-book.svg"),linear-gradient(135deg,#fffdf8,#f2eee5);background-size:100% 100%,cover;background-repeat:no-repeat,no-repeat}
.rsvp-copy,.rsvp-form{background-image:linear-gradient(145deg,rgba(255,253,247,.77),rgba(250,246,235,.68)),url("assets/invitacion/capas/paper-texture.jpg");background-size:auto,cover}
.music-section{background-image:url("assets/invitacion/ornamentos/rococo-panel.svg"),linear-gradient(120deg,rgba(255,253,247,.92),rgba(233,239,242,.78),rgba(255,253,247,.92)),url("assets/invitacion/capas/paper-texture.jpg");background-size:100% 100%,auto,cover;background-repeat:no-repeat,repeat,no-repeat}
.music-player{background-image:url("assets/invitacion/ornamentos/delicate-corners.svg"),linear-gradient(130deg,#fffdf8,#f1eee5);background-size:100% 100%,cover;background-repeat:no-repeat,no-repeat;border:0;box-shadow:0 12px 28px rgba(31,49,68,.08)}

/* The ornamental SVGs supply the filigree; inset pseudo-borders were crossing the copy. */
.countdown-copy:before,.countdown-copy:after,
.story-copy:before,.story-copy:after,
.attire-copy:before,.attire-copy:after,
.music-section:before,.music-section:after,
.music-player:before,.music-player:after{display:none}
.event-panel:before,.event-panel:after{display:none}

@media(max-width:760px){
  .welcome{background-position:center;background-size:auto 100%}
  .welcome:before{inset:4px;background-image:url("assets/invitacion/ornamentos/welcome-mobile-frame.svg")}
  .welcome-flower{width:35vw;opacity:.58}
  .welcome-flower--top{top:-2%;left:-12%}
  .welcome-flower--bottom{right:-12%;bottom:-4%}
  .welcome-rose{width:22vw;top:7%;right:1%;opacity:.44}
  .welcome-content{width:100vw;gap:clamp(2px,.7vh,7px);padding:10px 14px}
  .welcome-content>.gold-rule{margin:0 auto;width:72px}
  .welcome .brand{font-size:.9rem}
  .welcome .brand span{font-size:.55rem}
  .welcome-kicker{font-size:.66rem;letter-spacing:.13em}
  .welcome h1{font-size:clamp(1.8rem,7.6vw,2.65rem);line-height:1}
  .opening-film{height:min(56svh,520px);min-height:260px;max-height:calc(100svh - 255px);max-width:calc(100vw - 50px)}
  .opening-trigger{min-width:200px;padding:8px 24px;font-size:.9rem}
  .open-hint{font-size:.66rem}
  .wedding-date{font-size:.68rem}
  .hero-gilt-frame{padding:10px}
  .hero-emblem{right:4%;bottom:8%;width:112px;height:112px}
  .photo-frame{max-width:100%}
  .rsvp-layout{background-size:100% 100%,cover}
}
@media(max-width:390px){
  .welcome-content{gap:2px;padding-inline:12px}
  .welcome h1{font-size:clamp(1.72rem,7.1vw,2.1rem)}
  .opening-film{height:min(48svh,470px);max-height:calc(100svh - 250px);max-width:calc(100vw - 46px)}
  .opening-trigger{min-width:186px;padding:7px 20px}
  .hero-emblem{right:3%;bottom:5%;width:98px;height:98px}
  .hero-emblem strong{font-size:2rem}
}
@media(max-height:670px){
  .welcome-content{gap:2px;padding-block:7px}
  .opening-film{height:min(48svh,390px);min-height:210px;max-height:calc(100svh - 205px)}
  .welcome .brand{font-size:.82rem}
  .welcome .brand span{font-size:.5rem}
  .welcome h1{font-size:clamp(1.65rem,5.5vw,2.7rem)}
}

/* Minimal, media-led cover: the source video is the closed invitation itself. */
.welcome{
  background:linear-gradient(180deg,rgba(16,37,61,.16),rgba(16,37,61,.04) 42%,rgba(16,37,61,.22)),url("assets/invitacion/cover-backdrop.jpg") center/cover no-repeat;
}
.welcome:before{inset:10px;opacity:.32}
.welcome:after{z-index:1;background:radial-gradient(ellipse at 50% 48%,rgba(255,253,247,.18),rgba(255,253,247,.03) 58%,rgba(10,28,49,.18))}
.welcome-content{z-index:2;width:100vw;height:100svh;max-height:100svh;display:grid;grid-template:1fr/1fr;place-items:center;gap:0;padding:18px 14px;transform:none}
.opening-film{width:min(calc(100vw - 28px),50svh);height:auto;min-height:0;max-height:none;max-width:none;aspect-ratio:9/16;margin:0;overflow:hidden;border:1px solid rgba(242,220,171,.86);box-shadow:0 34px 90px rgba(8,22,39,.32),0 5px 18px rgba(8,22,39,.2),inset 0 0 0 5px rgba(255,253,247,.16)}
.opening-film:before{inset:0;opacity:.88}
.opening-film:after{inset:8px;border-color:rgba(255,238,194,.34)}
.opening-video{object-fit:cover;object-position:center}
.opening-trigger{position:absolute;z-index:4;inset:0;width:100%;height:100%;min-width:0;padding:0;border:0;border-radius:0;color:#fffdf7;background:transparent;box-shadow:none;letter-spacing:0;text-transform:none}
.opening-trigger span{position:absolute;left:50%;bottom:clamp(22px,5vh,48px);display:inline-flex;align-items:center;justify-content:center;min-width:160px;padding:10px 21px;border:1px solid rgba(242,220,171,.92);outline:1px solid rgba(181,151,92,.56);outline-offset:3px;color:#fffdf7;background:linear-gradient(180deg,rgba(42,75,110,.88),rgba(18,43,70,.94));box-shadow:0 8px 22px rgba(10,24,42,.28),inset 0 1px rgba(255,255,255,.24);font-family:var(--serif);font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;transform:translateX(-50%);transition:opacity .48s,translate .48s,background .25s}
.opening-trigger:hover:not(:disabled) span{background:linear-gradient(180deg,#3c6797,#17395f)}
.opening-trigger:hover:not(:disabled){transform:none;filter:none}
.opening-trigger:disabled span{opacity:.74}
.opening-trigger:focus-visible{outline:none}
.opening-trigger:focus-visible span{outline:2px solid #fffdf7;outline-offset:7px}
.welcome.is-playing .opening-trigger span,.welcome.is-expanding .opening-trigger span{opacity:0;translate:0 7px;pointer-events:none}
.welcome.is-expanding .opening-film{filter:none}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.photo-frame--oval .photo-mat,.photo-frame--oval .photo-mat img{border-radius:0;overflow:visible}
.photo-frame{padding:clamp(17px,2vw,26px);border-radius:2px;background-size:100% 100%,cover;background-repeat:no-repeat,no-repeat}
.photo-frame--oval{background-image:url("assets/invitacion/ornamentos/portrait-ornament.svg"),linear-gradient(135deg,#fffdf7,#e9e4d8);border-radius:48% 48% 3px 3px}
.photo-frame--tall{background-image:url("assets/invitacion/ornamentos/portrait-tall.svg"),linear-gradient(135deg,#fffdf7,#e9e4d8);border-radius:2px 78px 2px 78px}
.photo-frame--wide{background-image:url("assets/invitacion/ornamentos/portrait-wide.svg"),linear-gradient(135deg,#fffdf7,#e9e4d8);border-radius:78px 2px 78px 2px}
.photo-frame--tall .photo-mat,.photo-frame--wide .photo-mat{border-radius:0;overflow:visible}
.photo-frame--tall .photo-mat img,.photo-frame--wide .photo-mat img{border-radius:0;max-height:none}
.story-flower--blue{right:-62px;top:-78px;opacity:.36}
.event-panel h3{position:relative;z-index:2;display:table;width:max-content;max-width:100%;margin:7px auto 12px;padding:5px 14px 8px;border-radius:2px;background:rgba(255,253,247,.98);box-shadow:0 0 0 4px rgba(255,253,247,.64);text-wrap:balance}
.section-flower--countdown{opacity:.48}
.section-flower--story{opacity:.43}
.section-flower--events{opacity:.5}
.story-flower--clove{opacity:.34}
.event-panel{isolation:isolate}
.event-panel:before,.event-panel:after{display:block;z-index:0;inset:auto;width:clamp(112px,14vw,180px);height:auto;aspect-ratio:1;border:0;border-radius:0;background-position:center;background-size:contain;background-repeat:no-repeat;opacity:.54;filter:drop-shadow(0 8px 14px rgba(31,49,68,.16));pointer-events:none}
.event-panel:before{top:-27px;left:-27px;background-image:url("assets/invitacion/capas/flower-top.png")}
.event-panel:after{right:-31px;bottom:-36px;background-image:url("assets/invitacion/capas/flower-bottom.png")}
.event-panel--reception:before{top:-28px;right:-29px;left:auto;background-image:url("assets/invitacion/capas/rosas-marfil.png")}
.event-panel--reception:after{right:auto;bottom:-34px;left:-28px;background-image:url("assets/invitacion/capas/flower-bottom.png")}
.attire-section:after{opacity:.3}
@media(max-width:760px){
  .welcome:before{inset:6px;opacity:.2}
  .opening-film{width:min(calc(100vw - 24px),50svh)}
  .opening-trigger span{min-width:146px;padding:9px 18px;font-size:.7rem}
}
@media(max-width:390px){
  .opening-film{width:min(calc(100vw - 20px),50svh)}
  .opening-trigger span{bottom:23px}
}
@media(prefers-reduced-motion:reduce){.opening-trigger span{transition:none}}

/* The original curtain/floral stage remains the canvas; only the film window is refined. */
.welcome.is-expanding{opacity:0;transition:opacity 4s cubic-bezier(.4,0,.2,1),visibility 4s}
.welcome-content{
  grid-template-rows:minmax(0,1fr) auto;
  grid-template-columns:minmax(0,1fr);
  align-content:stretch;
  justify-items:center;
  gap:0;
  padding:clamp(12px,3svh,28px) 18px clamp(22px,4svh,38px);
  transform:none
}
.welcome-curtain-edges{display:none}
.opening-film{
  --video-zoom:1;
  align-self:center;
  width:min(38vw,540px,calc((100svh - 330px)*.5625));
  height:auto;
  min-height:0;
  max-height:none;
  max-width:calc(100vw - 40px);
  aspect-ratio:9/16;
  margin:0 auto;
  overflow:hidden;
  border:0;
  outline:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  cursor:pointer
}
.opening-film:before,.opening-film:after{display:none;content:none}
.opening-mask-x,.opening-mask-y{position:absolute;inset:0;overflow:hidden}
.opening-mask-x,.opening-mask-y{-webkit-mask-image:none;mask-image:none}
.opening-video{
  --video-zoom:1;
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  transform:scale(var(--video-zoom));
  transform-origin:center;
  background:transparent
}
.opening-trigger{
  position:relative;
  inset:auto;
  z-index:3;
  align-self:end;
  width:auto;
  height:auto;
  min-width:0;
  margin:clamp(14px,2.3svh,24px) 0 0;
  padding:9px 22px;
  border:1px solid rgba(229,203,151,.92);
  border-radius:999px;
  color:#fffdf7;
  background:linear-gradient(180deg,rgba(42,75,110,.9),rgba(18,43,70,.94));
  box-shadow:0 5px 16px rgba(10,24,42,.18),inset 0 1px rgba(255,255,255,.22);
  font-size:.78rem;
  letter-spacing:.13em
}
.opening-trigger span{position:static;min-width:0;padding:0;border:0;outline:0;background:none;box-shadow:none;transform:none}
.opening-trigger:hover:not(:disabled) span{background:none}
.opening-trigger:focus-visible span{outline:2px solid #fffdf7;outline-offset:5px}
.welcome.is-playing .opening-trigger,.welcome.is-expanding .opening-trigger{opacity:0;transform:translateY(6px);pointer-events:none}
.welcome.is-expanding .opening-film{filter:none}

/* Restore the date medallion's intended position and keep the invitation link clear. */
.hero-copy,.hero-emblem{position:relative;z-index:1}
.hero-emblem{position:absolute;--emblem-x:0px;right:7%;bottom:12%;transform:translateX(var(--emblem-x))}
.hero:not(.portal-opening) .hero-copy{margin:0 0 0; padding:0}
.welcome-editorial{
  position:absolute;
  z-index:3;
  left:50%;
  width:min(94vw,1120px);
  color:var(--navy);
  text-align:center;
  pointer-events:none;
  transform:translateX(-50%);
  transition:opacity .58s cubic-bezier(.22,.72,.24,1),transform .58s cubic-bezier(.22,.72,.24,1)
}
.welcome-editorial.is-leaving{opacity:0;transform:translate(-50%,-7px)}
.welcome-editorial--identity{top:clamp(14px,2.4svh,26px);animation:welcome-copy-in .85s .12s both}
.welcome-flower{z-index:2;opacity:.86;filter:drop-shadow(0 7px 12px rgba(32,48,62,.13));transition:opacity .72s cubic-bezier(.22,.72,.24,1)}
.welcome-flower.is-leaving,.welcome-envelope-flourish.is-leaving{opacity:0}
.welcome-content{z-index:3}
.welcome-envelope-flourish{position:absolute;z-index:2;top:50%;width:24px;height:clamp(90px,16svh,138px);overflow:visible;opacity:.9;transform:translateY(-50%);filter:drop-shadow(0 2px 2px rgba(120,86,38,.14));pointer-events:none;transition:opacity .72s cubic-bezier(.22,.72,.24,1)}
.welcome-envelope-flourish--left{left:calc(50% - min(22vw,330px))}
.welcome-envelope-flourish--right{right:calc(50% - min(22vw,330px));transform:translateY(-50%) scaleX(-1)}
.welcome-wordmark{margin:0;color:#17395f;font-family:var(--serif);font-size:clamp(.82rem,1.2vw,1rem);font-weight:600;letter-spacing:.23em;line-height:1.05;text-transform:uppercase}
.welcome-wordmark span{display:block;margin-top:4px;color:#92713d;font-size:.58em;font-weight:500;letter-spacing:.31em}
.welcome-gold-divider{display:block;width:104px;height:11px;margin:6px auto 1px;fill:none;stroke:#ad8748;stroke-width:.8;stroke-linecap:round;stroke-linejoin:round}
.welcome-divider-petal{fill:#d9c18d;fill-opacity:.34;stroke:#ad8748;stroke-width:.55}
.welcome-promise{margin:0;color:#756343;font-family:var(--serif);font-size:clamp(.7rem,1.1vw,.82rem);letter-spacing:.17em}
.welcome-editorial--names{top:clamp(75px,10.5svh,98px);animation:welcome-copy-in .95s .24s both;isolation:isolate}
.welcome-name-frame{position:absolute;z-index:0;top:50%;left:50%;width:min(92vw,710px);height:calc(100% + 30px);min-height:122px;overflow:visible;transform:translate(-50%,-50%);filter:drop-shadow(0 2px 2px rgba(120,86,38,.12));pointer-events:none}
.welcome-editorial--names h1,.welcome-wedding-date{position:relative;z-index:1}
.welcome-editorial--names h1{display:grid;justify-items:center;gap:0;max-width:100%;margin:0;color:#17395f;font-family:var(--script);font-size:clamp(1.65rem,2.6vw,2.3rem);font-weight:400;line-height:1.08}
.welcome-editorial--names h1 .welcome-name{display:block;white-space:nowrap}
.welcome-editorial--names h1 i{display:block;margin:-.03em 0 -.02em;color:#aa813f;font-style:normal;font-size:.62em;line-height:.9}
.welcome-wedding-date{margin:2px 0 0;color:#8a7045;font-family:var(--serif);font-size:.72rem;letter-spacing:.19em}
.welcome-editorial--quote{bottom:clamp(72px,10.5svh,92px);animation:welcome-copy-in .9s .35s both}
.welcome-gold-divider--small{width:74px;height:8px;margin:0 auto 2px}
.welcome-editorial--quote p{margin:0;color:#706246;font-family:var(--serif);font-size:clamp(.68rem,1vw,.78rem);font-style:italic;letter-spacing:.08em}
@keyframes welcome-copy-in{from{opacity:0;translate:0 6px}to{opacity:1;translate:0 0}}
.letter-overlay{
  position:fixed;
  z-index:45;
  display:grid;
  place-items:center;
  overflow:hidden;
  opacity:0;
  visibility:hidden;
  --paper-side-reveal:0%;
  --paper-center-reveal:0%;
  clip-path:polygon(0 0,100% 0,100% var(--paper-side-reveal),50% var(--paper-center-reveal),0 var(--paper-side-reveal));
  color:#17395f;
  pointer-events:none;
  transition:opacity .72s cubic-bezier(.22,.72,.24,1),visibility 0s linear .72s
}
.letter-overlay.is-visible{opacity:1;visibility:visible;transition:opacity .5s cubic-bezier(.22,.72,.24,1),visibility 0s}
.letter-overlay.is-leaving{opacity:0;visibility:visible;transition:opacity .72s cubic-bezier(.4,0,.2,1),visibility 0s}
.letter-overlay-copy{position:absolute;z-index:1;inset:0;width:100%;text-align:center}
.letter-overlay-copy{transition:opacity .72s cubic-bezier(.4,0,.2,1)}
.letter-overlay.is-leaving .letter-overlay-copy{opacity:0}
.letter-overlay-copy>*{position:absolute;left:8%;width:84%;margin:0;opacity:0;transform:translateY(5px);transition:opacity .42s cubic-bezier(.22,.72,.24,1),transform .42s cubic-bezier(.22,.72,.24,1)}
.letter-overlay.shows-ornament .letter-ornament,.letter-overlay.shows-title .letter-title,.letter-overlay.shows-names .letter-names,.letter-overlay.shows-date .letter-date{opacity:1;transform:translateY(0)}
.letter-names{margin:0;color:#17395f;font-family:var(--script);font-size:clamp(1.35rem,5.2vw,2rem);line-height:.92;white-space:nowrap}
.letter-names i{color:#a77e39;font-style:normal;font-size:.78em}
.letter-ornament{display:block;top:3%;left:calc(50% - 31px);width:62px;height:11px;fill:none;stroke:#a77e39;stroke-width:1;stroke-linecap:round;stroke-linejoin:round}
.letter-title{top:19%;color:#74613d;font-family:var(--serif);font-size:clamp(.56rem,2.3vw,.76rem);letter-spacing:.22em;text-transform:uppercase}
.letter-names{top:37%}
.letter-date{top:57%;color:#62563f;font-family:var(--serif);font-size:clamp(.54rem,2vw,.7rem);letter-spacing:.14em}
@media(max-width:760px){
  .welcome-flower{width:clamp(84px,25vw,108px);opacity:.88}
  .welcome-flower--top{top:0;left:0}
  .welcome-flower--bottom{right:0;bottom:clamp(88px,13svh,112px)}
  .welcome-envelope-flourish{left:2px;right:2px;width:clamp(12px,3.8vw,16px);height:clamp(72px,12svh,100px)}
  .welcome-envelope-flourish--right{left:auto}
  .welcome-content{z-index:3}
  .welcome-name-frame{width:min(94vw,540px);height:calc(100% + 26px);min-height:118px}
  .welcome-editorial--identity{top:clamp(14px,2.4svh,22px)}
  .welcome-wordmark{font-size:.83rem}
  .welcome-gold-divider{width:82px;height:9px;margin:4px auto 1px}
  .welcome-promise{font-size:.68rem;letter-spacing:.14em}
  .welcome-editorial--names{top:clamp(76px,10.5svh,91px)}
  .welcome-editorial--names h1{font-size:clamp(1.9rem,8.4vw,2.25rem);line-height:1.08}
  .welcome-editorial--names h1 i{font-size:.58em}
  .welcome-wedding-date{margin-top:4px;font-size:.63rem;letter-spacing:.13em}
  .welcome-editorial--quote{bottom:clamp(73px,10svh,88px)}
  .welcome-gold-divider--small{width:62px;height:7px;margin-bottom:1px}
  .welcome-editorial--quote p{font-size:.67rem;letter-spacing:.035em}
}
@media(max-width:390px){
  .welcome-flower{width:clamp(78px,24vw,96px)}
  .welcome-editorial--names h1{font-size:clamp(1.9rem,8vw,2.08rem);line-height:1.08}
  .welcome-editorial--quote p{font-size:.62rem}
}
@media(max-width:760px) and (max-height:760px){
  .welcome-flower{width:clamp(68px,20vw,82px)}
  .welcome-flower--bottom{bottom:clamp(80px,13svh,94px)}
  .welcome-editorial--identity{top:7px}
  .welcome-wordmark{font-size:.73rem}
  .welcome-wordmark span{margin-top:2px;font-size:.54em}
  .welcome-gold-divider{display:none}
  .welcome-promise{margin-top:3px;font-size:.58rem}
  .welcome-editorial--names{top:65px}
  .welcome-editorial--names h1{font-size:clamp(1.85rem,7.7vw,2.15rem);line-height:1.06}
  .welcome-editorial--names h1 i{font-size:.56em}
  .welcome-wedding-date{margin-top:2px;font-size:.57rem}
  .welcome-editorial--quote{display:block;bottom:clamp(78px,12svh,92px)}
}
@media(prefers-reduced-motion:reduce){
  .welcome-editorial--identity,.welcome-editorial--names,.welcome-editorial--quote{animation:none;opacity:1}
  .letter-overlay-copy>*{transition:none}
}
@media(max-width:760px){
  .welcome-curtain-edges{display:block;position:absolute;z-index:0;inset:0;overflow:hidden;pointer-events:none}
  .welcome-curtain-edge{position:absolute;top:0;bottom:0;width:clamp(62px,23vw,112px);background-image:url("assets/invitacion/cover-backdrop.jpg");background-repeat:no-repeat;background-size:auto 100svh;opacity:.94}
  .welcome-curtain-edge--left{left:0;background-position:left center;-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 38%,transparent 100%);mask-image:linear-gradient(90deg,#000 0%,#000 38%,transparent 100%)}
  .welcome-curtain-edge--right{right:0;background-position:right center;-webkit-mask-image:linear-gradient(270deg,#000 0%,#000 38%,transparent 100%);mask-image:linear-gradient(270deg,#000 0%,#000 38%,transparent 100%)}
  .opening-film{width:min(90vw,370px,calc((100svh - 350px)*.5625))}
  .opening-trigger{margin-top:clamp(12px,2svh,18px);padding:8px 19px;font-size:.7rem}
  .hero:not(.portal-opening) .hero-copy{margin-bottom:clamp(124px,17svh,150px);padding-inline:10px}
  .hero-emblem{--emblem-x:50%;right:50%;bottom:clamp(66px,9svh,82px);width:105px;height:105px}
  .hero-ornament{bottom:23px}
}
@media(max-width:390px){
  .opening-film{width:min(90vw,350px,calc((100svh - 350px)*.5625))}
  .hero:not(.portal-opening) .hero-copy{margin-bottom:136px}
  .hero-emblem{bottom:70px;width:98px;height:98px}
}
@media(max-height:670px){
  .welcome-content{padding-block:8px 16px}
  .opening-film{width:min(36vw,410px,calc((100svh - 330px)*.5625))}
  .opening-trigger{margin-top:8px;padding-block:7px}
  .welcome-envelope-flourish--left{left:calc(50% - 18vw - 21px)}
  .welcome-envelope-flourish--right{right:calc(50% - 18vw - 21px);left:auto}
}

/* Cover-only composition: keep the envelope film and its layout untouched. */
#welcome{overflow:hidden;isolation:isolate}
#welcome:before{inset:clamp(12px,1.7vw,22px);opacity:.92}
#welcome:after{background:radial-gradient(ellipse at 50% 37%,rgba(255,253,247,.34),rgba(255,253,247,.1) 56%,rgba(16,35,55,.06));pointer-events:none}
#welcome.is-expanding{opacity:0;transition:opacity 3s cubic-bezier(.4,0,.2,1),visibility 3s}
/* Reveal the page beneath the expanding hero while keeping it inert until handoff. */
#invitationPage.is-revealing{opacity:1}
#welcome .welcome-botanical{position:absolute;z-index:2;top:clamp(4px,1.5svh,20px);left:50%;width:min(96vw,1320px);height:auto;max-height:62svh;object-fit:contain;opacity:.74;transform:translateX(-50%);pointer-events:none;transition:opacity 1.8s cubic-bezier(.22,.72,.24,1),transform 1.8s cubic-bezier(.22,.72,.24,1)}
#welcome .welcome-content{z-index:3}
#welcome .welcome-editorial{width:min(92vw,900px);transition:opacity 1.8s cubic-bezier(.22,.72,.24,1),transform 1.8s cubic-bezier(.22,.72,.24,1)}
#welcome .welcome-editorial--identity{top:clamp(17px,3.4svh,42px)}
#welcome .welcome-wordmark{color:#17395f;font-size:clamp(.9rem,1.15vw,1.08rem);letter-spacing:.25em}
#welcome .welcome-wordmark span{margin-top:5px;color:#98743b;font-size:.61em;letter-spacing:.32em}
#welcome .welcome-gold-divider{width:90px;height:10px;margin:7px auto 4px}
#welcome .welcome-promise{color:#6e6044;font-size:clamp(.78rem,1.05vw,.94rem);letter-spacing:.12em}
#welcome .welcome-editorial--names{top:clamp(98px,10.8svh,142px);isolation:isolate}
#welcome .welcome-editorial--names h1{row-gap:.12em;color:#17395f;font-size:clamp(2.35rem,4.3vw,3.5rem);line-height:1.03;text-shadow:0 1px rgba(255,253,247,.48)}
#welcome .welcome-editorial--names h1 .welcome-name{white-space:nowrap}
#welcome .welcome-editorial--names h1 i{margin:0;color:#b19055;font-size:.53em;line-height:1}
#welcome .welcome-editorial--names:before,#welcome .welcome-editorial--names:after{position:absolute;top:50%;color:#b89a61;font-family:var(--serif);font-size:.65rem;line-height:1;text-shadow:0 0 8px rgba(255,253,247,.8);content:"✦";transform:translateY(-50%)}
#welcome .welcome-editorial--names:before{left:9%}
#welcome .welcome-editorial--names:after{right:9%}
#welcome .welcome-wedding-date{margin-top:11px;color:#7c653c;font-size:clamp(.72rem,.9vw,.88rem);letter-spacing:.17em}
#welcome .welcome-editorial--quote{bottom:clamp(76px,11svh,112px)}
#welcome .welcome-gold-divider--small{width:68px;height:8px;margin-bottom:5px}
#welcome .welcome-editorial--quote p{color:#66583f;font-size:clamp(.75rem,1vw,.9rem);letter-spacing:.06em}
#welcome .welcome-editorial--quote:after{display:block;margin:5px auto 0;color:#ae8b4f;font-family:var(--serif);font-size:.62rem;letter-spacing:.65em;content:"·  ✧  ·"}
#welcome .welcome-rsvp-label{position:absolute;z-index:4;left:50%;display:flex;align-items:center;justify-content:center;gap:clamp(8px,1.5vw,15px);width:max-content;max-width:calc(100vw - 32px);margin:0;color:#17395f;font-family:var(--serif);font-size:clamp(.72rem,1vw,.88rem);font-weight:600;letter-spacing:.12em;text-align:center;text-wrap:balance;pointer-events:none;transform:translateX(-50%);transition:opacity 1.8s cubic-bezier(.22,.72,.24,1),translate 1.8s cubic-bezier(.22,.72,.24,1)}
#welcome .welcome-rsvp-label:before,#welcome .welcome-rsvp-label:after{width:clamp(20px,3vw,34px);height:1px;background:linear-gradient(90deg,transparent,#b19055,transparent);content:"";flex:0 0 auto}
#welcome .welcome-editorial.is-leaving{opacity:0;transform:translate(-50%,-8px)}
#welcome .welcome-botanical.is-leaving{opacity:0;transform:translate(-50%,-7px)}
#welcome .welcome-rsvp-label.is-leaving{opacity:0;translate:0 -7px}

@media(max-width:760px){
  #welcome:before{inset:12px 8px;opacity:.94}
  #welcome .welcome-botanical{top:clamp(30px,5svh,54px);width:min(104vw,620px);max-height:35svh;opacity:.65}
  #welcome .welcome-rsvp-label{gap:8px;font-size:clamp(.68rem,2.9vw,.78rem);letter-spacing:.08em}
  #welcome .welcome-rsvp-label:before,#welcome .welcome-rsvp-label:after{width:clamp(18px,5vw,26px)}
  #welcome .welcome-editorial--identity{top:clamp(13px,2.3svh,24px)}
  #welcome .welcome-wordmark{font-size:clamp(.78rem,3.5vw,.92rem)}
  #welcome .welcome-gold-divider{width:70px;height:8px;margin:4px auto 2px}
  #welcome .welcome-promise{font-size:clamp(.67rem,2.8vw,.78rem);letter-spacing:.09em}
  #welcome .welcome-editorial--names{top:clamp(86px,11svh,116px)}
  #welcome .welcome-editorial--names h1{row-gap:.09em;font-size:clamp(2.05rem,8.2vw,2.7rem);line-height:1.02}
  #welcome .welcome-editorial--names:before{left:2%}
  #welcome .welcome-editorial--names:after{right:2%}
  #welcome .welcome-wedding-date{margin-top:6px;font-size:clamp(.65rem,2.8vw,.76rem);letter-spacing:.13em}
  #welcome .welcome-editorial--quote{bottom:clamp(82px,12svh,104px)}
  #welcome .welcome-editorial--quote p{font-size:clamp(.68rem,2.9vw,.78rem);letter-spacing:.035em}
}

@media(max-width:390px){
  #welcome .welcome-editorial--names{top:clamp(81px,10.5svh,100px)}
  #welcome .welcome-editorial--names h1{font-size:clamp(1.9rem,8vw,2.15rem)}
  #welcome .welcome-wedding-date{font-size:.64rem;letter-spacing:.1em}
  #welcome .welcome-editorial--quote{bottom:clamp(78px,11svh,92px)}
}

@media(max-width:760px) and (max-height:760px){
  #welcome .welcome-editorial--identity{top:10px}
  #welcome .welcome-editorial--names{top:clamp(69px,11svh,86px)}
  #welcome .welcome-editorial--names h1{font-size:clamp(1.85rem,7.6vw,2.2rem)}
  #welcome .welcome-wedding-date{margin-top:4px;font-size:.62rem}
  #welcome .welcome-editorial--quote{bottom:clamp(75px,13svh,94px)}
}

@media(max-width:760px) and (max-height:670px){
  #welcome .welcome-editorial--quote{bottom:56px}
  #welcome .welcome-rsvp-label{font-size:.62rem}
}

@media(min-width:761px) and (max-height:670px){
  #welcome .welcome-editorial--identity{top:8px}
  #welcome .welcome-wordmark{font-size:.78rem}
  #welcome .welcome-gold-divider{width:60px;height:6px;margin:2px auto 1px}
  #welcome .welcome-promise{font-size:.66rem}
  #welcome .welcome-editorial--names{top:clamp(61px,17svh,92px)}
  #welcome .welcome-editorial--names h1{row-gap:.03em;font-size:clamp(1.4rem,2.6vw,2rem);line-height:1}
  #welcome .welcome-wedding-date{margin-top:2px;font-size:.58rem}
  #welcome .welcome-wedding-date{margin-top:4px;font-size:.64rem}
  #welcome .welcome-editorial--quote{bottom:72px}
}

@media(min-width:761px) and (min-height:671px) and (max-height:820px){
  #welcome .welcome-editorial--identity{top:14px}
  #welcome .welcome-editorial--names{top:clamp(66px,9svh,84px)}
  #welcome .welcome-editorial--names h1{row-gap:.08em;font-size:clamp(2rem,3.8vw,3rem);line-height:1.02}
  #welcome .welcome-wedding-date{margin-top:7px}
}

/* Independent full-screen video opener. The previous curtain cover is not part of this scene. */
.cinematic-opening{
  position:fixed;
  z-index:100;
  inset:0;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:#f5f1e9;
  isolation:isolate
}
.cinematic-opening[hidden]{display:none!important}
.cinematic-opening-video{
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  background:#f5f1e9
}
.cinematic-opening-poster{
  position:absolute;
  z-index:1;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  pointer-events:none;
  transition:opacity .24s ease
}
.cinematic-opening-loading{
  position:absolute;
  z-index:2;
  bottom:calc(env(safe-area-inset-bottom, 0px) + 82px);
  left:50%;
  display:flex;
  align-items:center;
  gap:9px;
  max-width:calc(100vw - 34px);
  margin:0;
  padding:7px 11px;
  border:1px solid rgba(181,151,92,.3);
  border-radius:20px;
  color:#fffdf7;
  background:rgba(23,57,95,.78);
  box-shadow:0 4px 14px rgba(8,22,39,.18);
  font-size:.78rem;
  line-height:1.2;
  transform:translateX(-50%)
}
.cinematic-opening-spinner{
  width:13px;
  height:13px;
  flex:0 0 13px;
  border:1.5px solid rgba(255,255,255,.42);
  border-top-color:#fffdf7;
  border-radius:50%;
  animation:opening-spin .8s linear infinite
}
.cinematic-opening-loading.is-error .cinematic-opening-spinner{display:none}
@keyframes opening-spin{to{transform:rotate(360deg)}}
.cinematic-open-button{
  position:absolute;
  z-index:2;
  bottom:max(24px,calc(env(safe-area-inset-bottom) + 18px));
  left:50%;
  min-width:206px;
  padding:12px 26px;
  border:1px solid rgba(242,220,171,.96);
  border-radius:999px;
  color:#fffdf7;
  background:linear-gradient(180deg,rgba(49,93,145,.96),rgba(23,57,95,.98) 58%,rgba(16,44,74,.99));
  box-shadow:0 0 0 3px rgba(181,151,92,.74),0 10px 26px rgba(8,22,39,.3),inset 0 1px rgba(255,255,255,.28);
  font-family:var(--serif);
  font-size:clamp(.86rem,3.6vw,1rem);
  letter-spacing:.13em;
  text-transform:uppercase;
  transform:translateX(-50%);
  cursor:pointer;
  transition:opacity .36s ease,transform .36s ease,filter .25s ease
}
.cinematic-open-button{touch-action:manipulation}
.cinematic-open-button:disabled{opacity:.7;cursor:wait}
.cinematic-open-button:hover:not(:disabled){filter:brightness(1.08);transform:translate(-50%,-2px)}
.cinematic-open-button:focus-visible{outline:3px solid #fffdf7;outline-offset:6px}
.cinematic-opening.is-playing .cinematic-open-button{opacity:0;transform:translate(-50%,8px);pointer-events:none}
.cinematic-opening.is-playing .cinematic-opening-poster{opacity:0}
.cinematic-opening.is-fallback .cinematic-open-button{opacity:0;pointer-events:none}
#invitationPage.is-revealing{opacity:1}
.hero.portal-opening{
  position:fixed;
  z-index:110;
  inset:0;
  width:100vw;
  height:100svh;
  min-height:100svh;
  max-height:100svh;
  margin:0;
  padding:0;
  overflow:hidden;
  transform:none;
  transform-origin:center;
  isolation:isolate;
  background:linear-gradient(135deg,rgba(255,253,247,.94),rgba(248,245,237,.98) 52%,rgba(237,239,233,.94)),url("assets/invitacion/capas/paper-texture.jpg") center/cover;
  box-shadow:inset 0 0 0 20px rgba(181,151,92,.12)
}
.hero.portal-opening:before{inset:28px;border-color:rgba(181,151,92,.4)}
.hero.portal-opening:after{inset:38px;border-color:rgba(181,151,92,.22)}
.hero.portal-opening .hero-copy{position:relative;z-index:2;opacity:1}
.hero.portal-opening .hero-copy>*{opacity:0}
.hero.portal-opening .hero-emblem{z-index:2;opacity:0}
.hero.portal-opening .hero-flower{opacity:0}
.hero.portal-opening .hero-ornament{opacity:0}
.hero-attendance-link{
  max-width:min(100%,390px);
  justify-content:center;
  font-size:clamp(.78rem,3.7vw,.9rem);
  line-height:1.3;
  text-align:center;
  text-wrap:balance
}
@media(prefers-reduced-motion:reduce){
  .cinematic-open-button{transition:none}
}

@media(prefers-reduced-motion:reduce){
  #welcome .welcome-botanical,#welcome .welcome-editorial{transition-duration:1.8s}
}