@import url('assets/fonts/invitation-fonts.css');
:root{
  --ivory:#F3EDE2;
  --sand:#D9C9B5;
  --warm-brown:#94745C;
  --warm-brown-dark:#6e523e;
  --soft-black:#292521;
  --champagne:#E8D9C5;
  --champagne-light:#F9F5EE;

  --paper:#F3EDE2;
  --mint:#F8F4EC;
  --blush:#EDE4D6;
  --deep:#292521;
  --jade:#94745C;
  --ink:#292521;
  --gold:#94745C;
  --red:#94745C;
  --blue:#94745C;
  --lilac:#D9C9B5;
  --border-gold:#94745C;
  --gold-glow:#E8D9C5;

  --script:"Allura","Tangerine",cursive;
  --serif:"Viaoda Libre","Cormorant Garamond",Georgia,serif;
  --sans:Arial,"Cormorant Garamond",sans-serif;
}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:25px}body{margin:0;background:var(--deep);font-family:var(--serif);color:var(--ink);font-size:15.5px;line-height:1.5}body.unopened{overflow:hidden}button,input,textarea,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit}img{display:block;max-width:100%;user-select:none}p,h1,h2,h3,h4{margin:0}button{border:0}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #94745C;outline-offset:5px}.script{font-family:var(--script);font-weight:400;line-height:1.08}.eyebrow{font-family:var(--sans);font-size:9px;letter-spacing:.28em;font-weight:500;line-height:1.8;text-transform:uppercase}.eyebrow.light{color:#ede3cd}.fine-rule{height:1px;width:56px;margin:22px auto;background:currentColor;opacity:.45}.button{display:inline-flex;justify-content:center;align-items:center;gap:25px;min-height:49px;padding:15px 25px;font:10px/1.4 var(--sans);letter-spacing:.16em;text-decoration:none;transition:background .3s,transform .3s,color .3s;position:relative}.button:hover{transform:translateY(-2px)}.button-ivory{color:var(--jade);background:var(--paper);border:1px solid var(--gold);outline:1px solid #e3d5b68c;outline-offset:5px}.button-jade{background:var(--jade);color:var(--paper);border:1px solid var(--jade)}.button-jade:hover{background:#21604e}.button-outline{background:rgba(243,237,226,0.6);color:#94745C;border:1px solid #94745C;box-shadow:0 4px 12px rgba(41,37,33,0.06);transition:background .3s,color .3s}.button-outline:hover{background:#ffffff12}.text-link{font:9px/1.8 var(--sans);letter-spacing:.16em;text-decoration:none;padding:10px 0;border:0;border-bottom:1px solid currentColor;background:transparent;color:inherit}.skip-link{position:fixed;z-index:100;top:-100px;left:20px;background:var(--paper);padding:12px}.skip-link:focus{top:10px}.ornament{pointer-events:none;position:absolute}.scene{position:relative;isolation:isolate;overflow:hidden}.section-heading{text-align:center;margin-bottom:35px;position:relative;z-index:2}.section-heading h2{font-size:39px;margin:8px 0 12px}.section-heading>p:last-child:not(.eyebrow){font-size:14.5px;line-height:1.5}.section-paper{background:var(--paper)}.section-mint{background:var(--mint)}.section-blush{background:var(--blush)}.section-paper,.section-mint,.section-blush{position:relative;overflow:hidden;padding:80px 45px}.section-paper:before,.section-mint:before,.section-blush:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.22;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23777777' opacity='.12' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}.reveal{opacity:0;transform:translateY(28px);transition:opacity 0.9s cubic-bezier(.22,1,.36,1),transform 0.9s cubic-bezier(.22,1,.36,1)}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-scale{opacity:0;transform:scale(.92) translateY(24px);transition:opacity 1s cubic-bezier(.22,1,.36,1),transform 1s cubic-bezier(.22,1,.36,1)}
.reveal-scale.visible{opacity:1;transform:scale(1) translateY(0)}.sway{transform-origin:50% 5%;animation:lantern-swing 7s ease-in-out infinite alternate}.flower-sway{transform-origin:50% 83%;animation:flower-swing 9s ease-in-out infinite alternate}@keyframes lantern-swing{from{rotate:-2deg}to{rotate:2deg}}@keyframes flower-swing{from{rotate:-1.5deg}to{rotate:1.7deg}}
/* Invitation opening: each prop has its own layer. */
.opening{position:fixed;z-index:90;inset:0;color:var(--paper);display:flex;align-items:center;justify-content:center;overflow:hidden;background:#D9C9B5;transition:opacity .8s ease,visibility .8s}.curtain{position:absolute;inset-block:0;width:50.2%;background-image:linear-gradient(rgba(148,116,92,0.1),rgba(41,37,33,0.25)),url('assets/pearl-cover-satin.webp');background-size:200% 100%;transition:transform 1.5s cubic-bezier(.7,0,.25,1);pointer-events:none}.curtain-left{left:0;background-position:left center;transform-origin:left center}.curtain-right{right:0;background-position:right center;transform-origin:right center}.opening:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 180px rgba(41,37,33,0.15);pointer-events:none;z-index:-1}.opening-content{width:min(540px,100%);text-align:center;position:relative;padding:35px 20px 25px;z-index:2;transition:opacity .7s,transform 1s}.cover-badge{font-size:9px;letter-spacing:.32em;color:#F3EDE2;margin-bottom:10px;text-transform:uppercase}.cover-lantern{position:absolute;z-index:1;top:-65px;width:clamp(110px,17vw,245px);filter:drop-shadow(0 14px 20px #122a3530)}.lantern-left{left:max(20px,calc(50% - 570px))}.lantern-right{right:max(20px,calc(50% - 570px));top:-110px;animation-delay:-3s}.envelope-scene{position:relative;width:100%;height:280px;margin:10px 0 0;perspective:1000px}
.envelope-motion{position:absolute;width:86%;max-width:350px;height:auto;aspect-ratio:1.4/1;left:7%;top:10px;transform:rotate(-2.5deg);transition:transform 1.2s cubic-bezier(.22,1,.36,1);transform-style:preserve-3d}
.envelope-closed{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:4;filter:drop-shadow(0 18px 22px rgba(41,37,33,0.18));transition:opacity .45s ease,transform .6s ease;pointer-events:none}
.envelope-open{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:3;opacity:0;filter:drop-shadow(0 18px 22px rgba(41,37,33,0.18));transition:opacity .45s ease,transform .6s ease;pointer-events:none}
.envelope-seal{position:absolute;z-index:6;top:50%;left:44.5%;width:13%;cursor:pointer;filter:drop-shadow(0 6px 12px rgba(41,37,33,0.28));transition:transform .6s cubic-bezier(.34,1.56,.64,1),opacity .45s ease}
.envelope-tulip{position:absolute;width:28%;left:-2%;bottom:-4%;top:auto;right:auto;z-index:7;rotate:12deg;filter:drop-shadow(0 6px 10px rgba(41,37,33,0.16));transition:transform 1.2s,translate 1.2s}
.envelope-fan{position:absolute;width:34%;right:0%;top:-8%;transform:rotate(10deg);z-index:1;filter:drop-shadow(0 6px 12px rgba(41,37,33,0.14));transition:transform 1.2s}
.guest-address{margin:6px 0 20px;transition:opacity .4s ease}
.guest-address .eyebrow{font-size:8px;letter-spacing:.22em;color:#94745C}
.guest-name{font-size:18px;margin-top:3px;color:#292521}
.skip-opening{display:block;margin:18px auto 0;font:9px var(--sans);letter-spacing:.08em;color:#6e523eb0;background:transparent;padding:8px;transition:opacity .4s ease}
#open-invitation{transition:opacity .4s ease}
.opening.is-opening .envelope-seal{opacity:0;transform:scale(1.35) translateY(35px) rotate(16deg);pointer-events:none;transition:opacity .35s ease,transform .5s cubic-bezier(.34,1.56,.64,1)}
.opening.is-opening .envelope-closed{opacity:0}
.opening.is-opening .envelope-open{opacity:1;transform:translateY(-8px)}
.opening.is-opening .envelope-motion{transform:rotate(0deg) translateY(6px);transition:transform 1s cubic-bezier(.22,1,.36,1) .1s}
.opening.is-opening .envelope-tulip{translate:-22px 12px;rotate:24deg}
.opening.is-opening .envelope-fan{transform:rotate(24deg) translate(20px,-12px)}.opening.is-opening .guest-address,.opening.is-opening #open-invitation,.opening.is-opening .skip-opening{opacity:0;pointer-events:none;transition:opacity .3s ease}.opening.opened .opening.dismissed .letter-insert .letter-monogram{display:flex;align-items:center;justify-content:center;gap:4px;font-family:var(--script);font-size:58px;line-height:1;color:#94745C;letter-spacing:0;text-align:center}.letter-insert .letter-monogram em{font-size:34px;font-style:normal;color:#94745C;margin:0 3px}.letter-insert .letter-monogram em{font-size:38px;font-style:normal;color:#94745C;margin:0 4px}
.transition-card{position:fixed;inset:0;z-index:20;display:flex;align-items:flex-start;justify-content:center;padding-top:clamp(135px,26vh,220px);pointer-events:none;opacity:0;transform:scale(.92);transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1)}
.transition-card-inner{background:#FDFBF7;border:1px solid #94745C;box-shadow:0 0 0 5px rgba(232,217,197,.5),0 16px 45px rgba(5,20,15,.5);padding:28px 22px 24px;text-align:center;max-width:255px;width:72%;position:relative;border-radius:3px}
.transition-card-inner:before{content:'';position:absolute;inset:6px;border:1px dashed #94745C88;pointer-events:none}
.transition-card .eyebrow{font-size:7px;letter-spacing:.24em;color:#856e58;margin-bottom:8px;display:block}
.transition-rule{width:34px;height:1px;background:#94745C;margin:10px auto}
.transition-message{font-family:var(--serif);font-size:14px;font-style:italic;line-height:1.45;color:#292521;margin:5px 0 6px}
.transition-initials{display:block;font-family:var(--script);font-size:38px;line-height:1;color:#94745C;margin:3px 0 0}
.transition-initials em{font-size:20px;font-style:normal;color:#94745C;margin:0 3px}
.opening.opened .transition-card{opacity:1;transform:scale(1);pointer-events:auto}
.opening.card-closing .transition-card{opacity:0;transform:scale(1.05);transition:opacity .5s ease,transform .5s ease}
.opening.dismissed .transition-card{opacity:0;display:none}
.opening.opened .curtain-left{transform:translateX(-105%)}.opening.opened .curtain-right{transform:translateX(105%)}.opening.opened .opening-content{opacity:0;transform:scale(1.08)}.opening.dismissed{opacity:0;visibility:hidden;pointer-events:none}
/* Desktop remains an editorial portrait while the invitation scrolls. */
.desktop-art{position:fixed;left:0;top:0;width:calc(100% - 560px);height:100dvh;overflow:hidden;background:linear-gradient(#102f3555,#113c4077),url('assets/pearl-cover-satin.webp') center/cover;color:var(--paper)}.desktop-text{position:relative;z-index:2;text-align:center;padding-top:17vh}.desktop-text>.script{font-size:clamp(95px,9vw,150px);margin-top:28px;line-height:.9}.desktop-text>.script span{font-size:.5em}.desktop-date{font-size:11px;letter-spacing:.25em;margin-top:35px}.desktop-lantern{position:absolute;top:-55px;left:2%;width:28%;max-width:220px}.desktop-lantern.second{left:auto;right:0;top:-135px;animation-delay:-3s}.desktop-bouquet{position:absolute;bottom:-8%;right:-8%;width:39%;max-width:400px;z-index:3}.desktop-fan{position:absolute;bottom:-1%;left:-7%;width:51%;transform:rotate(12deg);filter:drop-shadow(0 12px 15px #113c4040)}.desktop-bottom{position:absolute;bottom:25px;left:30px;right:30px;display:flex;justify-content:space-between;font:8px var(--sans);letter-spacing:.18em;z-index:4}.desktop-bottom span:last-child{font-family:var(--serif);font-style:italic;letter-spacing:.05em;font-size:13px}main{width:560px;margin-left:auto;box-shadow:-15px 0 65px #041c3329;background:var(--paper)}.hero{position:relative;width:min(100%, calc(100dvh * 941 / 1671));max-width:560px;aspect-ratio:941/1671;margin:0 auto;background:#F3EDE2 url('assets/pearl-hero-bg.webp') center center/100% 100% no-repeat;box-sizing:border-box;display:flex;flex-direction:column;justify-content:space-between;padding:5.5% 6% 5.5%;color:#292521;overflow:hidden;text-align:center}.hero:before{display:none}.hero-top{display:flex;justify-content:space-between;font:8px var(--sans);letter-spacing:.18em;margin-bottom:48px;color:#94745C}.hero>.eyebrow{font-size:8px;letter-spacing:.25em}.hero-medallion{filter:none!important;width:82%;max-width:360px;aspect-ratio:2/2.7;margin:auto auto;display:flex;align-items:center;justify-content:center;position:relative;z-index:2}.date-card{width:100%;height:100%}.hero-medallion-text{position:relative;inset:auto;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#94745C;text-align:center;width:100%}.hero-medallion-text .eyebrow{font-size:7px}.hero-medallion-text h2{font-size:54px;line-height:.85;margin-top:14px}.hero-medallion-text h2 em{font-size:24px;font-style:normal;display:inline-block;margin:6px}.hero-medallion-text p{font:8px var(--sans);letter-spacing:.16em}.hero-medallion-text .fine-rule{margin:25px auto 18px}.hero-knot{top:58px;right:-7px;width:87px;z-index:3}.hero-peony{width:170px;bottom:100px;left:-42px;z-index:3}.hero-fan{width:220px;right:-77px;bottom:145px;rotate:-32deg}.hero-bottom{position:relative;z-index:4;font-size:14.5px;margin:0 auto;max-width:320px}.scroll-cue{display:flex;flex-direction:column;align-items:center;font:8px var(--sans);letter-spacing:.2em;text-decoration:none;margin-top:28px;gap:14px}.scroll-cue span{font:25px var(--serif)}.quote{text-align:center;padding-block:80px 65px}.small-symbol{width:65px;margin:0 auto 25px}.quote blockquote{font-size:22px;font-style:italic;line-height:1.45;margin:20px -10px}.quote-foot{font-size:13.5px}.ornamental-rule{margin:35px auto 0;color:var(--gold);position:relative;display:flex;align-items:center;gap:15px;justify-content:center}.ornamental-rule:before,.ornamental-rule:after{content:"";width:60px;height:1px;background:#baa37c77}.couple{text-align:center;padding-inline:35px}.couple-portrait{position:relative;width:275px;height:486px;margin:0 auto 30px}
.portrait{position:absolute;width:69.2%;height:83.3%;left:15.4%;top:6.6%;object-fit:cover;border-radius:95px 95px 4px 4px;filter:sepia(.06);z-index:1}
.portrait-frame{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
.portrait-flower{position:absolute;z-index:3;width:115px;right:-28px;bottom:-15px}.couple-names h3{font-size:22px;font-weight:500}.couple-names p{font-size:13.5px;margin-top:6px}.couple-and{display:block;font-size:32px;color:#94745C;margin:10px auto}.couple-knot-ornament{position:absolute;right:18px;left:auto;top:16px;width:52px;height:auto;aspect-ratio:2/3;z-index:4;filter:drop-shadow(0 4px 8px rgba(41,37,33,.15));animation:sway 6s ease-in-out infinite;transform-origin:50% 0;pointer-events:none}.couple-knot-ornament img{width:100%}.keepsake{position:relative;padding:75px 25px 65px;text-align:center;background:#EDE4D6;color:#292521;overflow:hidden}.keepsake:after{content:"";position:absolute;inset:14px;border:1px solid #bd9d6f42;pointer-events:none;z-index:-1}.keepsake .section-heading{margin-bottom:0}.keepsake-collage{height:490px;width:100%;position:relative;max-width:440px;margin:15px auto 25px}.keepsake-item{transition:opacity .85s cubic-bezier(.22,1,.36,1),transform .95s cubic-bezier(.22,1,.36,1);will-change:transform,opacity}.keepsake-collage:not(.in-view) .keepsake-item{opacity:0;pointer-events:none}.keepsake-collage:not(.in-view) .keepsake-pearls{transform:translateY(-35px) scale(.92)}.keepsake-collage:not(.in-view) .tray-composition{transform:translate(35px,-25px) scale(.9) rotate(8deg)}.keepsake-collage:not(.in-view) .keepsake-name-card{transform:translate(-35px,20px) scale(.9) rotate(-10deg)}.keepsake-collage:not(.in-view) .keepsake-date{transform:translate(35px,20px) scale(.9) rotate(12deg)}.keepsake-collage:not(.in-view) .keepsake-fan{transform:translate(-30px,40px) scale(.85) rotate(-18deg)}.keepsake-collage:not(.in-view) .polaroid-one{transform:translateY(45px) scale(.85) rotate(-5deg)}.keepsake-collage:not(.in-view) .keepsake-bouquet{transform:translate(35px,40px) scale(.85) rotate(15deg)}.keepsake-collage.in-view .keepsake-item{opacity:1}.keepsake-collage.in-view .keepsake-pearls{transition-delay:.1s;transform:translateY(0) scale(1) rotate(-6deg)}.keepsake-collage.in-view .tray-composition{transition-delay:.28s;transform:translate(0,0) scale(1) rotate(4deg)}.keepsake-collage.in-view .keepsake-name-card{transition-delay:.48s;transform:translate(0,0) scale(1) rotate(-4deg)}.keepsake-collage.in-view .keepsake-date{transition-delay:.68s;transform:translate(0,0) scale(1) rotate(5deg)}.keepsake-collage.in-view .keepsake-fan{transition-delay:.88s;transform:translate(0,0) scale(1) rotate(-8deg)}.keepsake-collage.in-view .polaroid-one{transition-delay:1.08s;transform:translate(0,0) scale(1) rotate(0deg)}.keepsake-collage.in-view .keepsake-bouquet{transition-delay:1.28s;transform:translate(0,0) scale(1) rotate(6deg)}.keepsake-name-card{position:absolute;left:8%;top:68px;width:48%;aspect-ratio:2/3;z-index:2;filter:drop-shadow(0 10px 14px #0006)}.keepsake-name-card>img{position:absolute;inset:0;z-index:2;width:100%;height:100%}.name-card-fill{position:absolute;inset:18% 15% 18%;border-radius:50%;background:#f2ead8}.name-card-copy{position:absolute;inset:20% 10% 16%;z-index:3;text-align:center;color:#235540;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;line-height:1}
.name-card-copy .nc-name{font-size:28px;line-height:0.92;display:block;color:#94745C}
.name-card-copy .nc-amp{font-size:16px;line-height:0.92;color:#D9C9B5;display:block;margin:1px 0}.name-card-copy span{font-size:22px}.tray-composition{position:absolute;right:4%;top:22px;width:48%;aspect-ratio:3/2;z-index:2;filter:drop-shadow(0 10px 14px #0006)}.tray{width:100%}.tiny-envelope{position:absolute;inset:9% 11%;rotate:-14deg}.tiny-envelope>img:first-child{width:100%}.tiny-seal{position:absolute;width:23%;left:39%;top:40%}.keepsake-date{position:absolute;right:6%;top:120px;width:36%;aspect-ratio:2/3;z-index:3;filter:drop-shadow(0 8px 12px #0005)}.keepsake-date>img{width:100%}.keepsake-date>.script{position:absolute;inset:12% 8% 28%;text-align:center;color:#55445f;font-size:27px;line-height:.88;display:flex;flex-direction:column;align-items:center;justify-content:center}.keepsake-date>.script span{font-size:27px;display:inline-block;margin:3px 0}.keepsake-pearls{position:absolute;width:44%;height:auto;max-height:185px;object-fit:contain;left:14%;top:6px;z-index:1;filter:drop-shadow(0 4px 8px #0006);pointer-events:none}.keepsake-fan{position:absolute;bottom:22px;left:8%;width:45%;z-index:4;filter:drop-shadow(0 8px 14px #0006)}.polaroid{position:absolute;background:#f7f2e7;padding:6px 6px 4px;box-shadow:0 10px 20px #0007;width:33%;z-index:5}.polaroid img{width:100%;aspect-ratio:4/5;object-fit:cover}.polaroid span{font-size:13px;font-family:var(--script);color:#775b4d;display:block;margin-top:2px;text-align:center}.polaroid-one{left:35%;bottom:14px}.polaroid-two{display:none}.keepsake-bouquet{position:absolute;width:33%;right:5%;bottom:8px;z-index:6;filter:drop-shadow(0 10px 14px #0005)}.keepsake-seal{display:none}.events{padding-bottom:80px}.event-card{position:relative;z-index:2;text-align:center;background:#FDFBF7;border:1px solid rgba(148,116,92,0.28);box-shadow:0 0 0 5px rgba(232,217,197,0.4),0 16px 36px rgba(41,37,33,0.08);border-radius:4px;margin:35px auto;padding:42px 28px 36px;max-width:370px;width:92%}.event-number{position:relative;left:auto;top:auto;display:block;font:11px var(--sans);letter-spacing:.24em;color:#94745C;margin-bottom:2px}.event-card h3{font-size:26px;font-weight:400;margin:4px auto 3px;color:#94745C}.event-time{font-size:13px;letter-spacing:.06em;color:#6d5947}.event-card .fine-rule{width:42px;margin:14px auto;opacity:.35}.event-card h4{font-size:16.5px;font-weight:500;margin-bottom:5px;color:#94745C}.event-card>p:not(.eyebrow):not(.event-time){font-size:13px;line-height:1.45;color:#463b33}.event-card .text-link{display:inline-block;margin-top:15px;font:11px var(--sans);font-weight:600;letter-spacing:.16em;color:#ab523e;text-decoration:none;border-bottom:1px solid #ab523e55;padding-bottom:2px;transition:color .2s,border-color .2s}.event-card .text-link:hover{color:var(--jade);border-color:var(--jade)}.events-tulip{width:130px;bottom:12px;right:-32px;z-index:3;rotate:15deg}.countdown{position:relative;background:#D9C9B5;padding:85px 25px 75px;text-align:center;color:#292521;overflow:hidden}.countdown .section-heading h2{font-size:35px}.countdown-lantern{position:relative;width:115px;height:200px;object-fit:contain;margin:-65px auto 12px}.countdown-grid{display:flex;align-items:flex-start;justify-content:center;gap:9px;margin:30px 0 24px}.countdown-grid>div{display:flex;flex-direction:column;min-width:57px}.countdown-grid strong{font-size:36px;font-weight:400;line-height:1.1}.countdown-grid span{font:7px var(--sans);letter-spacing:.18em;margin-top:10px}.countdown-grid i{font-style:normal;font-size:22px;line-height:1.5;color:var(--gold)}#countdown-status{font-size:13.5px;margin-bottom:20px}.countdown .button{font-size:9px;padding:15px 18px}.story{padding-bottom:90px}.story-timeline{position:relative;max-width:340px;margin:auto;padding-left:35px}.story-timeline:before{content:"";position:absolute;left:6px;top:10px;bottom:20px;width:1px;background:#b6a085}.story-timeline article{position:relative;margin-bottom:38px}.story-timeline article:before{content:"";position:absolute;left:-33px;top:8px;width:9px;height:9px;border-radius:50%;background:var(--red);outline:5px solid var(--blush)}.story-timeline article>span{font:10px var(--sans);letter-spacing:.2em;color:#a45243}.story-timeline h3{font-weight:500;font-size:19px;margin:5px 0 6px}.story-timeline p{font-size:13.5px;line-height:1.55}.story-peony{width:115px;bottom:0;right:-18px;opacity:.9}.gallery{text-align:center}.gallery-layout{position:relative}.photo-button{display:block;position:relative;margin:auto;background:transparent;width:290px;height:435px;padding:0;transition:scale .5s}.photo-button:hover{scale:1.025}.gallery-photo{position:absolute;left:16%;top:17%;width:68%;height:65%;object-fit:cover;border-radius:50%;filter:sepia(.15)}.gallery-frame{position:absolute;width:100%;height:100%;inset:0}.gallery-first{rotate:0deg;margin:0 auto}.gallery-second{rotate:0deg;margin:30px auto 0;width:280px;height:498px;position:relative}
.gallery-second .gallery-photo{position:absolute;left:19%;top:16.7%;width:62%;height:67%;object-fit:cover;border-radius:14px;filter:sepia(.06);z-index:1}
.gallery-second .gallery-frame{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}.gallery-caption{font-family:var(--script);font-size:21px;color:#94745C;margin:10px auto 0;text-align:center}.dress{text-align:center}.narrow-copy{max-width:310px;margin:auto;font-size:14px}.swatches{display:flex;justify-content:center;gap:15px;margin:30px -15px 10px}.swatches>div{display:flex;align-items:center;flex-direction:column;gap:9px}.swatches i{display:block;width:42px;height:42px;border-radius:50%;background:var(--swatch);border:4px solid #fff6;outline:1px solid #a3af9950}.swatches span{font-size:12px}.dress-fan{width:230px;margin:22px auto -42px;rotate:-8deg}.elegant-form{position:relative;z-index:2;max-width:355px;margin:auto;text-align:left}.elegant-form>label,.elegant-form legend{font:9px var(--sans);letter-spacing:.13em;display:block;margin:22px 0 9px}.elegant-form input:not([type=radio]),.elegant-form textarea,.elegant-form select{display:block;width:100%;border:1px solid #87998080;border-radius:0;background:#fffcf47a;color:#292521;padding:10px 12px;font-size:14px;min-height:42px}.elegant-form input::placeholder,.elegant-form textarea::placeholder{color:#667c70a0}.elegant-form textarea{resize:vertical}.elegant-form .button{width:100%;margin-top:25px}.elegant-form fieldset{border:0;padding:0;margin:25px 0}.elegant-form legend{margin:0 0 10px}.radio-label{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:14px}.radio-label input{accent-color:var(--jade);width:17px;height:17px}.form-status{font-size:13px;line-height:1.4;margin-top:12px;min-height:20px}.form-status.error{color:#ad3c30}.gift{text-align:center}.bank-card{position:relative;padding:30px 18px;background:#e8dfd0;border:1px solid #baa785;margin-top:28px}.bank-card h3{font-size:20px;font-weight:400;letter-spacing:.08em;margin:8px 0}.bank-card p:not(.eyebrow){font-size:14px}.bank-card button{margin-top:12px}.small-note{font-size:12px;opacity:.7;margin-top:14px}.rsvp{padding-top:90px}.rsvp-seal{width:65px;position:absolute;top:20px;left:calc(50% - 32.5px)}.guestbook-list{max-width:355px;margin:35px auto 0}.wish{border-top:1px solid #c2b29180;padding:22px 0;text-align:left}.wish p{font-size:14.5px;font-style:italic;overflow-wrap:anywhere}.wish footer{font:9px var(--sans);letter-spacing:.08em;display:flex;justify-content:space-between;gap:15px;margin-top:13px}.wish time{opacity:.5;white-space:nowrap}.empty-wishes{font-size:13.5px;text-align:center;font-style:italic;opacity:.65}.closing{position:relative;padding:85px 25px 70px;text-align:center;background:#EDE4D6;color:#292521;overflow:hidden}.closing-medallion{position:relative;width:100%;max-width:420px;aspect-ratio:2/3;margin:auto}.closing-fill{position:absolute;background:var(--paper);inset:12% 12%;border-radius:50%}.closing-lace{position:absolute;inset:0;width:100%;height:100%}.closing-copy{position:absolute;inset:23% 17% 15%;color:var(--ink);z-index:2;text-align:center}.closing-copy>.eyebrow{font-size:7px}.closing-copy h2{font-size:32px;margin:10px 0 12px}.closing-copy>p:not(.eyebrow):not(.script){font-size:12.5px;line-height:1.5;margin:10px -8px}.closing-names{font-size:34px;line-height:.9;margin-top:12px}.closing-names span{font-size:28px}.closing-copy .fine-rule{margin:18px auto}.closing-flower{position:absolute;width:32%;right:-6%;bottom:1%;z-index:3;rotate:8deg}.closing-date{font-size:13.5px;letter-spacing:.22em;margin-top:18px}.closing>.eyebrow{margin-top:15px;font-size:8px}.replay{color:var(--paper);margin-top:24px;font-size:8px;opacity:.8}.page-tail{height:70px;background:#183b49}.bottom-nav{position:fixed;bottom:15px;right:30px;width:500px;max-width:calc(100% - 30px);height:57px;z-index:30;background:#f8f2e8f5;backdrop-filter:blur(16px);border:1px solid #bbab8a87;box-shadow:0 6px 30px #0a30264a;border-radius:5px;display:flex;align-items:center;justify-content:space-around;transition:opacity .6s}.bottom-nav a{display:flex;flex-direction:column;align-items:center;gap:2px;text-decoration:none;color:#4e6b5c;min-width:56px;padding:5px 0}.bottom-nav a>span{font-size:22px;line-height:1}.bottom-nav small{font:7px var(--sans);letter-spacing:.03em}.bottom-nav a.active{color:var(--red)}.music-toggle{position:fixed;bottom:25px;right:25px;z-index:95;width:44px;height:44px;border-radius:50%;background:#94745C;color:#F3EDE2;border:1px solid rgba(232,217,197,0.7);box-shadow:0 4px 14px rgba(41,37,33,0.25);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:18px;transition:transform .3s,background .3s}.music-toggle[aria-pressed=true]{animation:music-spin 10s linear infinite}@keyframes music-spin{to{rotate:360deg}}body.unopened .bottom-nav,body.unopened .music-toggle{opacity:0;pointer-events:none}.photo-dialog{border:0;background:#12392ef0;padding:40px 20px 20px;max-width:min(90vw,650px);max-height:92dvh;color:var(--paper);box-shadow:0 15px 70px #0007}.photo-dialog::backdrop{background:#091913e6;backdrop-filter:blur(8px)}.photo-dialog img{max-height:75dvh;max-width:100%;object-fit:contain;margin:auto}.photo-dialog button{position:absolute;right:4px;top:-2px;font-size:35px;background:transparent;color:var(--paper);width:42px;height:42px}.photo-dialog p{text-align:center;font-style:italic;font-size:14px;margin-top:8px}.toast{position:fixed;bottom:90px;left:50%;transform:translate(-50%,15px);padding:11px 18px;background:var(--paper);border:1px solid var(--gold);box-shadow:0 8px 30px #0003;z-index:100;font-size:13px;opacity:0;pointer-events:none;transition:.3s;max-width:90vw;text-align:center}.toast.visible{opacity:1;transform:translate(-50%,0)}
@media(min-width:1500px){.desktop-art{width:calc(100% - 620px)}main{width:620px}.bottom-nav{right:60px}.hero-medallion{max-width:390px}.hero{position:relative;width:min(100%, calc(100dvh * 941 / 1671));max-width:560px;aspect-ratio:941/1671;margin:0 auto;background:#F3EDE2 url('assets/pearl-hero-bg.webp') center center/100% 100% no-repeat;box-sizing:border-box;display:flex;flex-direction:column;justify-content:space-between;padding:5.5% 6% 5.5%;color:#292521;overflow:hidden;text-align:center}.keepsake-collage{max-width:470px;height:520px}.keepsake-name-card{top:72px}.keepsake-date{top:124px}.gallery-first{rotate:0deg;margin:0 auto}.gallery-second{rotate:0deg;margin:25px auto 0;width:260px;height:390px}}
@media(max-width:1000px){.desktop-art{width:calc(100% - 500px)}main{width:500px}.desktop-text>.script{font-size:90px}.desktop-text .eyebrow{font-size:7px}.desktop-lantern{width:40%;top:-20px}.desktop-lantern.second{top:-60px}.desktop-bouquet{width:62%;bottom:0;right:-17%}.desktop-fan{width:70%;bottom:7%}.desktop-bottom span:last-child{display:none}.bottom-nav{width:460px;right:20px}.opening-content{width:480px}.cover-lantern{width:160px}.lantern-left{left:-30px}.lantern-right{right:-30px}.keepsake-collage{height:490px}.keepsake-name-card{top:68px}.keepsake-date{top:120px}}
@media(max-width:760px){.desktop-art{display:none}main{width:100%;margin:0;box-shadow:none}.opening-content{max-width:470px;padding:28px 20px 18px}.letter-insert .letter-title{font-size:46px}.opening-content>.eyebrow{font-size:8px}.cover-lantern{width:100px;top:-60px}.lantern-left{left:-30px}.lantern-right{right:-32px;top:-36px}.envelope-scene{height:280px;margin-top:22px}.opening-content .guest-name{font-size:16.5px}.opening-content .guest-address{margin-top:-8px}.hero{position:relative;width:min(100%, calc(100dvh * 941 / 1671));max-width:560px;aspect-ratio:941/1671;margin:0 auto;background:#F3EDE2 url('assets/pearl-hero-bg.webp') center center/100% 100% no-repeat;box-sizing:border-box;display:flex;flex-direction:column;justify-content:space-between;padding:5.5% 6% 5.5%;color:#292521;overflow:hidden;text-align:center}.hero-top{margin-bottom:43px}.hero-medallion{max-width:335px}.hero-medallion-text h2{font-size:52px}.hero-peony{bottom:105px;width:145px;left:-28px}.hero-fan{bottom:148px;right:-63px;width:195px}.hero-knot{width:83px;top:60px;right:-9px}.section-paper,.section-mint,.section-blush{padding:70px 32px}.section-heading h2{font-size:36px}.keepsake{padding:65px 20px 55px}.keepsake-collage{height:480px;max-width:420px}.keepsake-name-card{top:64px}.keepsake-date{top:118px}.keepsake .section-heading>p:last-child{font-size:13.5px}.keepsake .section-heading h2{font-size:37px}.bottom-nav{left:15px;right:15px;width:auto;bottom:12px}.music-toggle{bottom:80px;right:14px}.toast{bottom:82px}.rsvp{padding-top:100px}.couple-portrait{width:270px;height:405px}.quote blockquote{font-size:21px}.gallery-first{rotate:0deg;margin:0 auto}.gallery-second{rotate:0deg;margin:25px auto 0;width:260px;height:390px}.closing-medallion{max-width:400px}.closing-copy h2{font-size:32px}.closing-names{font-size:35px}.hero-bottom{font-size:13.5px}}
@media(max-width:390px){.letter-insert .letter-title{font-size:38px}.envelope-scene{height:260px;margin-top:16px}.envelope-seal{top:63%}.opening-content{padding-inline:14px}.guest-address{margin-top:-7px!important}.skip-opening{margin-top:14px}.section-paper,.section-mint,.section-blush{padding-inline:26px}.hero{position:relative;width:min(100%, calc(100dvh * 941 / 1671));max-width:560px;aspect-ratio:941/1671;margin:0 auto;background:#F3EDE2 url('assets/pearl-hero-bg.webp') center center/100% 100% no-repeat;box-sizing:border-box;display:flex;flex-direction:column;justify-content:space-between;padding:5.5% 6% 5.5%;color:#292521;overflow:hidden;text-align:center}.hero-medallion{width:88%}.hero-medallion-text h2{font-size:46px}.hero-medallion-text .eyebrow{font-size:6px}.hero-knot{width:73px;right:-7px}.hero-top{margin-bottom:38px}.hero-peony{width:130px;bottom:112px}.hero-fan{width:170px;bottom:148px}.section-heading h2{font-size:32px}.keepsake-collage{height:440px}.keepsake-name-card{top:58px;width:49%}.name-card-copy{font-size:30px}.tray-composition{top:28px}.keepsake-date{top:114px}.keepsake-date>.script{font-size:26px}.keepsake-date>.script span{font-size:26px;margin:8px 0}.keepsake-fan{bottom:18px}.polaroid-one{bottom:10px;left:34%;width:34%}.polaroid-two{display:none}.countdown{padding-inline:20px}.countdown-grid{gap:5px}.countdown-grid strong{font-size:32px}.countdown-grid>div{min-width:53px}.countdown .section-heading h2{font-size:30px}.swatches{gap:12px}.swatches i{width:37px;height:37px}.swatches span{font-size:11px}.photo-button{width:265px;height:397px}.gallery-second{rotate:0deg;margin:25px auto 0;width:260px;height:390px}.closing-copy{inset:21% 16% 12%}.closing-copy h2{font-size:29px}.closing-copy>p:not(.eyebrow):not(.script){font-size:11.5px}.closing-copy>.eyebrow{font-size:6px}.closing-names{font-size:30px}.closing-names span{font-size:24px}.closing-copy .fine-rule{margin:12px auto}.closing-copy h2{margin-bottom:12px}}
@media(max-height:750px) and (min-width:761px){.letter-insert .letter-title{font-size:42px}.opening-content{width:430px}.envelope-scene{height:250px;margin-top:15px}.opening-content{padding-top:15px}.guest-address{margin-top:-15px}.desktop-text{padding-top:15vh}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}.curtain{transition:none}.opening.is-opening .letter-insert{display:none!important}.opening.is-opening .envelope-flap{transform:rotateX(180deg) translateZ(-10px);z-index:1;transition:transform .75s cubic-bezier(.4,0,.2,1) .12s}}


.demo-note{text-align:center;max-width:355px;margin:-15px auto 25px;font-size:14px;line-height:1.5}.elegant-form select:disabled{opacity:.45}
/* Pearl pins sit on the satin; each cord and pendant share the same pivot. */
.hanging-fixture{position:absolute;z-index:6;top:28px;pointer-events:none;--cord-length:25px}
.pearl-pin{position:absolute;width:12px;height:12px;border-radius:50%;background:radial-gradient(circle at 35% 35%, #ffffff 0%, #E8D9C5 50%, #94745C 100%);box-shadow:0 2px 6px rgba(41,37,33,0.25);left:50%;top:0;transform:translate(-50%,-50%);z-index:3}
.pearl-pin:after{content:"";position:absolute;width:17px;height:1px;background:linear-gradient(90deg,transparent,#ded6c483,transparent);left:-4px;top:12px;rotate:-25deg}
.hanging-item.sway{position:relative;width:100%;transform-origin:50% 0;filter:drop-shadow(2px 5px 4px #15374225)}
.hanging-cord{display:block;width:1.5px;height:var(--cord-length);margin:0 auto;background:linear-gradient(90deg,#D9C9B5,#f6ead4,#D9C9B5);box-shadow:1px 0 1px #173d3222}
.pendant-asset{position:relative;display:block;width:100%;height:auto;margin-top:-5px}
.cover-hanging{width:clamp(110px,14vw,180px)}.cover-hanging.fixture-left{left:max(18px,calc(50% - 560px))}.cover-hanging.fixture-right{right:max(18px,calc(50% - 560px));--cord-length:35px;top:39px}.fixture-right .hanging-item{animation-delay:-3s}
.desktop-hanging{width:clamp(100px,21%,155px)}.desktop-hanging.fixture-left{left:2%}.desktop-hanging.fixture-right{right:2%;--cord-length:35px;top:38px}
.hero{background:#F3EDE2 url('assets/pearl-hero-bg.webp') center top / cover no-repeat;color:#292521}.hero:before{display:none}.hero-top{color:#94745C;padding-right:56px}.hero>.eyebrow{color:#94745C}.hero-hanging{display:none}.hero-medallion{filter:drop-shadow(0 8px 16px rgba(41,37,33,0.12))}
.countdown-hanging{position:relative;top:0;width:115px;margin:-48px auto 18px;--cord-length:22px}
.menu-toggle{position:fixed;bottom:25px;left:25px;z-index:95;height:44px;padding:0 18px;border-radius:22px;background:#FDFBF7;color:#94745C;border:1px solid #94745C;box-shadow:0 4px 14px rgba(41,37,33,0.15);cursor:pointer;display:flex;align-items:center;gap:8px;font:11px var(--sans);letter-spacing:.15em;text-transform:uppercase;transition:transform .3s,background .3s}
.menu-toggle[hidden],.section-menu[hidden]{display:none}.menu-lines{width:15px;display:flex;flex-direction:column;gap:4px}.menu-lines i{height:1px;background:currentColor;width:100%;display:block;transition:transform .2s,opacity .2s}.menu-toggle[aria-expanded=true] .menu-lines i:first-child{transform:translateY(5px) rotate(45deg)}.menu-toggle[aria-expanded=true] .menu-lines i:nth-child(2){opacity:0}.menu-toggle[aria-expanded=true] .menu-lines i:last-child{transform:translateY(-5px) rotate(-45deg)}
.section-menu{position:fixed;inset:0;z-index:98;background:rgba(243,237,226,0.97);backdrop-filter:blur(10px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:30px;transition:opacity .4s ease,visibility .4s ease}.section-menu>.eyebrow{font-size:8px;letter-spacing:.18em;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid #d3c5ad}.section-menu a{font-family:var(--serif);font-size:18px;color:#292521;text-decoration:none;letter-spacing:.06em;padding:6px 14px;transition:color .3s,letter-spacing .3s}.section-menu a:last-child{border:0}.section-menu a:hover,.section-menu a.active{color:var(--red)}
.music-toggle{bottom:25px;right:130px;width:33px;height:33px}.toast{bottom:80px}.page-tail{height:25px}body.unopened .menu-toggle,body.unopened .section-menu{visibility:hidden;pointer-events:none}
@media(max-width:1000px){.cover-hanging{width:125px}.cover-hanging.fixture-left{left:8px}.cover-hanging.fixture-right{right:8px}.desktop-hanging{width:90px}.desktop-hanging.fixture-left{left:0}.desktop-hanging.fixture-right{right:0}}
@media(max-width:760px){.cover-hanging{width:80px;--cord-length:18px}.cover-hanging.fixture-left{left:-5px}.cover-hanging.fixture-right{right:-5px;--cord-length:25px;top:28px}.hero-hanging{width:75px;right:5px;top:23px}.hero-top{padding-right:50px}.hanging-fixture{top:21px}.countdown-hanging{top:0}.pearl-pin{position:absolute;width:12px;height:12px;border-radius:50%;background:radial-gradient(circle at 35% 35%, #ffffff 0%, #E8D9C5 50%, #94745C 100%);box-shadow:0 2px 6px rgba(41,37,33,0.25);left:50%;top:0;transform:translate(-50%,-50%);z-index:3}.menu-toggle{bottom:17px;right:15px}.section-menu{right:15px;bottom:71px}.music-toggle{bottom:22px;right:123px}}
@media(max-width:390px){.cover-hanging{width:68px}.hero-hanging{width:68px}.hero-top{padding-right:47px}}
/* Music remains separate from the compact navigation control. */
.music-toggle{left:22px;right:auto;bottom:25px}
@media(max-width:760px){.music-toggle{left:17px;right:auto;bottom:22px}}
/* The hero is framed by two bouquets; the smaller accents finish the invitation. */
.hero-bouquet-top{width:164px;top:36px;left:-43px;z-index:3;rotate:-19deg;filter:drop-shadow(0 4px 5px #94745C22)}
.hero-bouquet-bottom{width:167px;right:-38px;bottom:45px;z-index:3;rotate:13deg;animation-delay:-4s;filter:drop-shadow(0 4px 5px #94745C22)}
.closing-peony{position:absolute;width:35%;left:-7%;top:0;z-index:3;rotate:-14deg}
.closing-fan{position:absolute;width:47%;right:-8%;bottom:1%;z-index:3;rotate:-25deg;filter:drop-shadow(0 6px 8px #94745C33)}
@media(max-width:760px){.hero-bouquet-top{width:145px;top:34px;left:-38px}.hero-bouquet-bottom{width:143px;right:-40px;bottom:44px}.hero-bottom{max-width:300px}.closing-peony{width:32%;left:-6%;top:0}.closing-fan{width:43%;right:-6%;bottom:2%}}
@media(max-width:390px){.hero-bouquet-top{width:120px;left:-33px;top:43px}.hero-bouquet-bottom{width:125px;right:-39px;bottom:28px}.hero-bottom{max-width:260px}.hero-bottom>p{font-size:13.5px}.closing-fan{right:-7%;bottom:1%}}

/* User-supplied typefaces, paired with ornaments attached to the stationery. */
.script{font-weight:700}
.hero-medallion .hero-bouquet-top{width:38%;max-width:145px;left:-15%;top:4%;bottom:auto;right:auto;rotate:-17deg;z-index:3}
.hero-medallion .hero-bouquet-bottom{width:38%;max-width:145px;right:-14%;bottom:0;left:auto;top:auto;rotate:13deg;z-index:3}
.hero-medallion-text{z-index:2}
.hero-bottom{margin-top:20px}
.events-peony{position:absolute;width:108px;left:3px;top:180px;z-index:3;rotate:-17deg;pointer-events:none}
.events-tulip{right:9px;bottom:24px;width:110px;rotate:8deg}
@media(max-width:390px){.hero-medallion .hero-bouquet-top{width:35%;left:-13%;top:6%}.hero-medallion .hero-bouquet-bottom{width:35%;right:-12%;bottom:2%}.events-peony{width:88px;left:0;top:173px}.events-tulip{width:90px;right:7px;bottom:25px}}

.keepsake-date-copy{position:absolute;inset:18% 10% 20%;z-index:4;text-align:center;color:#55445f;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;line-height:1}
.keepsake-date-copy .date-num{font-size:21px;line-height:0.95;display:block}
.keepsake-date-copy .date-month{font-size:21px;line-height:0.95;display:block;margin:1px 0;color:#45344f}
.keepsake-date-copy .date-year{font-size:21px;line-height:0.95;display:block}

.couple .section-heading{padding-inline:36px;}

/* Interactive Ornament Scroll Entrance Animations */
.hero-bouquet-top{opacity:0;transform:scale(0.4) rotate(-28deg);transition:opacity 1s cubic-bezier(.22,1,.36,1) .15s,transform 1.2s cubic-bezier(.22,1,.36,1) .15s;will-change:transform,opacity}
.hero-bouquet-top.visible{opacity:1;transform:scale(1) rotate(-17deg);animation:flower-swing 9s ease-in-out infinite alternate 1.35s}

.hero-bouquet-bottom{opacity:0;transform:scale(0.4) rotate(28deg);transition:opacity 1s cubic-bezier(.22,1,.36,1) .3s,transform 1.2s cubic-bezier(.22,1,.36,1) .3s;will-change:transform,opacity}
.hero-bouquet-bottom.visible{opacity:1;transform:scale(1) rotate(13deg);animation:flower-swing 9s ease-in-out infinite alternate 1.5s}

.couple-knot-ornament{position:absolute;right:18px;left:auto;top:16px;width:52px;height:auto;aspect-ratio:2/3;z-index:4;filter:drop-shadow(0 4px 8px rgba(41,37,33,.15));transform-origin:50% 0;pointer-events:none;opacity:0;transform:translateY(-42px) scale(0.85);transition:opacity 1s cubic-bezier(.22,1,.36,1),transform 1.2s cubic-bezier(.22,1,.36,1);will-change:transform,opacity}
.couple-knot-ornament.visible{opacity:1;transform:translateY(0) scale(1);animation:sway 6s ease-in-out infinite 1.2s}

.portrait-flower{position:absolute;z-index:3;width:115px;right:-33px;bottom:-12px;opacity:0;transform:translate(25px,20px) scale(0.5) rotate(22deg);transition:opacity 1.1s cubic-bezier(.22,1,.36,1) .25s,transform 1.2s cubic-bezier(.22,1,.36,1) .25s;will-change:transform,opacity}
.portrait-flower.visible{opacity:1;transform:translate(0,0) scale(1) rotate(0deg);animation:flower-swing 9s ease-in-out infinite alternate 1.45s}

.events-peony{position:absolute;width:108px;left:3px;top:180px;z-index:3;pointer-events:none;opacity:0;transform:translateX(-42px) scale(0.5) rotate(-35deg);transition:opacity 1.1s cubic-bezier(.22,1,.36,1) .1s,transform 1.2s cubic-bezier(.22,1,.36,1) .1s;will-change:transform,opacity}
.events-peony.visible{opacity:1;transform:translateX(0) scale(1) rotate(-17deg);animation:flower-swing 9s ease-in-out infinite alternate 1.3s}

.events-tulip{right:9px;bottom:24px;width:110px;opacity:0;transform:translateX(42px) scale(0.5) rotate(35deg);transition:opacity 1.1s cubic-bezier(.22,1,.36,1) .3s,transform 1.2s cubic-bezier(.22,1,.36,1) .3s;will-change:transform,opacity}
.events-tulip.visible{opacity:1;transform:translateX(0) scale(1) rotate(8deg);animation:flower-swing 8s ease-in-out infinite alternate 1.5s}

.story-peony{width:115px;bottom:0;right:-18px;opacity:0;transform:translate(25px,20px) scale(0.5) rotate(-25deg);transition:opacity 1.1s cubic-bezier(.22,1,.36,1) .2s,transform 1.2s cubic-bezier(.22,1,.36,1) .2s;will-change:transform,opacity}
.story-peony.visible{opacity:1;transform:translate(0,0) scale(1) rotate(0deg);animation:flower-swing 9s ease-in-out infinite alternate 1.4s}

.closing-fan{position:absolute;width:47%;right:-8%;bottom:1%;z-index:3;filter:drop-shadow(0 6px 8px #94745C33);opacity:0;transform:translate(35px,30px) rotate(15deg) scale(0.7);transition:opacity 1.2s cubic-bezier(.22,1,.36,1) .25s,transform 1.2s cubic-bezier(.22,1,.36,1) .25s;will-change:transform,opacity}
.closing-fan.visible{opacity:1;transform:translate(0,0) rotate(-25deg) scale(1)}


/* Luxurious Wedding Stationary Fallback Screen (riungin.id) */
.fallback-screen{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;padding:24px 20px;overflow-y:auto;overflow-x:hidden;background:#0d2430}
.fallback-screen[hidden]{display:none!important}
.fallback-backdrop{position:absolute;inset:0;background:linear-gradient(180deg,rgba(16,40,56,.45) 0%,rgba(13,31,46,.72) 100%),url('assets/pearl-cover-satin.webp') center/cover no-repeat;pointer-events:none}
.fallback-container{position:relative;z-index:3;width:100%;max-width:345px;margin:auto;display:flex;flex-direction:column;align-items:center}
.fallback-ornaments{position:absolute;inset:0;pointer-events:none}
.fallback-fan{position:absolute;top:-42px;right:-18px;width:130px;transform:rotate(16deg);filter:drop-shadow(0 8px 14px rgba(0,0,0,.42));z-index:1}
.fallback-tulip{position:absolute;bottom:26px;left:-24px;width:56px;transform:rotate(-14deg);filter:drop-shadow(0 6px 12px rgba(0,0,0,.35));z-index:4}
.fallback-card{position:relative;z-index:2;width:100%;background:#faf5eb;border:1.5px solid #D9C9B5;box-shadow:0 0 0 6px rgba(248,242,230,.4),0 25px 50px rgba(4,18,26,.65);border-radius:4px;padding:34px 24px 22px;text-align:center;background-image:radial-gradient(circle at 50% 0%,rgba(255,255,255,.7) 0%,rgba(250,245,235,.95) 75%)}
.fallback-card::before{content:'';position:absolute;inset:8px;border:1px dashed rgba(196,176,139,.7);pointer-events:none;border-radius:2px}
.fallback-seal-wrap{width:60px;height:60px;margin:0 auto 12px;position:relative}
.fallback-seal{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 6px 10px rgba(16,43,48,.45))}
.fallback-eyebrow{font:700 9px var(--sans,sans-serif);letter-spacing:.22em;text-transform:uppercase;color:#7f6e59;margin-bottom:4px}
.fallback-title{font-size:38px;color:#94745C;line-height:1.1;margin:0 0 8px;font-weight:normal;font-family:'Tangerine',cursive}
.fallback-rule{width:48px;height:1px;background:#D9C9B5;margin:0 auto 14px}
.fallback-message{font-family:var(--serif,'Viaoda Libre',serif);font-size:14.5px;line-height:1.55;color:#6e523e;margin:0 0 10px;font-weight:500}
.fallback-sub{font-size:12.5px;line-height:1.5;color:#635345;font-style:italic;margin:0 0 16px}
.fallback-badge-pill{display:inline-flex;align-items:center;gap:7px;background:rgba(21,69,53,.07);border:1px solid rgba(196,176,139,.65);padding:5px 14px;border-radius:20px;font:10.5px var(--sans,sans-serif);color:#94745C;letter-spacing:.05em;margin-bottom:16px}
.fallback-pill-dot{width:6px;height:6px;border-radius:50%;background:#c0392b;display:inline-block}
.fallback-pill-dot.warning{background:#d48806}
.fallback-footer{border-top:1px solid #ebdcc5;padding-top:14px;margin-top:4px;display:flex;flex-direction:column;gap:6px;align-items:center}
.fallback-couple{font-family:'Tangerine',cursive;font-size:26px;color:#6e523e;line-height:1;margin:0}
.fallback-credit{font:9px var(--sans,sans-serif);letter-spacing:.2em;text-transform:uppercase;color:#7a6b57;text-decoration:none;transition:color .2s}
.fallback-credit:hover{color:#94745C;text-decoration:underline}


/* Hero refined with 3D embossed frame background */
.hero{background:#F3EDE2 url('assets/pearl-hero-bg.webp') center top / cover no-repeat;color:#292521;display:flex;flex-direction:column;justify-content:space-between;min-height:100svh;min-height:100dvh;box-sizing:border-box;padding:24px 20px 32px}
.hero:before{display:none}
.hero-top{color:#94745C;padding-right:0;margin-bottom:12px;display:flex;justify-content:space-between}
.hero>.eyebrow{color:#94745C;margin-bottom:0}
.hero-medallion{filter:none!important;width:86%;max-width:340px;aspect-ratio:2/2.7;margin:auto auto;display:flex;align-items:center;justify-content:center}
.hero-medallion .date-card{display:none}
.hero-medallion-text{position:relative;inset:auto;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#94745C;text-align:center}
.hero-medallion-text .eyebrow{font-size:7.5px;letter-spacing:.22em;color:#94745C}
.hero-medallion-text h2{font-size:clamp(46px, 12vw, 62px);line-height:.88;margin:12px 0 8px;color:#292521}
.hero-medallion-text h2 em{font-size:.45em;font-style:normal;display:inline-block;margin:4px 0;color:#94745C}
.hero-medallion-text p{font:8px var(--sans);letter-spacing:.18em;color:#94745C;font-weight:500;margin:0}
.hero-medallion-text .fine-rule{background:rgba(148,116,92,0.3);margin:16px auto 14px;width:55px;height:1px}
.hero-medallion .hero-bouquet-bottom{display:none}
.hero-medallion .hero-butterfly{position:absolute;top:-18px;right:-8px;width:48px;height:auto;opacity:.88;filter:drop-shadow(0 4px 6px rgba(41,37,33,0.15))}
.hero-bottom{position:relative;z-index:4;margin:0 auto;max-width:310px;text-align:center}
.hero-bottom p{font-size:13.5px;line-height:1.55;color:#5c4636;margin:0 0 16px}
.scroll-cue{color:#94745C;margin-top:0;font-size:8px;letter-spacing:.22em}

/* ========================================================
   RESPONSIVE HERO - EXACT NATURAL ASPECT RATIO (941 / 1671)
   Preserves original artwork ratio without cropping.
   Responsive across mobile, tablet, and desktop.
   ======================================================== */
.hero {
  position: relative !important;
  width: min(100%, calc(100dvh * 941 / 1671)) !important;
  max-width: 560px !important;
  aspect-ratio: 941 / 1671 !important;
  min-height: unset !important;
  max-height: 100dvh !important;
  height: auto !important;
  background: #F3EDE2 url('assets/pearl-hero-bg.webp') center center / 100% 100% no-repeat !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  padding: 5.5% 6% 5.5% !important;
  color: #292521 !important;
  overflow: hidden !important;
  margin: 0 auto !important;
  text-align: center !important;
}

.hero:before {
  display: none !important;
}

.hero-top {
  color: #94745C !important;
  padding: 0 5% !important;
  margin: 0 0 1% !important;
  display: flex !important;
  justify-content: space-between !important;
  font-size: clamp(7.5px, 2vw, 9.5px) !important;
  letter-spacing: .2em !important;
  position: relative !important;
  z-index: 2 !important;
}

.hero > .eyebrow {
  color: #94745C !important;
  margin: 0 auto !important;
  font-size: clamp(6.5px, 1.8vw, 8.5px) !important;
  letter-spacing: .24em !important;
  text-align: center !important;
  position: relative !important;
  z-index: 2 !important;
}

.hero-medallion {
  filter: none !important;
  width: 82% !important;
  max-width: 360px !important;
  aspect-ratio: 2 / 2.7 !important;
  margin: auto auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  z-index: 2 !important;
}

.hero-medallion .date-card,
.hero-medallion .hero-bouquet-bottom,
.hero-medallion .hero-butterfly {
  display: none !important;
}

.hero-medallion-text {
  position: relative !important;
  inset: auto !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  color: #94745C !important;
  text-align: center !important;
  width: 100% !important;
}

.hero-medallion-text .eyebrow {
  font-size: clamp(6.5px, 1.8vw, 8.5px) !important;
  letter-spacing: .24em !important;
  color: #94745C !important;
  margin: 0 0 6px !important;
}

.hero-medallion-text h2 {
  font-size: clamp(48px, 13vw, 72px) !important;
  line-height: .86 !important;
  margin: 10px 0 8px !important;
  color: #292521 !important;
  font-family: var(--script), 'Tangerine', cursive !important;
  font-weight: normal !important;
}

.hero-medallion-text h2 em {
  font-size: .45em !important;
  font-style: normal !important;
  display: inline-block !important;
  margin: 3px 0 !important;
  color: #94745C !important;
  font-family: var(--serif) !important;
}

.hero-medallion-text p {
  font: 500 clamp(7.5px, 2vw, 9.5px) var(--sans) !important;
  letter-spacing: .2em !important;
  color: #94745C !important;
  margin: 0 !important;
}

.hero-medallion-text .fine-rule {
  background: rgba(148,116,92,0.3) !important;
  margin: 14px auto 12px !important;
  width: 50px !important;
  height: 1px !important;
}

.hero-bottom {
  position: relative !important;
  z-index: 2 !important;
  margin: 0 auto 0.5% !important;
  max-width: 80% !important;
  text-align: center !important;
}

.hero-bottom p {
  font-size: clamp(11.5px, 3.1vw, 14px) !important;
  line-height: 1.55 !important;
  color: #5c4636 !important;
  margin: 0 0 8px !important;
}

.scroll-cue {
  color: #94745C !important;
  margin-top: 0 !important;
  font-size: clamp(7px, 2vw, 8.5px) !important;
  letter-spacing: .22em !important;
  gap: 3px !important;
}

.scroll-cue span {
  font-size: clamp(14px, 3.6vw, 19px) !important;
}

