@font-face{font-family:Amiri;src:url('assets/amiri.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Amiri;src:url('assets/amiri-bold.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:Naskh;src:url('assets/naskh.ttf') format('truetype');font-weight:400;font-display:swap}
:root{--velvet:#300f20;--plum:#501d35;--gold:#d9bd81;--paper:#fff7e8;--ink:#382330;--muted:#c9b1b8;--line:rgba(217,189,129,.33);--display:Amiri,'Times New Roman',serif;--body:Naskh,serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--velvet);color:var(--paper);font-family:var(--body);font-size:19px;line-height:1.8;overflow:hidden}body.opened{overflow:auto}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:6px}button{touch-action:manipulation}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--display);font-weight:400}svg{display:block;width:24px;height:24px}.svg-library{position:absolute;width:0;height:0;overflow:hidden}.flourish{width:230px;height:54px;margin:auto;color:var(--gold)}main{visibility:hidden}body.opened main{visibility:visible}.entrance{position:fixed;inset:0;z-index:30;display:grid;place-items:center;isolation:isolate;overflow:hidden;min-height:100svh;background:var(--velvet)}.curtain{position:absolute;inset-block:0;width:50.1%;z-index:-1;background:repeating-linear-gradient(90deg,transparent 0%,rgba(0,0,0,.27) 5%,rgba(115,47,74,.28) 9%,rgba(0,0,0,.3) 14%,transparent 18%),linear-gradient(110deg,#501d35,#2a0b1a 55%,#49152d);transition:transform 1.8s cubic-bezier(.65,0,.2,1);will-change:transform}.curtain-right{right:0;border-left:1px solid rgba(217,189,129,.45);box-shadow:-12px 0 45px #0e000a55}.curtain-left{left:0;border-right:1px solid rgba(217,189,129,.45)}.entrance:after{content:'';position:absolute;inset:18px;border:1px solid var(--line);pointer-events:none;z-index:-1;transition:opacity .4s}.entrance-content{text-align:center;padding:42px 24px;width:100%;max-width:600px;transition:opacity .5s,transform .8s}.opening-line{font-size:20px;color:var(--gold);margin-bottom:19px}.entrance h1{font-size:clamp(44px,10vw,68px);line-height:1.7;white-space:nowrap}.entrance h1>span{font-size:30px;color:var(--gold);padding-inline:7px}.entrance-date{color:var(--muted);font-size:18px;margin:8px 0 32px}.seal-button{display:flex;flex-direction:column;align-items:center;margin:auto;background:none;border:0;color:var(--gold);padding:8px 16px;min-width:230px}.seal{display:grid;place-items:center;width:100px;height:100px;border-radius:50%;position:relative;color:#442321;background:radial-gradient(ellipse at 32% 22%,#f7df9e,#c9a765 55%,#97723c);box-shadow:0 0 0 5px #a8854a,0 0 0 6px #e2c58b,0 9px 32px #10000999,inset 0 0 10px #6e4e24;border:1px solid #ffe4a6;transition:transform .25s}.seal:before{content:'';position:absolute;inset:7px;border:1px solid #66442266;border-radius:50%}.seal>span{font-family:var(--display);font-size:51px;line-height:1;padding-bottom:13px;text-shadow:0 1px 1px #fff4b9}.seal-m{display:inline-block;transform:translate(6px,11px);margin-right:-10px}.seal-button:hover .seal{transform:scale(1.05)}.seal-button:active .seal{transform:scale(.97)}.open-label{font-size:18px;margin-top:26px}.sound-note{color:var(--muted);font-size:14px;margin-top:3px}.entrance-bottom{color:var(--muted);font-size:17px;margin-top:34px}.entrance.opening{background:transparent;pointer-events:none}.entrance.opening .entrance-content{opacity:0;transform:scale(1.06)}.entrance.opening:after{opacity:0}.entrance.opening .curtain-right{transform:translateX(102%)}.entrance.opening .curtain-left{transform:translateX(-102%)}.entrance[hidden]{display:none}
.hero{min-height:100svh;min-height:max(800px,100svh);position:relative;isolation:isolate;display:grid;place-items:center;overflow:hidden;padding:72px 24px 84px;background:radial-gradient(ellipse at 50% 40%,#60233c55,transparent 66%),var(--velvet)}.hero-arch{position:absolute;inset:34px max(28px,calc((100% - 800px)/2)) -46px;border:1px solid var(--line);border-radius:50% 50% 0 0 / 33% 33% 0 0;z-index:-1}.hero-arch:before{content:'';position:absolute;inset:10px;border:1px solid #d9bd811a;border-radius:inherit}.hero-arch:after{content:'';position:absolute;width:9px;height:9px;top:-5px;left:calc(50% - 5px);background:var(--gold);transform:rotate(45deg)}.hero-arch>div{position:absolute;inset:27px 22px -20px;border:1px solid #d9bd8112;border-radius:inherit}.corner{position:absolute;top:20px;width:55px;height:55px;border-top:1px solid var(--line)}.corner-tr{right:20px;border-right:1px solid var(--line)}.corner-tl{left:20px;border-left:1px solid var(--line)}.hero-content{text-align:center;width:100%;max-width:560px}.bismillah{font-family:var(--display);font-size:22px;color:var(--gold);margin-bottom:25px}.hero-flourish{width:185px;height:43px;margin-bottom:20px}.hero-intro{font-family:var(--display);font-size:27px;color:var(--paper);margin-bottom:22px}.couple-names{position:relative;display:flex;flex-direction:column;align-items:center;font-size:clamp(76px,19vw,120px);line-height:1.23;color:var(--gold);text-shadow:0 2px 28px #d9bd811c}.name-join{font-size:40px;line-height:.9;color:var(--muted);font-weight:400;transform:rotate(-12deg);margin-top:5px}.bride{margin-top:-4px}.hero-vow{font-size:19px;margin-top:30px;color:var(--paper)}.date-ornament{display:flex;align-items:center;justify-content:center;gap:18px;margin:25px 0 20px;color:var(--gold)}.date-ornament p{font-family:Georgia,serif;font-size:19px;letter-spacing:3px;white-space:nowrap}.date-ornament>span{height:1px;width:35px;background:var(--line)}.scroll-cue{text-decoration:none;display:flex;align-items:center;flex-direction:column;color:var(--muted);font-size:16px;min-height:52px;padding:5px 10px}.scroll-cue svg{width:18px;height:18px;fill:none;stroke:var(--gold);stroke-width:1;margin-top:6px}.hero-bottom-ornament{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);color:var(--gold);font-size:38px;line-height:1}.opened .hero-content>*{animation:hero-reveal 1.1s both;animation-delay:.65s}.opened .hero-content .couple-names{animation-delay:.9s}.opened .hero-content .hero-vow{animation-delay:1.2s}.opened .hero-content .date-ornament{animation-delay:1.4s}.opened .hero-content .scroll-cue{animation-delay:1.6s}@keyframes hero-reveal{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.letter-section{background:var(--paper);color:var(--ink);position:relative;padding:64px 24px 74px;text-align:center}.paper-edge{position:absolute;inset:0 0 auto;height:6px;background:linear-gradient(90deg,#b28b4b,#e4c99a 30%,#ae8543 60%,#e4c99a)}.letter-inner{max-width:650px;margin:auto;border:1px solid #ab874c40;padding:32px 19px 40px;position:relative}.letter-inner:before,.letter-inner:after{content:'✧';position:absolute;background:var(--paper);color:#8e6939;padding:0 8px;left:50%;transform:translateX(-50%);line-height:1}.letter-inner:before{top:-10px}.letter-inner:after{bottom:-10px}.letter-section .flourish{color:#96733d;width:200px;margin-bottom:18px}.invocation{font-family:var(--display);font-size:20px;line-height:2;color:#755331}.letter-section h2{font-size:39px;margin:28px 0 13px}.invitation-text{font-size:19px;line-height:2.1}.families{margin:25px auto;display:flex;flex-direction:column;align-items:center;gap:14px}.families p{font-family:var(--display);font-size:26px;line-height:1.7}.families p>span{display:block;font-family:var(--body);font-size:16px;color:#795b56}.families svg{width:18px;height:18px;color:#92703b}.full-names{margin:25px 0;line-height:1.7}.full-names p{font-family:var(--display);font-size:34px;color:#6c293f}.full-names>span{font-size:17px;color:#795b56}.letter-closing{font-size:20px;line-height:2}.small-divider{display:flex;align-items:center;justify-content:center;gap:14px;color:#96733d;margin:29px 0;font-size:26px}.small-divider span{width:55px;height:1px;background:#ae8b4e55}.together-copy{font-size:18px;color:#684c51;line-height:2.1}
.celebration{text-align:center;padding:76px 24px 80px;background:radial-gradient(ellipse at 50% 20%,#60233c66,transparent 70%)}.section-star{width:28px;height:28px;color:var(--gold);margin:0 auto 19px}.celebration>p{font-size:18px;color:var(--muted)}.celebration h2{font-size:46px;color:var(--gold);margin-top:4px}.event-date{margin:23px 0 15px;display:flex;align-items:center;justify-content:center;gap:22px}.event-date strong{font-family:var(--display);font-size:80px;font-weight:400;line-height:1.2;border-inline:1px solid var(--line);padding:0 22px 6px;color:var(--gold)}.event-date>span{font-size:20px}.event-time{font-size:22px!important;color:var(--paper)!important}.event-time span{display:block;font-size:17px;color:var(--muted)}.countdown-wrap{margin:38px auto 31px;padding-top:27px;border-top:1px solid var(--line);max-width:420px}.countdown-wrap>p{font-size:19px;color:var(--gold)}.countdown{display:flex;align-items:baseline;justify-content:center;gap:12px;margin-top:15px}.countdown>div{display:flex;flex-direction:column;align-items:center;min-width:49px}.countdown strong{font-family:var(--display);font-size:41px;line-height:1.5;font-weight:400;font-variant-numeric:tabular-nums}.countdown span{font-size:15px;color:var(--muted)}.countdown i{font-style:normal;font-size:24px;color:#b19573}.button{display:inline-flex;align-items:center;justify-content:center;gap:12px;text-decoration:none;min-height:52px;padding:10px 22px;font-size:18px;transition:background .2s,transform .2s;border-radius:2px}.button:active{transform:scale(.98)}.button svg{width:21px;height:21px;flex-shrink:0}.button-outline{border:1px solid var(--gold);color:var(--gold)}.button-outline:hover{background:#d9bd8110}.button-gold{color:var(--velvet);background:var(--gold);border:1px solid var(--gold)}.button-gold:hover{background:#efdaa9}
.venue{padding:20px 24px 68px;text-align:center;max-width:680px;margin:auto}.venue-arch{width:105px;height:120px;border:1px solid var(--line);border-radius:55px 55px 0 0;display:grid;place-items:center;margin:0 auto 26px;position:relative}.venue-arch:before{content:'';position:absolute;inset:7px;border:1px solid #d9bd8120;border-radius:inherit}.venue-arch svg{width:33px;height:33px;color:var(--gold)}.venue-label{font-size:18px;color:var(--muted)}.venue h2{font-size:49px;color:var(--gold);margin-top:4px}.venue-address{font-size:21px;margin:10px 0 25px}.guest-notes{border-top:1px solid var(--line);margin:48px auto 0;padding-top:28px;max-width:410px}.guest-notes h3{font-size:28px;color:var(--gold);margin-bottom:11px}.guest-notes p{font-size:17px;line-height:2}.guest-notes .notes-thanks{color:var(--muted);font-size:16px;margin-top:13px}.closing{background:#240a17;text-align:center;padding:57px 24px 105px}.closing .flourish{width:190px}.closing-main{font-family:var(--display);font-size:36px;line-height:1.8;margin:15px 0 20px}.blessing{color:var(--muted);font-size:19px;line-height:2}.signature{font-family:var(--display);font-size:40px;color:var(--gold);margin:26px 0 0}.signature span{font-size:26px;margin-inline:8px}.closing-date{font-size:15px;color:var(--muted)}.text-button{background:none;border:0;border-bottom:1px solid #d9bd8160;color:var(--gold);font-size:16px;min-height:44px;margin-top:24px;padding:4px 5px}.music-toggle{position:fixed;bottom:max(18px,env(safe-area-inset-bottom));left:18px;z-index:10;background:#300f20f2;color:var(--paper);border:1px solid var(--line);border-radius:28px;min-height:46px;padding:9px 13px;display:flex;align-items:center;gap:8px;box-shadow:0 3px 20px #0003;font-size:14px}.music-toggle[hidden]{display:none}.music-toggle>svg{width:19px;height:19px;color:var(--gold)}.sound-bars{display:flex;gap:3px;align-items:center;height:16px;margin-inline-start:2px}.sound-bars i{width:2px;background:var(--gold);height:4px;display:block}.music-toggle[aria-pressed=true] .sound-bars i{animation:sound .8s ease-in-out infinite alternate}.music-toggle[aria-pressed=true] .sound-bars i:nth-child(2){animation-delay:.3s}.music-toggle[aria-pressed=true] .sound-bars i:nth-child(3){animation-delay:.6s}@keyframes sound{to{height:15px}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.noscript-message{position:relative;padding:30px;text-align:center}
@media(min-width:760px){.hero{min-height:980px}.hero-arch{inset:36px max(50px,calc((100% - 760px)/2)) -40px}.couple-names{font-size:125px}.hero-intro{font-size:31px}.hero-vow{font-size:22px}.letter-section{padding:85px 40px}.letter-inner{padding:48px 45px 52px}.families{flex-direction:row;justify-content:center;gap:24px}.families p{font-size:25px}.families p:last-child{max-width:235px}.full-names p{font-size:40px}.entrance-content{padding:56px 24px}.entrance h1{font-size:74px}.entrance-date{margin-bottom:38px}.seal{width:110px;height:110px}.celebration{padding:85px 24px}.venue{padding-bottom:85px}.closing{padding-top:72px}.music-toggle{left:26px;bottom:26px}}
@media(max-width:359px){.entrance h1{font-size:43px}.opening-line{font-size:18px}.entrance-bottom{font-size:15px}.hero{padding-inline:16px}.hero-arch{inset-inline:17px}.hero-vow{font-size:17px}.letter-section{padding-inline:15px}.letter-inner{padding-inline:12px}.full-names p{font-size:30px}.families p{font-size:24px}.event-date{gap:12px}.event-date strong{padding-inline:17px}.event-date>span{font-size:18px}.countdown{gap:7px}.button{padding-inline:14px;font-size:16px}}
@media(max-height:730px) and (max-width:759px){.entrance-content{padding-block:28px}.opening-line{margin-bottom:8px}.entrance-date{margin:3px 0 19px}.seal{width:86px;height:86px}.seal>span{font-size:44px}.entrance-bottom{margin-top:21px}.entrance .flourish{height:40px}.entrance h1{font-size:52px}.open-label{margin-top:18px}.hero{min-height:760px;padding-top:65px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.curtain{will-change:auto}}
