/* lux: the special section (Round 15). a sealed blessing, b find the ring, c the guest book.
   Tokens for assets/sp-old/kit.css, then the three stages. */
.spl{--spk-ink:var(--ink,#2e161e);--spk-mute:#6f5a52;--spk-acc:var(--gold,#ab7f39);--spk-on:#2e161e;--spk-line:rgba(140,105,60,.34);
  --spk-disp:var(--serif,'Bellefair',serif);--spk-body:var(--sans,'Assistant',sans-serif);--spk-lat:var(--script,'Great Vibes',cursive);
  --spk-btn:linear-gradient(135deg,#c49b52,#e6cd92 48%,#b88a42);--spk-glow:rgba(171,127,57,.55);--spk-fld:rgba(255,252,246,.75);
  background:radial-gradient(90% 60% at 50% 32%,#fbf6ec,var(--paper,#f6efe3) 60%,var(--paper-2,#eee4d2))}
.spl .spk-tg{font-size:27px;color:var(--gold-foil,#c49b52)}
.spl .spk-orn{display:flex;align-items:center;justify-content:center;gap:10px;color:var(--gold,#ab7f39)}
.spl .spk-orn::before,.spl .spk-orn::after{content:'';width:42px;height:1px;background:linear-gradient(90deg,transparent,currentColor)}
.spl .spk-orn::after{transform:scaleX(-1)}
.spl .spk-orn i{width:6px;height:6px;transform:rotate(45deg);border:1px solid currentColor}
/* b sits on wine, between the gallery and the RSVP: the template's own deckled wine block */
.spl.spl-b{--spk-ink:#f6efe3;--spk-mute:rgba(246,239,227,.76);--spk-line:rgba(220,191,130,.4);--spk-on:#3d0c1a;
  background:radial-gradient(120% 80% at 50% 0,#6a1a2e,var(--wine,#571225) 42%,var(--wine-2,#3d0c1a));
  padding-top:clamp(54px,12vw,70px);padding-bottom:clamp(54px,12vw,70px)}
.spl.spl-b .spk-tg{color:var(--gold-soft,#dcbf82)}
.spl.spl-b::before{display:none}

/* ---------- a: the sealed blessing ---------- */
.spl-env{position:absolute;left:0;right:0;bottom:0;height:208px;z-index:2}
.spl-env img.e{position:absolute;inset:0;width:100%;height:100%;z-index:2}
.spl-letter{position:absolute;left:22px;right:22px;top:0;height:172px;z-index:1;border-radius:3px;padding:16px 16px 0;
  background:linear-gradient(180deg,#fffaf1,#f8efdf);box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 10px 26px -14px rgba(61,12,26,.4)}
.spl-letter::before{content:'';position:absolute;inset:7px;border:1px solid rgba(171,127,57,.45);border-radius:2px;pointer-events:none}
.spl-letter .to{display:block;font:400 22px/1.1 var(--spk-lat);color:var(--gold,#ab7f39);direction:ltr;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.spl-letter .to.he{font:400 17px/1.3 var(--spk-disp);direction:inherit}
.spl-letter p{margin:8px 0 0;font:400 20px/1.42 var(--spk-disp);color:var(--wine,#571225);min-height:2.84em;text-wrap:balance}
.spl-letter .spk-orn{margin-top:6px}
.spl-wax{position:absolute;left:50%;top:60%;width:94px;height:98px;margin:-49px 0 0 -47px;z-index:4;opacity:0}
.spl-ripple{position:absolute;left:50%;top:60%;width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;z-index:3;border:1.5px solid var(--gold-soft,#dcbf82);opacity:0}

/* ---------- b: the ring boxes ---------- */
.spl-floor{position:absolute;left:50%;bottom:4px;width:380px;height:110px;margin-left:-190px;border-radius:50%;opacity:0;
  background:radial-gradient(closest-side,rgba(246,226,190,.22),rgba(246,226,190,.07) 55%,transparent)}
/* r21: the glow sits on the boxes only and fades to nothing on every side (it used to start at a hard edge under the heading) */
.spl-spot{position:absolute;left:50%;top:6px;width:420px;height:260px;margin-left:-210px;pointer-events:none;opacity:0;
  background:radial-gradient(closest-side,rgba(255,236,200,.17),rgba(255,236,200,.06) 58%,rgba(255,236,200,0))}
.spl-bx{position:absolute;left:50%;bottom:26px;width:100px;height:190px;margin-left:-50px;perspective:460px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.spl-bx>*{position:absolute;display:block}
.spl-bx .sh{left:-12px;right:-12px;bottom:-15px;height:28px;border-radius:50%;background:radial-gradient(closest-side,rgba(8,0,3,.62),rgba(8,0,3,.25) 60%,transparent)}
.spl-bx .base{left:2px;bottom:0;width:96px;height:62px}
.spl-bx .open{left:4px;bottom:44px;width:92px;height:24px;opacity:0}
.spl-bx .in{left:0;bottom:56px;width:100px;height:58px;transform-origin:50% 100%;transform:rotateX(-90deg);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.spl-bx .rw{left:10px;right:10px;bottom:54px;height:120px;overflow:hidden;pointer-events:none}
.spl-bx .ring{position:absolute;left:50%;bottom:-70px;width:60px;height:76px;margin-left:-30px;opacity:0}
.spl-bx .lid{left:0;bottom:56px;width:100px;height:40px;transform-origin:50% 0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.spl-bx .glint{left:50%;bottom:122px;width:64px;height:64px;margin-left:-32px;opacity:0;pointer-events:none;z-index:3;
  background:radial-gradient(closest-side,rgba(255,250,232,.95),rgba(255,236,190,.35) 28%,transparent 62%),
    linear-gradient(90deg,transparent 46%,rgba(255,250,230,.9) 50%,transparent 54%),linear-gradient(0deg,transparent 46%,rgba(255,250,230,.9) 50%,transparent 54%);
  -webkit-mask:radial-gradient(closest-side,#000 30%,transparent 100%);mask:radial-gradient(closest-side,#000 30%,transparent 100%)}
.spl-bx img{width:100%;height:100%;-webkit-user-drag:none;user-select:none}
.spl-res b{display:block;font:400 29px/1.15 var(--spk-disp);color:var(--gold-soft,#dcbf82)}
.spl-res span{display:block;margin-top:4px;font:400 16px/1.45 var(--spk-body);color:var(--spk-mute)}
.spl-res small{display:block;margin-top:2px;font:400 13.5px/1.4 var(--spk-body);color:rgba(246,239,227,.6)}

/* ---------- c: the guest book ---------- */
.spl-book{position:absolute;inset:0;perspective:1300px}
.spl-cover{position:absolute;left:-8px;right:-8px;top:2px;bottom:4px;border-radius:10px;
  background:linear-gradient(180deg,#661630,#3d0c1a);box-shadow:0 22px 34px -20px rgba(61,12,26,.7),inset 0 0 0 1px rgba(220,191,130,.25)}
.spl-pg{position:absolute;top:8px;bottom:14px;width:50%;padding:16px 14px 0}
.spl-pg.r{right:0;border-radius:2px 8px 8px 2px;background:linear-gradient(270deg,#fffaf2 0%,#f7eedf 70%,#e4d5bc 100%);box-shadow:4px 6px 0 -2px #e8dcc6,6px 9px 0 -3px #ddcfb6}
.spl-pg.l{left:0;border-radius:8px 2px 2px 8px;background:linear-gradient(90deg,#fffaf2 0%,#f7eedf 70%,#e2d2b7 100%);box-shadow:-4px 6px 0 -2px #e8dcc6,-6px 9px 0 -3px #ddcfb6}
.spl-spine{position:absolute;left:50%;top:6px;bottom:12px;width:2px;margin-left:-1px;background:linear-gradient(transparent,rgba(120,86,40,.35) 10%,rgba(120,86,40,.35) 90%,transparent)}
.spl-flap{position:absolute;left:-8px;top:2px;bottom:4px;width:calc(50% + 8px);border-radius:10px 3px 3px 10px;transform-origin:100% 50%;
  background:linear-gradient(90deg,#4a0f22,#6a1830 85%,#521127);box-shadow:inset 0 0 0 1px rgba(220,191,130,.3);backface-visibility:hidden;-webkit-backface-visibility:hidden;display:grid;place-items:center}
.spl-flap span{font:400 30px/1 var(--spk-lat);color:var(--gold-soft,#dcbf82);direction:ltr}
.spl-pg h4{margin:0;font:400 23px/1 var(--spk-lat);color:var(--gold,#ab7f39);direction:ltr}
.spl-rules{list-style:none;margin:10px 0 0;padding:0}
.spl-rules li{height:30px;border-bottom:1px solid rgba(171,127,57,.22)}
.spl-mono{font:400 30px/1 var(--spk-lat);color:var(--gold,#ab7f39);direction:ltr;white-space:nowrap}
.spl-pg.l small{display:block;margin-top:4px;font:400 13px/1.4 var(--spk-body);color:#8b7568;direction:ltr}
.spl-sign{position:relative;margin:30px 2px 0;height:56px;border-bottom:1px solid rgba(171,127,57,.55)}
.spl-sign .ph{position:absolute;inset:auto 0 8px;font:400 14.5px/1 var(--spk-body);color:rgba(122,90,44,.6)}
.spl-sign .nm{position:absolute;inset:auto 0 4px;font:400 31px/1.2 var(--spk-disp);white-space:nowrap;
  background:linear-gradient(100deg,#8a6526 0%,#c99d4b 30%,#f5e2a6 45%,#c99d4b 60%,#8a6526 100%);background-size:260% 100%;background-position:100% 0;
  -webkit-background-clip:text;background-clip:text;color:transparent;clip-path:inset(0 0 0 100%)}
.spl-nib{position:absolute;bottom:14px;left:100%;width:30px;height:52px;margin-left:-6px;opacity:0;transform-origin:20% 100%;overflow:visible}
.spl-petal{position:absolute;width:36px;left:10px;bottom:6px;opacity:0}
.spl-c .spk-fld{margin-bottom:10px}
.spl-pol{position:absolute;left:12px;bottom:12px;margin:0;width:78px;padding:5px 5px 15px;background:#fffdf8;transform:rotate(-6deg);
  box-shadow:0 8px 16px -8px rgba(61,12,26,.5),0 0 0 1px rgba(171,127,57,.18)}
.spl-pol img{display:block;width:100%;height:66px;object-fit:cover}
.spl-pol::before{content:'';position:absolute;left:50%;top:-6px;width:26px;height:12px;margin-left:-13px;background:rgba(220,191,130,.55);transform:rotate(3deg)}