@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;0,700;1,600&family=Italiana&family=Montserrat:wght@400;500;600&display=swap');
/* Bursts are mounted on body, above every panel, so section overflow cannot clip them. */
.celebration-overlay { position:fixed!important; inset:0!important; z-index:1000!important; width:100vw!important; height:100vh!important; opacity:1!important; pointer-events:none!important; overflow:visible!important; }
:root{--ink:#1d130f;--wine:#3a2119;--cream:#fbf4e7;--ivory:#fffaf0;--gold:#bd8e45;--pale:#f0d69a}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;background:var(--ink);color:var(--cream);font-family:Montserrat,Arial,sans-serif}h1,h2,p{margin-top:0}h1,h2{font-family:Italiana,Georgia,serif;font-weight:400}i{color:var(--gold);font-family:"Cormorant Garamond",serif}.eyebrow{color:var(--gold);font-size:.65rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase}.opening{position:relative;min-height:100svh;display:grid;place-content:center;justify-items:center;gap:14px;overflow:hidden;padding:26px;color:#412718;background:radial-gradient(circle at 50% 38%,#fffdf8 0 10%,#f4e4c9 45%,#c39152 100%);text-align:center;transition:opacity .6s,transform .6s}.opening::before,.opening::after{position:absolute;content:"";width:55vmax;height:55vmax;border:1px solid #b9874366;border-radius:50%}.opening::before{top:-34vmax;left:-34vmax}.opening::after{right:-34vmax;bottom:-34vmax}.opening-light{position:absolute;width:360px;height:360px;border-radius:50%;background:#fff9ee99;filter:blur(45px)}.envelope-scene{position:relative;width:min(86vw,440px);height:285px;perspective:1500px}.letter{position:absolute;z-index:1;top:28px;left:9%;width:82%;height:80%;padding:27px;color:#4b3020;background:var(--ivory);box-shadow:0 16px 28px #4e2e1570;text-align:center;transition:transform 1.25s cubic-bezier(.2,.85,.18,1)}.letter p,.letter span{display:block;margin:0;color:var(--gold);font-size:.61rem;letter-spacing:.18em;text-transform:uppercase}.letter strong{display:block;margin:16px 0 11px;font-family:Italiana,serif;font-size:3.5rem;font-weight:400}.envelope{position:absolute;inset:0;transform-style:preserve-3d}.envelope>*{position:absolute;inset:0}.envelope-back{background:#c18c49}.envelope-front{z-index:2;background:linear-gradient(135deg,#edcf91,#bf8843);clip-path:polygon(0 100%,0 0,50% 57%,100% 0,100% 100%)}.envelope-flap{z-index:4;background:linear-gradient(145deg,#c28a45,#ebc981);clip-path:polygon(0 0,100% 0,50% 62%);transform-origin:top;transition:transform 1.2s cubic-bezier(.2,.8,.2,1),z-index 0s .58s}.wax-seal{position:absolute;z-index:7;top:54%;left:50%;display:flex;align-items:center;justify-content:center;gap:2px;width:68px;height:68px;padding:0;color:#f6d999;background:radial-gradient(circle at 32% 28%,#b8663f,#752e1d 65%,#551c16);border:4px double #e9c27c;border-radius:50%;box-shadow:inset 0 0 0 4px #622416,0 7px 9px #4c270c66;cursor:pointer;font-family:Italiana,serif;font-size:1.3rem;transform:translate(-50%,-5%);transition:opacity .25s,transform .25s}.wax-seal:hover{transform:translate(-50%,-9%) scale(1.04)}.wax-seal:focus-visible{outline:3px solid white;outline-offset:5px}.seal-prompt{position:relative;margin:0;color:#75502d;font-family:"Cormorant Garamond",serif;font-size:1.1rem;font-style:italic}.opening.is-opening .envelope-flap{z-index:0;transform:rotateX(180deg)}.opening.is-opening .letter{transform:translateY(-125px) rotateX(5deg)}.opening.is-opening .wax-seal,.opening.is-opening .seal-prompt{opacity:0;pointer-events:none}.opening.is-leaving{opacity:0;transform:scale(1.05)}.experience{overflow:hidden}.panel{position:relative;min-height:100svh;padding:clamp(72px,10vw,120px) max(24px,8vw)}.story-rings{position:fixed;z-index:20;top:0;left:50%;width:130px;height:80px;pointer-events:none;opacity:0;transform:translate(-50%,var(--ring-y, -120px));transition:transform .13s linear,opacity .5s}.active .story-rings{opacity:1}.story-rings span{position:absolute;top:7px;width:67px;height:67px;border:7px solid var(--gold);border-radius:50%;box-shadow:inset 2px 2px 4px #fff0ae99,3px 5px 10px #09050477;transition:transform 1s cubic-bezier(.2,.85,.25,1)}.story-rings span:first-child{left:5px;transform:rotate(-18deg)}.story-rings span:last-child{right:5px;transform:rotate(18deg)}.story-rings.locked{left:50%;transform:translate(-50%,calc(100svh - 125px))}.story-rings.locked span:first-child{transform:translateX(12px) rotate(-18deg)}.story-rings.locked span:last-child{transform:translateX(-12px) rotate(18deg)}.couple{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(38px,8vw,110px);background:radial-gradient(circle at 18% 20%,#5c3828 0,transparent 35%),var(--ink)}.couple-copy{max-width:550px}.couple h1{font-size:clamp(3.7rem,8vw,7rem);line-height:.83}.invite-line{max-width:370px;color:#ddc9ac;font-family:"Cormorant Garamond",serif;font-size:1.45rem;line-height:1.3}.handwritten{color:var(--pale);font-family:"Cormorant Garamond",serif;font-size:1.35rem;font-style:italic}.couple-photo{position:relative;justify-self:center;width:min(100%,385px);aspect-ratio:3/4;margin:0;overflow:hidden;border:9px solid #ead3a6;background:#63432f;box-shadow:20px 23px 0 #70482d,0 28px 45px #0009}.couple-photo img,.final-photo img{width:100%;height:100%;object-fit:cover}.couple-photo img{position:absolute;inset:0}.photo-fallback{position:absolute;inset:0;display:grid;place-content:center;color:#fff3dc;background:linear-gradient(145deg,#3d261e,#aa7c51);font-family:Italiana,serif;font-size:4.5rem}.couple-photo figcaption{position:absolute;right:0;bottom:0;left:0;padding:27px 12px 12px;background:linear-gradient(transparent,#000b);font-family:"Cormorant Garamond",serif;font-size:1.2rem;font-style:italic;text-align:center}.date-details{color:#402a1d;background:var(--cream)}.section-title{max-width:500px;margin:0 auto 38px;text-align:center}.section-title h2,.blessing h2,.finale h2{margin-bottom:15px;font-size:clamp(3rem,7vw,5.5rem);line-height:.9}.section-title>p:last-child{color:#755b47;line-height:1.7}.scratch-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:1000px;margin:auto}.scratch-card{position:relative;min-height:280px;overflow:hidden;color:#fff5dc;background:#3d251b;border:1px solid #c99a51;box-shadow:0 17px 32px #49301b36}.scratch-reveal{position:absolute;inset:0;display:grid;place-content:center;gap:13px;padding:22px;text-align:center}.scratch-reveal small{color:var(--pale);font-size:.64rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase}.scratch-reveal strong{color:#f0cc87;font-family:Italiana,serif;font-size:clamp(1.7rem,3.5vw,2.5rem);font-weight:400}.scratch-reveal p{margin:0;color:#ead9bd;font-family:"Cormorant Garamond",serif;font-size:1.05rem;line-height:1.5}.scratch-card canvas{position:absolute;inset:0;width:100%;height:100%;cursor:crosshair;touch-action:none}.blessing{display:grid;place-content:center;gap:28px;background:linear-gradient(135deg,#201510,#68412b);text-align:center}.blessing-box,.welcome-box{max-width:700px;padding:clamp(30px,6vw,60px);border:1px solid #c7954c66;background:#22140db8;box-shadow:0 20px 50px #05030244}.blessing-box>p:last-child,.welcome-box>p:last-child{margin:0;color:#ead6b7;line-height:1.8}.welcome-box{max-width:520px;margin:auto;background:#59362499}.finale{display:grid;place-content:center;isolation:isolate;overflow:hidden;text-align:center}.final-photo,.final-photo::after{position:absolute;z-index:-1;inset:0}.final-photo img{display:block}.final-photo div,.final-photo::after{position:absolute;inset:0;background:linear-gradient(180deg,#160d0a77,#170e0bd9)}.final-copy{max-width:670px;padding:clamp(35px,7vw,70px);background:#180f0ba8;border:1px solid #e2ba7166;box-shadow:0 20px 60px #0008}.final-copy>p:nth-of-type(2){color:#eedbc0;line-height:1.8}.signature{margin:30px 0 0;color:var(--pale);font-family:Italiana,serif;font-size:2rem}.reveal{opacity:0;transform:translateY(28px);transition:opacity .85s ease,transform .85s ease}.reveal.in-view{opacity:1;transform:none}.scratch-card:nth-child(2){transition-delay:.12s}.scratch-card:nth-child(3){transition-delay:.24s}@media(max-width:720px){.couple{grid-template-columns:1fr;text-align:center}.couple-photo{grid-row:1}.invite-line{margin-right:auto;margin-left:auto}.scratch-grid{grid-template-columns:1fr}.scratch-card{min-height:220px}.story-rings{left:auto;right:18px;transform:translate(0,var(--ring-y,-120px)) scale(.78)}.story-rings.locked{left:50%;right:auto;transform:translate(-50%,calc(100svh - 105px)) scale(.78)}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}

.gold-celebration{position:absolute;z-index:12;top:50%;left:50%;width:1px;height:1px;pointer-events:none;animation:celebration-fade 1.45s ease-out forwards}.gold-celebration i{position:absolute;top:0;left:0;display:block;width:var(--size);height:var(--size);background:#f7d777;border-radius:50%;box-shadow:0 0 7px #ffeab0,0 0 13px #d79b3c;opacity:0;animation:gold-drift 1.35s cubic-bezier(.16,.78,.3,1) var(--delay) forwards}.gold-celebration .sparkle{width:calc(var(--size) * 1.2);height:calc(var(--size) * 1.2);background:#fff7cc;border-radius:2px;transform:rotate(45deg);animation-name:gold-sparkle}.gold-celebration[data-origin="sides"]{z-index:5}.gold-celebration[data-origin="sides"] i:nth-child(3n){top:-14px}@keyframes gold-drift{0%{opacity:0;transform:translate(-50%,-50%) scale(.25)}16%{opacity:.95}70%{opacity:.58}100%{opacity:0;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(.55)}}@keyframes gold-sparkle{0%{opacity:0;transform:translate(-50%,-50%) rotate(45deg) scale(.15)}16%{opacity:1}55%{opacity:.9;transform:translate(calc(-50% + var(--x) * .62),calc(-50% + var(--y) * .62)) rotate(45deg) scale(1.45)}100%{opacity:0;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) rotate(45deg) scale(.35)}}@keyframes celebration-fade{0%,70%{opacity:1}100%{opacity:0}}
.scratch-card:has(.gold-celebration){overflow:visible}
.gold-celebration{animation-duration:1.9s}.gold-celebration::before{position:absolute;top:50%;left:50%;width:120px;height:120px;content:"";background:radial-gradient(circle,#e8b74b55 0,rgba(232,183,75,0) 68%);filter:blur(8px);opacity:.7;transform:translate(-50%,-50%);animation:gold-halo 1.85s ease-out forwards}.gold-celebration i{left:var(--start-x,0);animation-duration:1.7s}.gold-celebration .sparkle{background:linear-gradient(135deg,#fffde0,#e7b755 58%,#fff3a9);clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%);filter:drop-shadow(0 0 4px #fff5be);border-radius:0}@keyframes gold-drift{0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}14%{opacity:1}72%{opacity:.62}100%{opacity:0;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(.5)}}@keyframes gold-sparkle{0%{opacity:0;transform:translate(-50%,-50%) rotate(0) scale(.1)}14%{opacity:1}54%{opacity:1;transform:translate(calc(-50% + var(--x) * .58),calc(-50% + var(--y) * .58)) rotate(135deg) scale(1.65)}100%{opacity:0;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) rotate(250deg) scale(.25)}}@keyframes gold-halo{0%{opacity:0;transform:translate(-50%,-50%) scale(.35)}18%{opacity:.7}100%{opacity:0;transform:translate(-50%,-50%) scale(1.45)}}.gold-celebration[data-origin="sides"]{inset:0;width:auto;height:auto}.gold-celebration[data-origin="sides"]::before{display:none}.gold-celebration[data-origin="sides"] i{top:50%}.gold-celebration[data-origin="sides"] i:nth-child(3n){top:calc(50% - 14px)}.story-rings .gold-celebration{z-index:0}.story-rings .gold-celebration::before{width:150px;height:150px}
/* Once the wax-seal opening has faded out and is hidden, it must fully collapse — otherwise it leaves a dark full-screen gap above the invitation. */
.opening[hidden]{display:none}

/* ============================================================
   WAX SEAL OPENING — luxury restyle (visual only).
   Animation classes (.is-opening / .is-leaving), timings and
   music are untouched; these rules only change colours,
   textures and decorative details of the opening screen.
   ============================================================ */
.opening{gap:18px;color:#5a3a22;background:
  radial-gradient(120% 90% at 12% 8%,rgba(255,246,228,.92),transparent 55%),
  radial-gradient(100% 80% at 88% 94%,rgba(210,158,116,.4),transparent 62%),
  linear-gradient(160deg,#f6e9d8 0%,#efdcc6 46%,#e2c2a2 100%)}
.opening::before,.opening::after{width:72vmax;height:72vmax;border:none;filter:blur(22px);
  background:radial-gradient(circle,rgba(213,168,110,.26) 0,rgba(213,168,110,.1) 44%,transparent 68%)}
.opening::before{top:-42vmax;left:-40vmax}
.opening::after{right:-42vmax;bottom:-40vmax;
  background:radial-gradient(circle,rgba(192,136,84,.28) 0,transparent 62%)}
.opening-light{width:540px;height:540px;filter:blur(32px);
  background:radial-gradient(circle,rgba(255,251,240,.9),rgba(255,244,222,0) 70%)}
.opening .eyebrow{color:#a3763c;font-size:.68rem;letter-spacing:.34em}
.envelope-scene{height:300px;filter:drop-shadow(0 30px 44px rgba(96,56,25,.32))}
.letter{padding:30px 27px 24px;border:1px solid rgba(190,150,95,.45);
  background:linear-gradient(175deg,#fffdf6,#f8eeda);
  box-shadow:0 22px 40px rgba(84,48,20,.28),inset 0 0 42px rgba(255,250,238,.9)}
.letter p{color:#a3763c;letter-spacing:.32em}
.letter strong{margin:14px 0 10px;color:#8a5a2b;letter-spacing:.12em;font-size:3.2rem}
.letter span{color:#b28a52}
/* gold divider with heart beneath the monogram */
.letter::after{content:"";display:block;margin:0 auto;width:130px;height:11px;
  background:
    linear-gradient(#bd9257,#bd9257) left center/48px 1px no-repeat,
    linear-gradient(#bd9257,#bd9257) right center/48px 1px no-repeat,
    radial-gradient(circle,#a3763c 2.4px,transparent 2.9px) center/9px 9px no-repeat;
  opacity:.9}
.envelope-back{background:linear-gradient(160deg,#efe1ca,#d9c19f)}
.envelope-front{background:linear-gradient(135deg,#f8efe0 0%,#efe0c5 55%,#e2cdab 100%)}
.envelope-flap{background:linear-gradient(145deg,#f5e9d4,#e5d1b0)}
/* crossed jute twine over the envelope, under the flap and seal */
.envelope::before,.envelope::after{content:"";position:absolute;z-index:3;left:-2%;right:-2%;top:57%;height:5px;
  border-radius:3px;opacity:.95;box-shadow:0 1px 2px rgba(90,55,25,.35);
  background:repeating-linear-gradient(90deg,#caa271 0 6px,#b18750 6px 12px)}
.envelope::before{transform:rotate(2.2deg)}
.envelope::after{transform:rotate(-2.2deg)}
/* deep burgundy wax seal with gold embossed rings, leaf sprig and hanging beads */
.wax-seal{width:88px;height:88px;color:#f3d9a0;font-size:1.4rem;border:none;
  border-radius:47% 53% 50% 50%/52% 48% 52% 48%;
  background:radial-gradient(circle at 32% 26%,#a2473f 0,#7c2733 45%,#571622 78%,#420f19 100%);
  box-shadow:
    inset 0 0 0 3px rgba(255,220,160,.3),
    inset 0 0 0 7px rgba(70,14,22,.78),
    inset 0 0 0 8px rgba(233,194,124,.5),
    inset 0 -7px 14px rgba(40,6,12,.55),
    inset 0 6px 10px rgba(255,190,170,.2),
    0 10px 18px rgba(74,26,14,.45),
    0 3px 6px rgba(74,26,14,.4);
  text-shadow:0 1px 3px rgba(46,8,14,.7)}
.wax-seal::before{content:"";position:absolute;top:9px;left:50%;width:20px;height:20px;transform:translateX(-50%);
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='%23e8c483'%3E%3Cpath d='M12 21V7' stroke='%23e8c483' stroke-width='1.3' stroke-linecap='round' fill='none'/%3E%3Cpath d='M12 17c-3-1-5-3-5-6 3 0 5 2 5 6z'/%3E%3Cpath d='M12 13c3-1 5-3 5-6-3 0-5 2-5 6z'/%3E%3Cpath d='M12 9c-1.8-.9-2.8-2.4-2.8-4.3 1.9.3 2.8 1.9 2.8 4.3z'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat}
.wax-seal::after{content:"";position:absolute;top:calc(100% - 2px);left:50%;width:9px;height:30px;transform:translateX(-50%);
  background:
    linear-gradient(#d2a55e,#d2a55e) 50% 0/1.5px 22px no-repeat,
    radial-gradient(circle,#e3bf7e 2.6px,transparent 3px) 50% 4px/9px 9px no-repeat,
    radial-gradient(circle,#d8ad68 2.2px,transparent 2.6px) 32% 15px/9px 9px no-repeat,
    radial-gradient(circle,#e8c78c 3px,transparent 3.4px) 50% 26px/9px 9px no-repeat}
.seal-prompt{color:#8a5a2b;letter-spacing:.06em}