/* The original stationery, ring box, arch, fonts and music are retained. */
@font-face{font-family:Wedding;src:url('assets/fonts/cormorant-garamond-500.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:Wedding;src:url('assets/fonts/cormorant-garamond-600.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:Wedding;src:url('assets/fonts/cormorant-garamond-italic-500.ttf') format('truetype');font-weight:500;font-style:italic;font-display:swap}
@font-face{font-family:Label;src:url('assets/fonts/montserrat-600.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:Label;src:url('assets/fonts/montserrat-700.ttf') format('truetype');font-weight:700;font-display:swap}
:root{--wine:#70213b;--wine-dark:#431020;--rose:#bd7887;--ivory:#fffaf3;--paper:#f7e9df;--gold:#a77a41;--gold-light:#efd7a7;--ink:#4d2930;--ease:cubic-bezier(.22,1,.36,1);--sans:Label,Arial,sans-serif;--serif:Wedding,Georgia,serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--paper)}body{margin:0;color:var(--ink);background:var(--paper);font-family:var(--serif);font-weight:500;font-kerning:normal;overflow-x:hidden}body.locked,body.modal-open{overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{cursor:default}a{color:inherit}button,a{touch-action:manipulation}img{max-width:100%;display:block}button:focus-visible,a:focus-visible{outline:3px solid #ba8848;outline-offset:5px}h1:focus{outline:0}[hidden]{display:none!important}button:active,a.primary-button:active{scale:.975}.noscript-note{position:fixed;z-index:200;inset:auto 10px 10px;padding:12px;background:var(--ivory);color:var(--wine);text-align:center}
.story{position:relative;overflow:clip;opacity:0;visibility:hidden;transition:opacity 1s var(--ease)}body.invitation-open .story{opacity:1;visibility:visible}.scene{position:relative;isolation:isolate;min-height:100svh;padding:100px 24px 84px;display:grid;place-items:center;overflow:hidden;scroll-margin-top:0}.content{position:relative;z-index:4;display:flex;flex-direction:column;align-items:center;text-align:center;width:min(780px,100%);margin-inline:auto}.content.narrow{width:min(630px,100%)}h2{margin:0;color:var(--wine);font-size:clamp(37px,5.5vw,64px);font-weight:500;line-height:1.12}.eyebrow{margin:0 0 18px;color:var(--wine);font:600 11px/1.7 var(--sans);letter-spacing:.23em}.script-heading{margin:0;font:italic 500 clamp(39px,5.7vw,66px)/1.07 var(--serif);color:var(--wine)}.script-heading.small{font-size:36px}.section-note{margin:14px 0 0;color:#825e61;font-size:22px;font-style:italic}.ornament{display:flex;align-items:center;gap:15px;width:min(285px,78%);margin:25px 0;color:var(--gold)}.ornament i{flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}.ornament i:last-child{transform:rotate(180deg)}.ornament b{font-size:9px}.down-arrow{width:46px;height:46px;display:grid;place-items:center;flex:none;margin-top:28px;border:1px solid #a477548c;border-radius:50%;background:#fffaf375;text-decoration:none;color:var(--wine);font-size:25px;transition:background .3s,transform .4s var(--ease);animation:arrowFloat 3s ease-in-out infinite}.down-arrow:hover{background:#fffaf3}.content.reveal{opacity:0;transform:translateY(28px);filter:blur(3px);transition:opacity 1s var(--ease),transform 1.2s var(--ease),filter 1s var(--ease)}.content.reveal.visible{opacity:1;transform:none;filter:none}.content.reveal> *{transition-delay:0s}.content.reveal.visible .symbol-card{animation:cardArrive 1.15s var(--ease) both}.content.reveal.visible .symbol-card:nth-child(2){animation-delay:.12s}.content.reveal.visible .symbol-card:nth-child(3){animation-delay:.24s}
/* A familiar floral arch, with a quiet lake moving beneath the invitation. */
.hero-scene,.final-scene{background:#f7e9df url('assets/wedding-arch.webp') center/cover no-repeat}.hero-scene{min-height:1120px;padding-top:132px;padding-bottom:310px}.hero-shade,.final-shade{position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,#fff8ee4d,#fff8eeb5 30%,#fff7ead1 68%,#f1dbd0b8)}.hero-content::before{content:'';position:absolute;z-index:-1;inset:-45px -30px;background:radial-gradient(ellipse,#fffaf3e0 0,#fffaf37d 50%,transparent 73%);pointer-events:none}.bismillah{margin:0 0 22px;font-size:25px;font-style:italic;color:#866333;letter-spacing:.015em}.names{margin:0;color:var(--wine);font-size:clamp(48px,5.5vw,76px);font-weight:500;font-style:italic;letter-spacing:-.025em;line-height:.99;text-shadow:0 2px 0 #fffaf3,0 8px 24px #72253d13}.names .couple{display:flex;flex-direction:column;align-items:center;gap:3px}.couple>span{display:block;max-width:100%}.names i{font-size:.42em;font-weight:500;color:var(--gold);line-height:.85;margin:4px 0}.names .couples-join{display:flex;align-items:center;justify-content:center;gap:15px;margin:18px 0;font-size:20px;color:#966d48;letter-spacing:.05em}.couples-join::before,.couples-join::after{content:'';width:42px;height:1px;background:#b38d6355}.date-card{min-width:min(340px,100%);padding:16px 28px;display:flex;flex-direction:column;gap:5px;position:relative;overflow:hidden;background:linear-gradient(135deg,#fffdf5e8,#fff4eccc);border:1px solid #b8894f80;border-radius:24px 5px;box-shadow:inset 0 0 0 5px #fff9,0 15px 38px #43102015;backdrop-filter:blur(8px)}.date-card strong{font:600 13px/1.7 var(--sans);letter-spacing:.13em}.date-card>span{font:600 10px/1.5 var(--sans);letter-spacing:.17em}.date-card b{font:500 32px/1.15 var(--serif);letter-spacing:.01em;padding-left:8px}.date-card::after,.primary-button::before{content:'';position:absolute;inset:-60% auto -60% -60%;width:35%;background:linear-gradient(90deg,transparent,#fff8,transparent);transform:rotate(20deg);animation:goldSweep 9s ease-in-out infinite;pointer-events:none}
.silk-light,.wedding-light{position:absolute;z-index:1;inset:-20%;pointer-events:none;background:conic-gradient(from 0deg at 50% 10%,transparent 5%,#fffbe035 10%,transparent 18%,transparent 82%,#fffce83d 89%,transparent 94%);mix-blend-mode:screen;animation:silkDrift 18s ease-in-out infinite alternate;opacity:.65}
.lake{position:absolute;z-index:2;inset:auto 0 0;height:370px;overflow:hidden;pointer-events:none;background:linear-gradient(180deg,#efd7ca00,#ead1c4 25%,#d3b9ab 70%,#c4aea1);mask-image:linear-gradient(transparent,#000 22%);-webkit-mask-image:linear-gradient(transparent,#000 22%)}.lake-glow{position:absolute;width:100%;height:100%;background:radial-gradient(ellipse at 50% 60%,#fff3cebd,transparent 55%);animation:lakeGlow 10s ease-in-out infinite alternate}.lake-water{position:absolute;inset:28% -15% -10%;opacity:.55;background:repeating-linear-gradient(178deg,transparent 0 15px,#fff2dc38 16px,#9f87752b 17px,transparent 20px 31px);transform:perspective(450px) rotateX(27deg);animation:waterFlow 13s linear infinite}.water-ribbons{position:absolute;inset:22% 0 0;background:repeating-radial-gradient(ellipse at 50% 0,transparent 0 23px,#ffedca35 24px,transparent 25px 40px);opacity:.43;transform:scaleX(2.5);animation:waterShimmer 8s ease-in-out infinite alternate}.swan{position:absolute;bottom:3%;width:clamp(270px,31vw,460px);will-change:transform;animation:swanSwim 28s ease-in-out infinite alternate}.swan img{position:relative;z-index:2;width:100%;height:auto;animation:swanBreathe 6s ease-in-out infinite}.swan-a{left:9%;--swim-x:-7vw;--swan-y:5px}.swan-b{right:10%;bottom:10%;width:clamp(235px,27vw,405px);--swim-x:8vw;--swan-y:-4px;animation-duration:33s;animation-delay:-9s}.swan-b img{transform:scaleX(-1);animation-name:swanBreatheReverse}.swan i{position:absolute;z-index:1;left:9%;top:61%;width:82%;height:12%;border:1px solid #fff6d990;border-radius:50%;animation:wakeExpand 5s ease-out infinite}.swan i:last-child{animation-delay:-2.5s}.lake-caption{position:absolute;z-index:3;bottom:20px;left:0;width:100%;margin:0;color:#604439;font-size:19px;letter-spacing:.03em;font-style:italic;text-align:center}
/* The invitation text and the original calendar and symbols. */
.paper-scene{background:linear-gradient(#fff8efe6,#fff8eff2),url('assets/wedding-arch.webp') center/cover}.paper-scene::before,.blush-scene::before,.symbols-scene::before{content:'';position:absolute;inset:22px;border:1px solid #b48a5666;border-radius:42px 8px;pointer-events:none;box-shadow:inset 0 0 0 6px #fff4}.paper-scene::after,.blush-scene::after,.symbols-scene::after{content:'✦';position:absolute;top:15px;left:50%;padding:0 14px;color:var(--gold);background:var(--paper);transform:translateX(-50%);font-size:16px}.wedding-scene{background:linear-gradient(#fff8efb8,#fff8efd6),url('assets/wedding-arch.webp') center/cover;min-height:1000px}.invitation-card{width:100%;position:relative;margin-top:8px;padding:40px 38px 34px;border:1px solid #b48a5680;border-radius:32px 7px;background:#fffcf7ed;box-shadow:0 22px 65px #4c162614,inset 0 0 0 6px #b8894f08;font-size:25px;line-height:1.6;backdrop-filter:blur(9px)}.invitation-card::before{content:'❦';position:absolute;top:-22px;left:calc(50% - 30px);width:60px;background:#fffaf4;color:var(--gold);font-size:30px}.invitation-card::after{content:'';position:absolute;inset:9px;border:1px solid #b8894f22;border-radius:24px 4px;pointer-events:none}.invitation-card p{margin:0}.invitation-card .salaam{margin-bottom:17px;font:700 14px/1.6 var(--sans);letter-spacing:.09em;color:var(--wine)}.invitation-card .guest-greeting{font-style:italic;font-size:28px;line-height:1.2;margin-bottom:19px}.invitation-card .couple-inline{margin:20px 0;font-size:23px;line-height:1.3;letter-spacing:.015em;color:var(--wine)}.couple-inline>strong{display:block;font-weight:600}.couple-inline>span{display:block;margin:9px 0;color:var(--gold);font-size:20px;font-style:italic}.couple-inline .name-suffix{font-weight:500;font-size:.85em}.invitation-card b{font-weight:600;color:var(--wine)}.family-sign{max-width:100%;margin:30px 0 0;padding-top:22px;border-top:1px solid #b48a5650;font-size:21px;line-height:1.7;color:#80595e}.family-sign strong{display:inline-block;margin:5px 0;font-size:20px;font-weight:600;line-height:1.5;letter-spacing:.025em;color:var(--wine)}.family-sign>span{font-style:italic}
.blush-scene{background:radial-gradient(ellipse at 10% 10%,#fff9,transparent 50%),linear-gradient(140deg,#f8e9e1,#edcfca 70%,#f8e7df)}.calendar-card{width:min(490px,100%);margin-top:30px;padding:26px 25px;border:1px solid #b48a567a;border-radius:30px 7px;background:#fffaf2ee;box-shadow:0 20px 45px #43102013,inset 0 0 0 5px #fff5}.calendar-title{display:flex;gap:16px;align-items:baseline;justify-content:center;margin-bottom:24px}.calendar-title span{font:600 18px var(--sans);letter-spacing:.15em}.calendar-title strong{font-size:25px;font-weight:500;color:var(--gold)}.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));align-items:center;gap:7px}.weekdays{font:600 10px var(--sans);color:#87676b;margin-bottom:10px}.days time,.days>span{height:39px;display:grid;place-items:center;position:relative;font-size:21px;border-radius:50%;font-variant-numeric:tabular-nums}.days .event-day{background:linear-gradient(135deg,#8c3651,var(--wine-dark));color:var(--ivory);font-weight:600;box-shadow:0 4px 15px #70213b35,0 0 0 4px #b8894f20;animation:dateHeartbeat 4s ease-in-out infinite}.event-day small{position:absolute;right:-3px;bottom:-2px;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--gold-light);color:var(--wine);font-size:10px}.countdown{width:min(490px,100%);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:26px;padding:14px 0;border:1px solid #b48a5660;border-radius:24px 6px;background:#fffaf3b3;box-shadow:0 15px 35px #4310200d}.countdown>div{padding:6px;border-right:1px solid #b48a5638}.countdown>div:last-child{border:0}.countdown strong{display:block;font-size:44px;font-weight:500;font-variant-numeric:tabular-nums;line-height:1.05;color:var(--wine)}.countdown span{display:block;font:600 9px var(--sans);letter-spacing:.08em;margin-top:8px;color:#81625a}.countdown .tick{animation:digitTick .42s var(--ease)}.event-card{width:min(490px,100%);margin-top:27px;padding:26px 28px;border:1px solid #b48a5677;border-radius:7px 30px;background:#fffaf3a6;box-shadow:0 16px 38px #4310200f}.event-line{display:grid;grid-template-columns:92px 35px 1fr;align-items:center;text-align:left;margin-top:23px}.event-line time{font-size:36px;color:var(--wine)}.event-line>span{width:9px;height:9px;background:var(--rose);box-shadow:0 0 0 6px #bd78871a;transform:rotate(45deg);justify-self:center}.event-line strong{font-size:26px;font-weight:500;line-height:1.1;color:var(--wine)}.event-line small{font-size:17px;color:#7d6262}.calendar-link{display:inline-flex;align-items:center;gap:15px;min-height:44px;margin-top:15px;font:600 11px var(--sans);text-decoration:none;border-bottom:1px solid #b8894f55}.calendar-link span{font-size:19px}
.symbols-scene{background:radial-gradient(ellipse at 70% 30%,#fff8,transparent 60%),linear-gradient(145deg,#faebe5,#efd7d3 65%,#faeee8)}.symbols-scene .content{width:min(1040px,100%)}.symbol-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;width:100%;margin-top:42px;align-items:start}.symbol-card{position:relative;min-width:0;aspect-ratio:4/5;margin:0;overflow:hidden;isolation:isolate;border:1px solid #b8894f88;border-radius:36px 8px;box-shadow:0 20px 45px #43102020,0 0 0 5px #fffaf380;background:#eadbd2;transition:transform .65s var(--ease),box-shadow .65s}.symbol-card:nth-child(2){margin-top:24px}.symbol-card::after{content:'';position:absolute;inset:35% 0 0;z-index:1;pointer-events:none;background:linear-gradient(transparent,#310713c7)}.gallery-open{display:block;border:0;padding:0;background:none;width:100%;height:100%;text-align:inherit;color:inherit}.gallery-open img{width:100%;height:100%;object-fit:cover;transition:transform 1.3s var(--ease);pointer-events:none}.gallery-open:focus-visible{outline:3px solid var(--gold-light);outline-offset:-7px}.symbol-card:hover img{transform:scale(1.05)}.ring-card{background:radial-gradient(ellipse at 50% 35%,#ae5265,#4d0e20 80%)}.ring-card img{object-fit:contain;filter:drop-shadow(0 18px 24px #23040b66)}.venue-card img{object-position:43% 50%}.symbol-card figcaption{position:absolute;z-index:3;bottom:23px;left:20px;right:20px;font-size:25px;font-style:italic;line-height:1.1;color:var(--ivory);text-shadow:0 3px 12px #16020899;pointer-events:none}.zoom-mark{position:absolute;z-index:3;right:17px;top:17px;display:grid;place-items:center;width:34px;height:34px;border:1px solid #fff8;border-radius:50%;background:#43102038;color:#fffaf3;font-size:24px;backdrop-filter:blur(8px)}.gallery-hint{margin:28px 0 0;font:600 10px/1.7 var(--sans);color:#86646a}
/* The supplied venue photograph stays intact; motion is applied as presentation. */
.location-scene .content{width:min(800px,100%)}.location-scene h2{font-size:clamp(44px,6vw,72px)}.location-scene h2 span{font-size:.7em;font-style:italic}.address{margin:16px 0 30px;font-size:26px;color:#79555b}.venue-visual{position:relative;isolation:isolate;margin:12px 0 30px;width:100%;aspect-ratio:16/9;overflow:hidden;background:#dfd3c9;border:1px solid var(--gold-light);border-radius:42px 8px;box-shadow:0 26px 60px #43102028,0 0 0 6px #fffaf3b3,0 0 0 7px #b8894f55}.venue-visual img{object-fit:cover;object-position:center;animation:venueCinema 20s ease-in-out infinite alternate}.venue-visual::before{content:'';position:absolute;z-index:1;inset:0;pointer-events:none;background:linear-gradient(180deg,#fff2df08,transparent 40%,#360d1c8a)}.venue-visual::after{content:'';position:absolute;z-index:2;inset:13px;border:1px solid #fff5dc85;border-radius:30px 4px;pointer-events:none}.venue-glint{position:absolute;z-index:2;inset:-80% auto -80% -60%;width:30%;background:linear-gradient(90deg,transparent,#fff5df3b,transparent);transform:rotate(22deg);animation:goldSweep 12s ease-in-out infinite;pointer-events:none}.venue-visual figcaption{position:absolute;z-index:3;left:50%;bottom:22px;transform:translateX(-50%);margin:0;padding:10px 22px;border:1px solid #fff5dc60;border-radius:30px;backdrop-filter:blur(8px);background:#43102055;white-space:nowrap;font:600 12px var(--sans);letter-spacing:.14em;color:var(--ivory);pointer-events:none}.venue-pin{position:absolute;z-index:3;right:24px;bottom:20px;display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--gold-light);border-radius:50%;background:#fffaf3e6;animation:arrowFloat 5s ease-in-out infinite;pointer-events:none}.venue-pin i{width:14px;height:18px;background:var(--wine);border-radius:50% 50% 50% 2px;transform:rotate(-45deg);position:relative}.venue-pin i::after{content:'';position:absolute;width:6px;height:6px;border-radius:50%;background:var(--ivory);top:4px;left:4px}.landmark{margin:0;color:#87656a;font-style:italic;font-size:23px}.primary-button{display:inline-flex;justify-content:center;align-items:center;gap:17px;position:relative;overflow:hidden;min-height:54px;max-width:100%;margin-top:25px;padding:14px 26px;color:var(--ivory);background:linear-gradient(120deg,#8c3651,#64182f 52%,#431020);border:1px solid #efd7a7b3;border-radius:999px;box-shadow:0 14px 32px #43102033,inset 0 1px #fff3;text-decoration:none;font:600 11px/1.6 var(--sans);letter-spacing:.065em;transition:transform .45s var(--ease),box-shadow .45s}.primary-button span{font-size:22px;line-height:1}.primary-button:hover{transform:translateY(-3px);box-shadow:0 20px 42px #43102044}.primary-button::before{opacity:.5}.qr-card{margin-top:26px;padding:18px 21px 13px;border:1px solid #b48a5680;border-radius:25px 6px;background:#fffdfa;box-shadow:0 16px 32px #4310200f}.qr-card img{width:168px;height:168px;margin:auto;image-rendering:pixelated}.qr-card p{margin:10px 0 0;color:#78585e;font:600 9px/1.5 var(--sans)}
.final-scene{min-height:1000px;padding-bottom:330px}.final-shade{background:linear-gradient(#fff8efd6,#fff8efde 68%,#f1dbd0b8)}.final-scene h2{font-size:clamp(31px,4vw,46px);line-height:1.25}.final-date{margin:25px 0 0;font:600 11px/1.9 var(--sans);letter-spacing:.08em}.final-date span{display:block}.monogram{margin:25px 0 0;font-size:47px;line-height:1.2;font-style:italic;color:var(--wine)}.monogram i{font-size:.6em;color:var(--gold)}.monogram b{font-weight:500;color:var(--gold);font-size:.6em;margin:0 12px}.brand-note{margin:12px 0 0;font:600 10px/1.9 var(--sans);letter-spacing:.12em;color:#835c39}.text-button{min-height:44px;margin-top:20px;padding:8px 5px;border:0;border-bottom:1px solid #b8894f60;background:none;font:600 10px var(--sans);color:var(--wine)}.text-button span{margin-left:9px;font-size:17px}
/* Original envelope and rings, now with a reversible cinematic transition. */
.gate{position:fixed;z-index:100;inset:0;display:grid;place-items:center;overflow:hidden;perspective:1600px;background:radial-gradient(ellipse at 50% 35%,#eed7cb,#ac7d80);transition:opacity .45s ease,background-color .8s}.gate.fading{opacity:0;pointer-events:none}.envelope-shell{position:absolute;inset:0;width:min(760px,100%);margin:auto;perspective:1600px;box-shadow:0 0 130px #43102055}.envelope-panel{position:absolute;z-index:3;top:0;bottom:0;width:50.15%;background-image:url('assets/envelope.webp');background-size:200% 100%;background-repeat:no-repeat;backface-visibility:hidden;will-change:transform;transition:transform 1.95s cubic-bezier(.7,.02,.18,1),filter 1.9s ease}.envelope-left{left:0;background-position:left center;transform-origin:left}.envelope-right{right:0;background-position:right center;transform-origin:right}.gate.opening .envelope-left{transform:rotateY(-100deg) translateX(-18%);filter:drop-shadow(20px 0 30px #43102055)}.gate.opening .envelope-right{transform:rotateY(100deg) translateX(18%);filter:drop-shadow(-20px 0 30px #43102055)}.gate.closing .envelope-panel{transition-duration:1.65s}.gate-vignette{position:absolute;z-index:4;inset:0;background:radial-gradient(ellipse at 50% 45%,transparent 20%,#43102020);pointer-events:none;transition:opacity .7s}.gate.opening .gate-vignette{opacity:0}.gate-frame{position:absolute;z-index:5;inset:20px max(20px,calc((100vw - 710px)/2));border:1px solid #fff4e780;border-radius:140px 140px 10px 10px;pointer-events:none;transition:opacity .4s,transform 1s var(--ease)}.gate-frame::after{content:'';position:absolute;inset:7px;border:1px solid #b1855b50;border-radius:inherit}.gate-intro{position:absolute;z-index:7;top:10%;left:18px;right:18px;text-align:center;transition:opacity .6s,transform .9s var(--ease)}.gate-intro .eyebrow{font-size:10px;letter-spacing:.18em;margin-bottom:17px}.gate-names{margin:0;color:var(--wine);font-size:34px;line-height:1.03;font-style:italic;text-shadow:0 1px 12px #fffaf380}.gate-names i{font-size:.75em;color:#946238}.gate-names small{font-size:17px;color:#96694b;line-height:1.6}.gate-hint{position:absolute;z-index:7;bottom:8%;left:0;right:0;text-align:center;color:var(--wine);transition:opacity .45s,transform .7s}.gate-hint p{margin:0 0 16px;font-size:25px;font-style:italic}.gate-hint>span{font:600 10px var(--sans);letter-spacing:.14em}.gate-hint i{display:inline-block;height:12px;width:1px;margin:0 13px -2px;background:#97684970}.ring-button{position:absolute;z-index:8;top:55%;left:50%;width:min(300px,78vw);padding:0;background:none;border:0;transform:translate(-50%,-50%);transition:opacity .55s,transform .95s var(--ease),filter .8s}.ring-stage{display:grid;place-items:center;position:relative;width:min(240px,65vw);aspect-ratio:1;margin:0 auto 14px;filter:drop-shadow(0 23px 28px #37081466);animation:ringFloat 4.5s ease-in-out infinite}.ring-stage img{position:relative;z-index:2;width:100%;height:100%;object-fit:contain}.ring-halo{position:absolute;inset:18%;border-radius:50%;background:radial-gradient(circle,#ffe5a1c0,#f0be5c33 50%,transparent 72%);filter:blur(8px);animation:haloPulse 5s ease-in-out infinite}.open-label{display:flex;align-items:center;justify-content:center;gap:11px;width:max-content;max-width:100%;margin:auto;padding:14px 19px;border:1px solid #efd7a799;border-radius:99px;background:linear-gradient(130deg,#8c3651,#431020);box-shadow:0 10px 25px #43102040;color:var(--ivory);font:600 10px/1.6 var(--sans);letter-spacing:.05em}.open-label>span{font-size:16px}.gate.unsealed .ring-stage{animation:ringCommit .8s var(--ease) forwards}.gate.unsealed .gate-intro,.gate.unsealed .gate-hint,.gate.unsealed .gate-frame{opacity:0;transform:translateY(-10px);pointer-events:none}.gate.opening .ring-button{opacity:0;transform:translate(-50%,-58%) scale(.76);filter:blur(3px);pointer-events:none}.gate-reveal{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;color:var(--wine);text-align:center;background:linear-gradient(#fffaf380,#fffaf350),url('assets/wedding-arch.webp') center/cover}.gate-reveal>*{opacity:0;transform:translateY(20px);transition:opacity 1s .65s,transform 1.3s .65s var(--ease)}.gate.opening .gate-reveal>*{opacity:1;transform:none}.gate-reveal>span,.gate-reveal>small{font:600 11px var(--sans);letter-spacing:.17em}.gate-reveal strong{font:italic 500 clamp(65px,10vw,100px)/.95 var(--serif);text-shadow:0 2px 25px #fff}.gate-sparkles{position:absolute;z-index:9;top:55%;left:50%;width:260px;height:260px;transform:translate(-50%,-50%);pointer-events:none}.gate-sparkles i{position:absolute;top:50%;left:50%;width:4px;height:4px;opacity:0;background:var(--gold-light);border-radius:50%;box-shadow:0 0 11px #ffe59f}.gate.unsealed .gate-sparkles i{animation:sparkleBurst 1.4s ease-out both}.gate-sparkles i:nth-child(1){--x:-120px;--y:-84px}.gate-sparkles i:nth-child(2){--x:-96px;--y:102px;animation-delay:.1s}.gate-sparkles i:nth-child(3){--x:120px;--y:-98px;animation-delay:.08s}.gate-sparkles i:nth-child(4){--x:132px;--y:82px;animation-delay:.16s}.gate-sparkles i:nth-child(5){--x:-28px;--y:-143px;animation-delay:.12s}.gate-sparkles i:nth-child(6){--x:36px;--y:138px;animation-delay:.22s}.gate-sparkles i:nth-child(7){--x:-150px;--y:12px;animation-delay:.18s}.gate-sparkles i:nth-child(8){--x:151px;--y:-8px;animation-delay:.24s}
.toolbar{position:fixed;z-index:30;top:max(12px,env(safe-area-inset-top));left:14px;right:14px;display:flex;justify-content:space-between;align-items:center;pointer-events:none;animation:toolbarIn .8s var(--ease)}.toolbar-right{display:flex;gap:7px}.tool-button{pointer-events:auto;display:flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:8px 12px;border:1px solid #efd7a799;border-radius:99px;background:#58152bd9;backdrop-filter:blur(10px);box-shadow:0 8px 22px #43102024;color:var(--ivory);transition:background .35s,transform .35s}.tool-button b{font:600 9px var(--sans)}.tool-button>span{font-size:18px;line-height:1}.tool-button:hover{background:#70213b}.music-button.playing>span{animation:note 2.5s ease-in-out infinite}.section-nav{position:fixed;z-index:25;top:50%;right:9px;transform:translateY(-50%);display:flex;flex-direction:column;gap:1px}.section-nav a{width:25px;height:28px;display:grid;place-items:center}.section-nav a::before{content:'';width:6px;height:6px;background:#70213b44;border-radius:50%;box-shadow:0 0 0 1px #fff8;transition:transform .5s,background .5s}.section-nav a[aria-current]::before{background:var(--wine);transform:scale(1.65)}
.petals,.light-specks{position:fixed;z-index:10;inset:0;pointer-events:none;overflow:hidden;opacity:.48;visibility:hidden}.invitation-open .petals,.invitation-open .light-specks{visibility:visible}.petal{position:absolute;top:-8vh;width:8px;height:12px;border-radius:70% 30% 65% 35%;background:linear-gradient(145deg,#f9d9d8,#b76776);animation:petalFall linear infinite}.light-speck{position:absolute;bottom:-4vh;width:3px;height:3px;border-radius:50%;background:#efd7a7;box-shadow:0 0 8px #ffdf94;animation:speckRise linear infinite}
/* Accessible modal, with the same transition in both directions. */
.lightbox{position:fixed;inset:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;border:0;padding:36px;background:transparent;color:var(--ivory);overflow:auto;opacity:0;transition:opacity .4s}.lightbox[open]{display:grid;place-items:center}.lightbox::backdrop{background:#230811e8;backdrop-filter:blur(12px);opacity:0;transition:opacity .4s}.lightbox.is-open{opacity:1}.lightbox.is-open::backdrop{opacity:1}.lightbox-frame{position:relative;width:min(950px,100%);padding:12px;border:1px solid #efd7a76b;border-radius:24px 6px;background:linear-gradient(145deg,#521629,#290a14);box-shadow:0 35px 100px #0005;transform:translateY(24px) scale(.97);transition:transform .6s var(--ease)}.lightbox.is-open .lightbox-frame{transform:none}.lightbox-picture{height:min(70dvh,700px);display:grid;place-items:center;overflow:hidden;border-radius:15px 3px;background:#2e0e1980}.lightbox-picture img{width:100%;height:100%;object-fit:contain;transition:opacity .22s,transform .45s var(--ease)}.lightbox-picture.changing img{opacity:0;transform:scale(.98)}.lightbox-close{position:absolute;z-index:3;right:20px;top:20px;width:44px;height:44px;border:1px solid #efd7a780;border-radius:50%;background:#381020d9;backdrop-filter:blur(8px);color:var(--ivory);font:500 30px var(--sans)}.lightbox-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 7px 6px;text-align:center}.lightbox-footer p{margin:0;font-size:26px;font-style:italic;line-height:1.1}.lightbox-footer span{display:block;margin-top:8px;font:600 9px var(--sans);letter-spacing:.13em;color:var(--gold-light)}.lightbox-footer button{flex:none;width:44px;height:44px;border:1px solid #efd7a755;border-radius:50%;background:#ffffff08;font-size:24px;color:var(--ivory)}.toast{position:fixed;z-index:150;left:50%;bottom:max(24px,env(safe-area-inset-bottom));width:max-content;max-width:88vw;padding:13px 20px;border:1px solid #efd7a780;border-radius:24px;background:#431020ee;color:var(--ivory);box-shadow:0 12px 30px #0003;font:600 11px/1.6 var(--sans);text-align:center;opacity:0;transform:translate(-50%,22px);transition:opacity .4s,transform .5s var(--ease);pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}
@keyframes arrowFloat{50%{transform:translateY(5px)}}@keyframes cardArrive{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}@keyframes digitTick{from{opacity:.35;transform:translateY(-5px)}to{opacity:1;transform:none}}@keyframes dateHeartbeat{50%{box-shadow:0 5px 17px #70213b38,0 0 0 6px #b8894f12}}@keyframes goldSweep{0%,20%{transform:translateX(0) rotate(20deg);opacity:0}35%{opacity:.65}65%,100%{transform:translateX(620%) rotate(20deg);opacity:0}}@keyframes silkDrift{to{transform:rotate(5deg) scale(1.08);opacity:.35}}@keyframes lakeGlow{to{opacity:.65;transform:scaleX(1.15)}}@keyframes waterFlow{to{background-position:90px 31px}}@keyframes waterShimmer{to{opacity:.25;transform:scaleX(2.7) translateY(12px)}}@keyframes swanSwim{from{transform:translate3d(0,0,0)}to{transform:translate3d(var(--swim-x),var(--swan-y),0)}}@keyframes swanBreathe{50%{transform:translateY(3px) rotate(.4deg)}}@keyframes swanBreatheReverse{50%{transform:scaleX(-1) translateY(3px) rotate(-.5deg)}}@keyframes wakeExpand{0%{transform:scale(.6);opacity:0}25%{opacity:.55}100%{transform:scale(1.45,1.7);opacity:0}}@keyframes venueCinema{to{transform:scale(1.055) translateY(-.6%)}}@keyframes ringFloat{50%{transform:translateY(-6px) rotate(-.5deg)}}@keyframes haloPulse{50%{opacity:.65;transform:scale(1.12)}}@keyframes ringCommit{45%{transform:translateY(-12px) scale(1.07)}to{transform:scale(.96);filter:brightness(1.16) drop-shadow(0 0 25px #ffdc9180)}}@keyframes sparkleBurst{0%{opacity:0;transform:scale(.3)}25%{opacity:1}100%{opacity:0;transform:translate(var(--x),var(--y)) scale(1.2)}}@keyframes toolbarIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}@keyframes note{50%{transform:rotate(10deg);color:var(--gold-light)}}@keyframes petalFall{0%{transform:translate3d(0,-8vh,0) rotate(0) scale(var(--scale))}50%{transform:translate3d(var(--drift-mid),55vh,0) rotate(200deg) scale(var(--scale))}100%{transform:translate3d(var(--drift),112vh,0) rotate(440deg) scale(var(--scale))}}@keyframes speckRise{0%{opacity:0;transform:translate3d(0,5vh,0)}20%{opacity:.65}100%{opacity:0;transform:translate3d(var(--drift),-105vh,0)}}
/* Small screens retain every section; the gallery becomes a swipeable strip. */
@media(min-width:1000px){.hero-scene,.final-scene{background-size:auto 150%;background-color:#f5e3d5}.hero-scene{min-height:1120px}.names{font-size:68px}.names .couple{flex-direction:row;gap:17px}.names .couples-join{margin:27px 0}.hero-content{width:min(920px,100%)}.hero-scene{padding-bottom:360px}.swan-a{left:17%}.swan-b{right:15%}}
@media(max-width:720px){.scene{padding:83px 25px 65px}.hero-scene{min-height:1080px;padding:99px 20px 290px}.names{font-size:52px}.bismillah{font-size:23px;margin-bottom:18px}.hero-content>.eyebrow{margin-bottom:22px}.hero-content::before{inset:-30px -10px}.lake{height:315px}.swan-a{left:-7%;bottom:12%;width:65vw;--swim-x:-7vw}.swan-b{right:-7%;bottom:18%;width:56vw;--swim-x:8vw}.lake-caption{font-size:18px;bottom:24px}.wedding-scene{min-height:970px}.invitation-card{padding:33px 26px 27px;font-size:23px}.invitation-card .guest-greeting{font-size:27px}.invitation-card .couple-inline{font-size:21px}.family-sign strong{font-size:19px}.symbol-gallery{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;width:calc(100% + 50px);margin-left:-25px;margin-right:-25px;padding:8px 26px 30px;gap:20px;scrollbar-width:none}.symbol-gallery::-webkit-scrollbar{display:none}.symbol-card{flex:0 0 min(76vw,340px);scroll-snap-align:center}.symbol-card:nth-child(2){margin-top:0}.gallery-hint{margin-top:2px}.venue-visual{border-radius:28px 6px}.venue-visual::after{inset:9px;border-radius:20px 3px}.venue-visual figcaption{bottom:15px;padding:8px 15px;font-size:10px}.venue-pin{width:34px;height:34px;right:14px;bottom:12px}.final-scene{min-height:1020px;padding-bottom:295px}.final-scene .script-heading{font-size:42px}.section-nav{display:none}.lightbox{padding:16px}.lightbox-picture{height:min(69dvh,650px)}.lightbox-footer p{font-size:23px}.lightbox-close{right:18px;top:18px}.gate-intro{top:11%}.gate-names{font-size:30px}.gate-intro .eyebrow{font-size:9px}.gate-frame{border-radius:110px 110px 8px 8px}.gate-hint{bottom:8%}.ring-stage{width:230px}.toolbar{left:10px;right:10px}.tool-button{padding-inline:10px}.tool-button b{font-size:8px}}
@media(max-width:390px){.scene{padding-inline:22px}.hero-scene{min-height:1030px;padding-top:90px;padding-bottom:270px}.names{font-size:46px}.couples-join{margin:16px 0!important}.script-heading{font-size:36px}.eyebrow{font-size:10px}.invitation-card{padding:30px 19px 25px;font-size:21px}.invitation-card .guest-greeting{font-size:23px}.invitation-card .couple-inline{font-size:18px;letter-spacing:0}.invitation-card .salaam{font-size:12px}.family-sign strong{font-size:17px}.calendar-card{padding:23px 15px}.calendar-grid{gap:5px}.days time,.days>span{height:33px;font-size:19px}.countdown strong{font-size:36px}.countdown span{font-size:8px}.event-card{padding:23px 16px}.event-line{grid-template-columns:80px 24px 1fr}.event-line time{font-size:32px}.event-line strong{font-size:24px}.event-line small{font-size:16px}.gate-names{font-size:26px}.gate-intro{top:10%}.ring-stage{width:205px}.open-label{font-size:9px;padding:13px 15px}.gate-hint p{font-size:23px}.gate-hint>span{font-size:9px}.primary-button{font-size:10px;padding-inline:19px}.brand-note{font-size:9px}.venue-pin{display:none}.venue-visual figcaption{bottom:12px;font-size:9px}.toolbar{left:8px;right:8px}.tool-button{padding:8px 10px}.motion-button b{display:none}.section-note{font-size:20px}.paper-scene::before,.blush-scene::before,.symbols-scene::before{inset:13px}.paper-scene::after,.blush-scene::after,.symbols-scene::after{top:6px}}
@media(max-height:650px){.gate-intro{top:8%}.gate-names{font-size:25px}.gate-intro .eyebrow{margin-bottom:10px;font-size:8px}.gate-hint{bottom:6%}.gate-hint p{font-size:21px;margin-bottom:10px}.ring-stage{width:min(190px,42vh);margin-bottom:3px}.ring-button{top:56%}.gate-frame{inset:12px max(12px,calc((100vw - 710px)/2))}.gate-hint>span{font-size:9px}}
@media(max-height:470px) and (min-width:600px){.gate-intro{left:7%;right:auto;top:28%;width:43%}.gate-names{font-size:27px}.ring-button{left:74%;top:45%;width:230px}.ring-stage{width:155px}.gate-hint{left:54%;right:3%;bottom:7%}.gate-hint p{display:none}.gate-frame{border-radius:50px 50px 8px 8px}}
/* Stop continuous decoration off screen, in the background, or on request. */
.scene:not(.in-view) .lake *,.scene:not(.in-view) .silk-light,.scene:not(.in-view) .wedding-light,.scene:not(.in-view) .venue-visual img,.scene:not(.in-view) .venue-glint{animation-play-state:paused}body:not(.invitation-open) .petals *,body:not(.invitation-open) .light-specks *,body.page-hidden *,body.page-hidden *::before,body.page-hidden *::after,body.motion-paused *,body.motion-paused *::before,body.motion-paused *::after{animation-play-state:paused!important}body.motion-paused{scroll-behavior:auto}.motion-paused .content.reveal{transition-duration:.15s;filter:none}.motion-paused .gate *,.motion-paused .lightbox *{transition-duration:.15s!important}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.1s!important;scroll-behavior:auto!important}.petals,.light-specks{display:none}.content.reveal{filter:none;transform:none}.gate.opening .envelope-left{transform:translateX(-110%)}.gate.opening .envelope-right{transform:translateX(110%)}.swan{will-change:auto}}
.gate.closing .ring-button{opacity:0;pointer-events:none}.copy-buffer{position:fixed;top:-1000px;left:0;width:1px;height:1px;opacity:0}.motion-paused .symbol-card{animation:none!important}.motion-paused .symbol-card{opacity:1;transform:none}
.swan img{mask-image:linear-gradient(#000 0 76%,transparent 100%);-webkit-mask-image:linear-gradient(#000 0 76%,transparent 100%)}
.motion-paused .toolbar,.motion-paused .tick{animation:none!important;opacity:1;transform:none}
/* Azizbek & Mohiruy — fotiha premium motion refinement. */
.pure-wish{margin-top:22px!important;padding-top:18px;border-top:1px solid rgba(167,122,65,.25);color:var(--gold);font-size:1.08em;font-style:italic}
.fotiha-motion{position:absolute;z-index:2;inset:0;overflow:hidden;pointer-events:none;opacity:.72}
.promise-rings{position:absolute;top:20%;left:50%;width:190px;height:125px;transform:translateX(-50%);animation:promiseFloat 9s ease-in-out infinite}
.promise-rings>i{position:absolute;top:18px;width:76px;height:98px;border:2px solid rgba(167,122,65,.32);border-radius:50%;box-shadow:inset 0 0 0 1px rgba(255,250,243,.44),0 0 26px rgba(239,215,167,.14)}
.promise-rings>i:first-child{left:30px;transform:rotate(-25deg)}
.promise-rings>i:nth-child(2){right:30px;transform:rotate(25deg)}
.promise-rings>b{position:absolute;left:50%;top:52px;color:rgba(167,122,65,.58);font-size:16px;transform:translate(-50%,-50%);animation:promiseSpark 4.8s ease-in-out infinite}
.promise-glints{position:absolute;inset:0}.promise-glints i{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--gold-light);box-shadow:0 0 16px rgba(239,215,167,.8);animation:glintPulse 6s ease-in-out infinite}
.promise-glints i:nth-child(1){top:17%;left:29%;animation-delay:-1s}.promise-glints i:nth-child(2){top:27%;right:26%;animation-delay:-3.4s}.promise-glints i:nth-child(3){top:45%;left:20%;animation-delay:-4.8s}.promise-glints i:nth-child(4){top:40%;right:18%;animation-delay:-2.1s}
.hero-scene .fotiha-motion{mask-image:linear-gradient(#000 0 62%,transparent 82%);-webkit-mask-image:linear-gradient(#000 0 62%,transparent 82%)}
.final-scene .promise-rings{top:15%}.final-scene .promise-glints i:nth-child(3),.final-scene .promise-glints i:nth-child(4){top:34%}
.venue-visual img{object-position:center 34%;filter:saturate(.94) contrast(1.045) brightness(1.035) sepia(.035)}
.venue-card img{object-position:center 37%;filter:saturate(.92) contrast(1.04) brightness(1.025) sepia(.04)}
.venue-visual::before{background:linear-gradient(180deg,rgba(255,248,228,.09),transparent 44%,rgba(54,13,28,.50)),radial-gradient(circle at 72% 12%,rgba(255,226,164,.12),transparent 42%)}
@keyframes promiseFloat{0%,100%{transform:translateX(-50%) translateY(0) rotate(-1deg)}50%{transform:translateX(-50%) translateY(-8px) rotate(1deg)}}
@keyframes promiseSpark{0%,100%{opacity:.32;transform:translate(-50%,-50%) scale(.78) rotate(0)}50%{opacity:.9;transform:translate(-50%,-50%) scale(1.18) rotate(90deg)}}
@keyframes glintPulse{0%,100%{opacity:.12;transform:scale(.55)}45%{opacity:.78;transform:scale(1.25)}}
@media(max-width:720px){.promise-rings{top:18%;width:155px;height:105px;opacity:.75}.promise-rings>i{width:63px;height:81px}.promise-rings>i:first-child{left:26px}.promise-rings>i:nth-child(2){right:26px}.promise-rings>b{top:45px}.venue-visual img{object-position:center 30%}.venue-card img{object-position:center 34%}}
@media(prefers-reduced-motion:reduce){.fotiha-motion{opacity:.38}.promise-rings{transform:translateX(-50%)}}