:root{--paper:#fbf2e5;--cream:#f1dfbd;--ink:#5a330c;--gold:#a96c20;--line:#c89c61;--body:'Nunito',sans-serif;--script:'Lobster',Georgia,serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0;color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.65;background:#e9dcc7;background-image:radial-gradient(ellipse at 15% 10%,#f8efdf 0,transparent 45%),radial-gradient(ellipse at 90% 80%,#e2cfae 0,transparent 45%)}a{color:inherit}button,input,textarea,select{font:inherit}a:focus-visible,button:focus-visible{outline:3px solid var(--gold);outline-offset:5px}.invitation{width:min(100%,570px);margin:auto;background:var(--paper);box-shadow:0 0 80px #5a330c1a;overflow:hidden}.paper{position:relative;padding:64px 34px;background:radial-gradient(ellipse at 0 5%,#edd8b350,transparent 42%),radial-gradient(ellipse at 100% 100%,#e8c99835,transparent 38%),var(--paper)}.paper:before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.24;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.2' filter='url(%23n)'/%3E%3C/svg%3E")}.paper>*{position:relative}.cover{min-height:100svh;display:flex;flex-direction:column;justify-content:center;text-align:center;padding-top:48px;padding-bottom:28px}.cover-frame{border:1px solid var(--line);border-radius:180px 180px 18px 18px;padding:52px 14px 34px;outline:1px solid #c89c6145;outline-offset:8px}.eyebrow,.tiny-label{font-size:.875rem;font-weight:700;letter-spacing:.17em}.eyebrow{margin:0 0 18px}.cover-title{font-size:1.4rem;line-height:1.4;margin:0}.ornament{font-size:2.25rem;color:var(--gold);margin:10px auto;line-height:1.3}.script{font-family:var(--script);font-weight:400;line-height:1.18}.cover-name{font-size:clamp(2.8rem,9vw,4rem);margin:16px 0 22px}.cover-date{font-size:1.15rem;font-weight:600;letter-spacing:.12em;margin:0 0 30px}.cover-date span{color:var(--gold);padding:0 10px}.guest-label{font-size:.875rem;margin:0 0 4px}.guest-name{font-weight:700;margin:0 0 20px}.button{min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:20px;padding:12px 23px;background:var(--ink);color:#fff7ea;border:1px solid var(--ink);border-radius:30px;text-decoration:none;font-size:.9375rem;font-weight:700;cursor:pointer;transition:background .2s,transform .2s}.button:hover{background:#754916;transform:translateY(-2px)}.cover-parents{margin:28px 0 0;font-size:.9375rem}.opening{text-align:center;padding-top:68px;padding-bottom:68px}.arabic{font-family:'Noto Naskh Arabic',serif;font-size:1.9rem;color:#8d570e;line-height:1.7;margin:0 0 32px}.greeting{font-weight:700;line-height:1.65;margin:0 0 26px}.prose{max-width:430px;margin:0 auto;line-height:1.85}.name-frame{padding:34px 12px;margin:34px 0;border-top:1px solid #c89c6170;border-bottom:1px solid #c89c6170}.name-frame h2{font-size:clamp(2.65rem,8vw,3.7rem);margin:14px 0 22px}.name-frame p{margin:0}.parents{font-weight:700}.tiny-label{color:#8e5e25;font-size:.8125rem}@media(max-width:360px){.paper{padding-left:23px;padding-right:23px}.cover-frame{padding-left:8px;padding-right:8px}.cover-name{font-size:2.6rem}.cover-date{letter-spacing:.04em}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}}
/* The invitation is a narrow, warm-paper storybook, like the supplied reference. */
.paper .reference-cloud{position:absolute;z-index:2;top:16px;width:86px;height:75px;overflow:hidden;pointer-events:none;mix-blend-mode:multiply}.reference-cloud img{position:absolute;width:565px;height:auto;max-width:none;left:0;top:-4px}.cloud-left{left:0;transform:rotate(-5deg)}.cloud-right{right:0;transform:scaleX(-1) rotate(-4deg)}
[hidden]{display:none!important}.icon{width:21px;height:21px;flex:none}.cover{padding:26px 28px 12px}.cover-frame{padding:34px 14px 26px}.eyebrow{margin-bottom:14px}.cover-title{font-size:1.25rem}.cover .ornament{font-size:1.6rem;margin:9px auto}.cover-name{font-size:clamp(2.6rem,8.6vw,3.55rem);margin:12px 0 18px}.cover-date{margin-bottom:22px}.cover-parents{margin:22px 0 0}.animal-strip{position:relative;width:calc(100% + 28px);margin:24px -14px 0;aspect-ratio:3/1;overflow:hidden;pointer-events:none}.animal-strip img{position:absolute;width:100%;height:auto;max-width:none;left:0;top:50%;transform:translateY(-55%)}.cover-animals{margin-top:12px}.text-link{display:inline-flex;align-items:center;gap:14px;margin-top:18px;font-size:.9375rem;text-decoration:none;border-bottom:1px solid var(--line);padding:4px 0}.text-link:hover{color:var(--gold)}.section-title{font-size:clamp(2.3rem,7vw,3.2rem);margin:14px 0 34px}.event,.location,.closing{text-align:center}.event{background:radial-gradient(ellipse at 0 0%,#fbf2e580,transparent 48%),#f2e3cb;padding-top:62px}.event .eyebrow,.location .eyebrow{font-size:.8125rem;letter-spacing:.14em}.event-frame{border:1px solid var(--gold);border-radius:160px 160px 24px 24px;padding:40px 18px 30px;outline:1px solid #a96c2033;outline-offset:7px;background:#fbf2e580}.event-icon{width:35px;height:35px;color:var(--gold)}.day-name{margin:18px 0 0;font-size:1.2rem;font-weight:600}.date-number{font-family:Georgia,serif;font-size:5.25rem;line-height:1.25;margin:0;color:#75440d}.month-name{margin:0;font-size:1.15rem;font-weight:700}.rule{width:52px;height:1px;background:var(--gold);display:block;margin:26px auto}.event-time{font-size:1.15rem;font-weight:700;margin:0}.time-zone{font-size:.875rem;margin:3px 0 0;color:#805725}.event-address{margin:24px 0 0}.event-address p{margin:0 0 7px}.countdown-caption{margin:42px 0 14px;font-weight:600}.countdown{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:365px;margin:auto}.countdown>div{border:1px solid #bd925958;border-radius:14px;background:#fbf2e590;padding:10px 3px}.countdown span{display:block;font-family:Georgia,serif;font-size:1.7rem;line-height:1.4;font-variant-numeric:tabular-nums}.countdown small{font-size:.875rem;display:block;color:#805725}.location{padding-top:66px;padding-bottom:64px}.location-frame{padding:30px 17px;border:1px solid #c89c6170;border-radius:24px}.location-icon{height:43px;width:43px;color:var(--gold)}.location-frame h3{font-size:1.2rem;font-weight:700;line-height:1.6;margin:18px 0 14px}.location-frame p{margin:0 0 24px}.closing{padding-top:18px;padding-bottom:130px}.closing .section-title{margin-bottom:22px}.prayer{font-style:italic}.thanks{margin-top:20px;margin-bottom:28px}.closing .greeting{margin-bottom:30px}.closing-label{margin:0}.closing-parents{font-size:clamp(1.85rem,6vw,2.5rem);margin:8px 0 4px;line-height:1.4}.footer-note{font-size:.8125rem;line-height:1.7;margin:22px 0 0;color:#805725}.bottom-nav{position:fixed;bottom:max(16px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);z-index:10;display:flex;width:min(calc(100% - 40px),365px);justify-content:space-around;padding:9px 10px;background:#fff8ecf2;backdrop-filter:blur(12px);border:1px solid #d4b483;border-radius:48px;box-shadow:0 4px 24px #6a441e20}.bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;text-decoration:none;color:#805725;min-width:64px;min-height:48px;border-radius:28px;padding:7px 6px}.bottom-nav span{font-size:.875rem}.bottom-nav a:hover,.bottom-nav a[aria-current]{background:var(--ink);color:var(--paper)}.invitation-open .opening{padding-top:62px}#child-name:focus{outline:none}.guest-name{overflow-wrap:anywhere}@media(max-width:380px){.cover{padding-left:24px;padding-right:24px}.cover-frame{padding-top:32px}.cover-name{font-size:2.6rem}.cover-date span{padding:0 7px}.section-title{font-size:2.2rem}.event-frame{padding-left:12px;padding-right:12px}.bottom-nav{width:calc(100% - 28px)}.bottom-nav a{min-width:56px}.arabic{font-size:1.7rem}}@media(min-width:800px){.cover{min-height:900px}.invitation{margin:30px auto;border:1px solid #d7bc91;border-radius:14px}.cover-frame{padding-top:44px}.cover-name{font-size:3.55rem}}@media(prefers-reduced-motion:no-preference){.invitation-open main{animation:enter .65s ease both}@keyframes enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}}
