/* White & champagne couture: layered CSS 3D wedding stage. */
:root{--ink:#5b4a36;--gold:#a67b36;--paper:#fffcf7}
.header{height:90px;position:relative;z-index:12;background:#fffdf8bd}.demo-note{background:#f2eadb}.couture-hero{min-height:850px;height:calc(100svh - 115px);max-height:1100px;padding:0 6% 70px;display:flex;justify-content:center;align-items:center;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 72% 40%,#fffefb 0,#faf4e9 43%,transparent 70%),linear-gradient(125deg,#fffdf9,#eee1cb 55%,#fffdf7)}.couture-hero:before{inset:0;z-index:-1;background:repeating-linear-gradient(105deg,#fff0 0 90px,#fff5 91px 95px,#fff0 97px 180px);opacity:.6;transform:skewX(-8deg)}.couture-hero:after{content:'';position:absolute;left:0;right:0;bottom:-200px;height:430px;background:radial-gradient(ellipse,#bfa47b38,transparent 65%);transform:rotateX(55deg);z-index:-1}.stage-light{position:absolute;width:40%;height:150%;top:-30%;background:linear-gradient(90deg,transparent,#fff8,transparent);transform-origin:50% 0;pointer-events:none;filter:blur(15px);animation:spotlight 18s ease-in-out infinite}.light-left{left:10%;transform:rotate(25deg)}.light-right{right:4%;transform:rotate(-25deg);animation-direction:reverse;animation-delay:-8s}.hero-content{position:relative;width:1180px;max-width:100%;display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;gap:25px;min-height:0;padding:0;border:0;outline:0;background:none;box-shadow:none;transform:none!important;animation:none!important}.hero-content:before,.hero-content:after{display:none}.hero-story{text-align:left;padding:0 0 0 12px;position:relative;z-index:6}.couture-label{display:flex;align-items:center;gap:12px;font-size:9px;letter-spacing:3px;color:#9d7b45}.couture-label span{height:1px;width:25px;background:#c5a76c}.hero-story .hero-intro{margin:20px 0 0;font-size:19px;color:#958066}.hero-story h1{font-size:130px;align-items:flex-start;line-height:.75;margin:34px 0 30px;text-shadow:0 2px 0 #fff5,0 8px 20px #8d6b3010;color:#97713f;font-weight:400;animation:none!important}.hero-story h1 span{max-width:100%;overflow-wrap:anywhere}.hero-story h1 em{font-size:38px;padding-left:95px;margin:6px 0 12px;color:#bfa16a}.hero-vow{font:400 31px/1.2 var(--serif);color:#79634a;margin:25px 0}.hero-vow em{color:#a48352}.hero-story .hero-date{justify-content:flex-start;font-size:11px;margin-top:30px;gap:12px;letter-spacing:3px}.hero-story .hero-date .line:last-child{display:none}.hero-story .hero-place{margin:10px 0 25px;padding-left:35px;color:#937c5a}.hero-story .button{font-size:10px;min-height:49px;padding:14px 24px;letter-spacing:.6px;background:linear-gradient(115deg,#987038,#d3b274 50%,#a17a3f);box-shadow:inset 0 1px 0 #fff9,inset 0 -2px 0 #8c632c,0 8px 20px #ad84432b;border:1px solid #b6955d}.replay-opening{display:block;font-size:9px;color:#a68c64;margin-top:18px;letter-spacing:.6px;border:0}.replay-opening span{margin-left:15px}.scene-viewport{position:relative;width:100%;height:700px;perspective:1300px;perspective-origin:50% 45%;touch-action:pan-y;isolation:isolate}.scene-3d{position:absolute;width:510px;height:650px;left:50%;top:0;transform-style:preserve-3d;transform:translateX(-50%) rotateX(var(--tilt-x,-4deg)) rotateY(var(--tilt-y,-9deg));transition:transform .8s cubic-bezier(.2,.7,.2,1);will-change:transform}.scene-back{position:absolute;left:55px;top:20px;width:400px;height:540px;border-radius:210px 210px 0 0;background:radial-gradient(ellipse at 55% 30%,#fffefb,#f5ecdc 60%,#e9d9bd);border:3px solid #d9bc83;box-shadow:inset 2px 0 2px #fff,inset -3px 0 5px #98763f44,9px 12px 0 #c6ac7b,15px 18px 0 #e0ccaa,20px 25px 25px #8b6d3d22;transform:translateZ(-70px)}.arch-inlay{position:absolute;inset:16px;border:1px solid #bda16f;border-radius:inherit;box-shadow:inset 0 0 0 6px #fff6,inset 0 0 0 7px #b79d6b40}.arch-inlay:before{content:'';position:absolute;inset:18px;border:1px solid #cbb38377;border-radius:inherit;background:repeating-conic-gradient(from -2deg at 50% 100%,transparent 0deg 9deg,#d4bb8f22 9deg 9.4deg,transparent 9.4deg 18deg)}.arch-crown{position:absolute;top:35px;left:0;right:0;text-align:center;font:50px var(--serif);color:#be9d60;text-shadow:0 2px white}.arch-inscription{position:absolute;left:0;right:0;top:109px;text-align:center;font-size:7px;letter-spacing:2.8px;color:#b79a68}.scene-door{position:absolute;top:65px;width:88px;height:475px;background:linear-gradient(90deg,#e3d1ad,#fff9ef 12%,#f1e5d0 75%,#b99b66);border:2px solid #c2a26a;box-shadow:inset 0 0 0 6px #faf1dd,inset 0 0 0 7px #c8ac764d,5px 4px 8px #7f603624;transform-style:preserve-3d}.door-left{left:18px;border-radius:90px 0 0 0;transform-origin:right center;transform:translateZ(-35px) rotateY(-32deg)}.door-right{right:18px;border-radius:0 90px 0 0;transform-origin:left center;transform:translateZ(-35px) rotateY(32deg)}.scene-door:after{content:'';position:absolute;inset:17px;border:1px solid #cdb27c;border-radius:inherit;background:linear-gradient(115deg,transparent,#fff8,transparent)}.scene-floral{position:absolute;width:155px;height:245px;background:url('assets/wedding-florals.jpg') top left/245px 367px;border-radius:45% 45% 40% 35%;mask-image:radial-gradient(ellipse,#000 35%,transparent 72%);filter:drop-shadow(0 9px 8px #84683b22);pointer-events:none}.floral-left{left:-35px;top:140px;transform:translateZ(35px) rotate(-18deg)}.floral-right{right:-39px;top:322px;transform:translateZ(85px) rotate(165deg);width:185px;height:250px}.stage-base{position:absolute;width:430px;height:96px;left:40px;top:525px;border-radius:50%;background:linear-gradient(#f9f1df 5%,#c7a36a 7%,#e9d4ab 10%,#fffaf0 20%,#ede0c8 60%,#ad8956 63%,#d3b580 67%,#f7edda 73%);box-shadow:0 18px 20px #9271432b,inset 0 -4px 10px #c4a46b44;transform:translateZ(20px)}.stage-top{position:absolute;width:430px;height:115px;left:40px;top:495px;border:2px solid #d2b582;border-radius:50%;background:radial-gradient(ellipse at 45% 30%,#fffefb,#f3e8d5 75%);box-shadow:inset 0 0 0 7px #fff9,inset 0 0 0 9px #ceb17d55;transform:translateZ(23px)}.stage-shadow{position:absolute;left:30px;top:570px;width:460px;height:100px;border-radius:50%;background:radial-gradient(ellipse,#8c6c3e44,transparent 70%);filter:blur(10px);transform:translateZ(-10px)}.wedding-figures{position:absolute;left:50%;top:134px;width:270px;max-width:none;margin:0;transform:translateX(-50%) translateZ(80px);transform-style:preserve-3d;isolation:auto}.wedding-figures:before{display:none}.wedding-figures img{width:100%;height:auto;filter:drop-shadow(0 8px 6px #8461322e);animation:none}.gold-ring{position:absolute;width:83px;height:83px;border:10px solid #c9a151;border-radius:50%;background:none;box-shadow:inset 2px 2px 2px #78551e,inset -2px -2px 3px #fff1be,2px 2px 1px #8e672c,5px 5px 14px #8b662b33;transform-style:preserve-3d;pointer-events:none}.gold-ring:after{content:'';position:absolute;inset:-6px;border:2px solid #ffe8a3;border-radius:50%;border-right-color:#aa8035;border-bottom-color:#aa8035}.ring-one{top:67px;right:18px;transform:translateZ(115px) rotateX(25deg) rotateY(-24deg) rotateZ(-28deg);animation:ring-orbit 9s ease-in-out infinite}.ring-two{top:110px;right:-15px;transform:translateZ(140px) rotateX(-15deg) rotateY(20deg) rotateZ(22deg);animation:ring-orbit-two 9s -3s ease-in-out infinite}.scene-pearl{position:absolute;border-radius:50%;background:radial-gradient(circle at 30% 25%,white,#f6ead8 45%,#d5be95 80%,#a48a5a);box-shadow:3px 7px 9px #84653723;animation:pearl-float 7s ease-in-out infinite}.pearl-one{width:25px;height:25px;left:-9px;top:100px;transform:translateZ(80px)}.pearl-two{width:16px;height:16px;right:-18px;top:445px;transform:translateZ(140px);animation-delay:-3s}.pearl-three{width:12px;height:12px;left:60px;top:440px;transform:translateZ(160px);animation-delay:-5s}.scene-orbit{position:absolute;left:50%;top:25px;width:570px;height:570px;border:1px solid #bd9e6340;border-radius:50%;transform:translateX(-50%) rotateX(23deg) rotateY(24deg);pointer-events:none}.scene-orbit:after{content:'';position:absolute;inset:-25px;border:1px solid #c8ad7b22;border-radius:50%}.scene-caption{position:absolute;bottom:16px;left:0;right:0;font-size:8px;letter-spacing:2px;color:#ad8d57;display:flex;align-items:center;gap:15px;justify-content:center}.scene-caption span{font-size:17px}.hero-bottom{bottom:25px;left:6%;right:6%;color:#a58e69;font-size:7px;letter-spacing:2px}.hero-bottom a{font-size:9px}.opening{background:radial-gradient(ellipse at 50% 38%,#fffcf3de,#e5d6baee),url('assets/wedding-florals.jpg') center/cover;perspective:1100px}.envelope{transform-style:preserve-3d;box-shadow:12px 10px 0 #d7c5a4,15px 13px 0 #eee0c6,0 40px 70px #7f582d26;transform:rotateX(7deg) rotateY(-8deg) rotateZ(-3deg);animation:envelope-3d-arrive 1.5s both;border:1px solid #d1b27b}.envelope-pocket{background:linear-gradient(145deg,#fff9ea,#e9d7b5);box-shadow:inset 0 -1px 0 #c1a16c}.wax-seal{transform:translateZ(20px);background:radial-gradient(ellipse at 30% 25%,#fff0bb,#c9a15b 50%,#997232);box-shadow:inset 0 0 0 3px #98743866,inset 0 0 0 5px #e4c78b77,0 10px 15px #75512255}.opening.is-unsealing .envelope-flap{transform:rotateX(180deg)}.opening.is-unsealing .envelope-letter{transform:translateY(-155px) translateZ(10px) rotateZ(3deg)}.invitation-open .scene-back{animation:arch-arrive 1.8s both}.invitation-open .door-left{animation:door-left-open 2.5s .2s both}.invitation-open .door-right{animation:door-right-open 2.5s .2s both}.invitation-open .wedding-figures img{animation:figure-arrive 2s .4s both}.event-details{box-shadow:8px 8px 0 #e4d6bd66,16px 16px 0 #f0e6d533,0 25px 45px #90703a12;transform-style:preserve-3d}.date-block{box-shadow:inset 0 0 0 4px #fff5,3px 3px 0 #d0b78655}.rsvp form{box-shadow:7px 7px 0 #ddcdb055,0 22px 50px #8a6b3020;border-top:3px solid #c2a168}.rsvp .button-dark{box-shadow:inset 0 1px #fff5,0 4px 0 #806037,0 9px 20px #9d7a3e28}.motion-paused .scene-3d{transform:translateX(-50%) rotateX(-4deg) rotateY(-9deg)!important;transition:none!important}.motion-paused .wedding-figures img{opacity:1!important;transform:none!important}
@keyframes spotlight{50%{transform:rotate(-12deg) translateX(15%);opacity:.45}}@keyframes ring-orbit{50%{transform:translateZ(130px) translateY(-16px) rotateX(40deg) rotateY(-8deg) rotateZ(-10deg)}}@keyframes ring-orbit-two{50%{transform:translateZ(145px) translateY(12px) rotateX(-25deg) rotateY(40deg) rotateZ(35deg)}}@keyframes pearl-float{50%{margin-top:-14px}}@keyframes envelope-3d-arrive{from{opacity:0;transform:translateY(70px) rotateX(25deg) rotateY(-15deg) rotateZ(-5deg)}to{opacity:1;transform:rotateX(7deg) rotateY(-8deg) rotateZ(-3deg)}}@keyframes arch-arrive{from{opacity:0;transform:translateZ(-200px) translateY(30px)}to{opacity:1;transform:translateZ(-70px)}}@keyframes door-left-open{from{transform:translateZ(10px) rotateY(0)}to{transform:translateZ(-35px) rotateY(-32deg)}}@keyframes door-right-open{from{transform:translateZ(10px) rotateY(0)}to{transform:translateZ(-35px) rotateY(32deg)}}@keyframes figure-arrive{from{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:none}}
@media(min-width:1500px){.hero-content{gap:70px}.hero-story h1{font-size:145px}}
@media(max-width:1100px){.couture-hero{padding-left:5%;padding-right:5%;min-height:820px}.hero-content{grid-template-columns:.8fr 1.2fr;gap:0}.hero-story h1{font-size:112px}.hero-vow{font-size:28px}.scene-viewport{transform:scale(.85);transform-origin:center center;width:117%;margin-left:-8.5%}.couture-label{font-size:7px;letter-spacing:2px}.hero-story .hero-intro{font-size:16px}.hero-story .hero-date{font-size:9px;letter-spacing:2px}}
@media(max-width:760px){.couture-hero{padding:35px 20px 65px;min-height:0;height:auto;max-height:none;display:block}.hero-content{display:flex;flex-direction:column;gap:0;width:100%;padding:0;background:none;border:0;min-height:0}.hero-story{padding:0;width:100%;text-align:center}.couture-label{justify-content:center;font-size:8px;letter-spacing:2.5px}.hero-story .hero-intro{font-size:16px;margin:14px 0 0}.hero-story h1{font-size:96px;display:flex;flex-direction:row;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;line-height:1;margin:14px 0 8px;letter-spacing:-1px}.hero-story h1 span{line-height:1;max-width:100%}.hero-story h1 em{font-size:29px;padding:0;margin:0}.hero-vow{font-size:24px;margin:12px 0}.hero-vow br{display:none}.hero-story .hero-date{justify-content:center;margin:20px 0 0;font-size:9px}.hero-story .hero-date .line:last-child{display:block}.hero-story .hero-place{padding:0;margin:7px 0 20px;font-size:7px}.hero-story .button{font-size:9px;min-height:43px;padding:12px 20px}.replay-opening{margin:9px auto 0;font-size:8px;padding:7px 0}.scene-viewport{height:515px;transform:none;width:100%;margin:10px 0 0;perspective:1000px}.scene-3d{scale:.71;transform-origin:50% 0;left:50%;margin-left:0}.scene-orbit{width:370px;height:420px;top:20px;max-width:110%}.scene-orbit:after{inset:-12px}.scene-caption{bottom:12px;font-size:7px;letter-spacing:1.5px}.hero-bottom{left:20px;right:20px;bottom:22px}.hero-bottom a{font-size:8px}.hero-bottom>span{display:none}.scene-floral{opacity:.9}.envelope{width:min(82vw,440px)}.opening.is-unsealing .envelope-letter{transform:translateY(-120px) translateZ(10px) rotateZ(3deg)}}
@media(max-width:380px){.hero-story h1{font-size:82px;gap:8px}.hero-vow{font-size:22px}.scene-3d{scale:.62}.scene-viewport{height:455px}.scene-caption{bottom:5px}}
@media(prefers-reduced-motion:reduce){.scene-3d{transform:translateX(-50%) rotateX(-4deg) rotateY(-9deg);transition:none}.scene-3d *{animation:none!important}.scene-back,.wedding-figures img{opacity:1!important}.envelope{animation:none;transform:none}.stage-light{display:none}}
@media print{.couture-hero{display:block;height:auto;min-height:0;overflow:visible}.hero-content{display:block}.scene-viewport{height:600px;width:510px;margin:auto}.hero-story{text-align:center}.hero-story h1{align-items:center}.replay-opening{display:none}}
/* Keep the scaled diorama centred in narrow viewports. */
.scene-3d{margin-left:-255px;transform:rotateX(var(--tilt-x,-4deg)) rotateY(var(--tilt-y,-9deg))}
.motion-paused .scene-3d{transform:rotateX(-4deg) rotateY(-9deg)!important}
@media(max-width:760px){.scene-3d{margin-left:-255px}.hero-story h1{gap:9px;font-size:85px}.hero-story h1 em{display:block;flex:0 0 auto;font-size:27px}.hero-vow br:after{content:' '}.hero-vow{font-size:23px}.hero-vow em{margin-left:.2em}}
@media(max-width:380px){.hero-story h1{font-size:73px;gap:7px}.hero-story h1 em{font-size:24px}}
@media(prefers-reduced-motion:reduce){.scene-3d{transform:rotateX(-4deg) rotateY(-9deg)}}
@media(max-width:760px){.scene-3d{scale:.65}.scene-viewport{height:480px}}
@media(max-width:380px){.scene-3d{scale:.57}.scene-viewport{height:425px}}
.motion-paused .scene-back{opacity:1!important;transform:translateZ(-70px)!important}
.motion-paused .door-left{transform:translateZ(-35px) rotateY(-32deg)!important}
.motion-paused .door-right{transform:translateZ(-35px) rotateY(32deg)!important}
