@import url('https://fonts.googleapis.com/css2?family=Amiri:wght@400;700&family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Noto+Sans+Arabic:wght@400;500;600&display=swap');
.hero-content{width:100%;min-width:0;overflow-wrap:break-word}.hero-content h1{font-size:min(6.4rem,18vw,12svh)}
:root{--ivory:#f8f4ec;--paper:#e9e1d2;--gold:#897044;--gold-dark:#705b36;--ink:#3f392f;--muted:#746b5d;--line:#b6a17c66;--serif:'Cormorant Garamond',Georgia,serif;--arabic:'Amiri',serif;--sans:'Noto Sans Arabic',Tahoma,sans-serif;--ease:cubic-bezier(.22,.61,.36,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:5rem}body{margin:0;background:var(--ivory);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.85}body:not([data-state=WEDDING_SITE]){overflow:hidden}button,input,textarea,select{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--gold-dark);outline-offset:5px}button{color:inherit}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.skip-link{position:fixed;top:-100px;z-index:100;background:var(--ivory);padding:1rem}.skip-link:focus{top:0}.noscript{position:fixed;inset:10%;z-index:100;background:var(--ivory);padding:2rem}.opening{position:fixed;inset:0;z-index:30;background:var(--paper);opacity:1;transition:opacity .85s var(--ease);display:grid;place-items:center}.opening::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,#f4eddf,transparent 70%)}.opening.fading{opacity:0;pointer-events:none}.cinema{position:relative;width:100%;height:100%;max-width:650px;overflow:hidden}.poster,#opening-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}.poster{z-index:1}#opening-video{z-index:2;opacity:0}#opening-video.playing{opacity:1}.invitation-hit{position:absolute;inset:0;z-index:3;border:0;background:transparent;width:100%;padding:0;color:var(--gold-dark);display:flex;align-items:center;flex-direction:column;justify-content:space-between}.invitation-heading{position:absolute;top:10%;display:grid;gap:.3rem;font-family:var(--arabic);font-size:1.15rem}.monogram{font-family:var(--serif);font-size:2.4rem;letter-spacing:.16em}.monogram i{font-size:1.4rem;font-weight:400;letter-spacing:0}.tap-label{position:absolute;bottom:14%;display:grid;gap:.2rem;font-family:var(--arabic);font-size:1.5rem;animation:breathe 3.2s ease-in-out infinite}.tap-label small{font-family:var(--serif);font-size:.95rem;letter-spacing:.12em}.tap-line{width:2rem;height:1px;background:var(--gold);margin:.65rem auto}.invitation-hit.leaving{opacity:0;transition:opacity .3s;pointer-events:none}.buffer-message{position:absolute;z-index:4;bottom:20%;width:100%;text-align:center;font-family:var(--arabic);background:#f8f4ece6;margin:0;padding:.5rem}.skip-opening{position:absolute;z-index:4;bottom:max(1.2rem,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);border:0;border-bottom:1px solid var(--line);background:#f8f4ecdd;padding:.4rem 1rem;font-size:.85rem;white-space:nowrap}.hero{position:relative;min-height:100svh;display:grid;place-items:center;overflow:hidden;background:var(--paper)}.hero-paper{position:absolute;inset:0;margin:auto;max-width:650px;background:url('./media/hero-background.webp') center/cover no-repeat}.hero-content{position:relative;text-align:center;padding:7rem 1rem 8rem;opacity:0;transform:translateY(12px);transition:opacity 1.3s ease .15s,transform 1.3s var(--ease) .15s}.site-revealing .hero-content,body[data-state=WEDDING_SITE] .hero-content{opacity:1;transform:none}.eyebrow{font-family:var(--arabic);font-size:1.13rem;margin:0 0 2.1rem;color:#6b5b43}h1{font-family:var(--serif);font-size:clamp(4.5rem,17vw,6.8rem);font-weight:400;line-height:.92;margin:0;letter-spacing:-.035em;display:grid;color:#6e5835}h1 i{font-size:.4em;font-weight:400;margin:.25em 0;line-height:1}.fine-rule{width:42px;height:1px;background:var(--gold);margin:2rem auto 1.3rem}.wedding-date{font-family:var(--serif);font-size:1.25rem;letter-spacing:.18em;margin:0}.romantic-phrase{font-family:var(--serif);font-style:italic;font-size:1.12rem;margin:1rem 0 0}.scroll-cue{position:absolute;bottom:2rem;text-decoration:none;font-family:var(--arabic);font-size:1rem;text-align:center}.scroll-cue span{display:block;font-family:serif;margin-top:.25rem}.round-control{position:fixed;z-index:40;bottom:max(1.2rem,env(safe-area-inset-bottom));width:46px;height:46px;border:1px solid #9c855a88;border-radius:50%;background:#f8f4eceb;backdrop-filter:blur(12px);box-shadow:0 4px 18px #4c3d2110;display:grid;place-content:center}.music-control{left:1.2rem;font-size:1.5rem;line-height:1}.music-slash{position:absolute;width:24px;height:1px;background:var(--gold-dark);transform:rotate(-45deg);left:10px;top:22px}.music-control[aria-pressed=true] .music-slash{display:none}.menu-control{right:1.2rem;gap:5px}.menu-control span{width:16px;height:1px;background:var(--gold-dark)}#wedding-menu{position:fixed;z-index:39;bottom:5rem;right:1.2rem;width:min(260px,calc(100vw - 2.4rem));background:#fcf9f2f5;border:1px solid var(--line);border-radius:1rem;padding:1rem 1.4rem;box-shadow:0 10px 45px #4c3d2120;backdrop-filter:blur(18px)}#wedding-menu a{display:block;padding:.55rem 0;text-decoration:none;font-size:.94rem}section.content-section{max-width:1050px;padding:6rem 1.5rem;margin:auto;text-align:center}.section-kicker{font-family:var(--serif);font-size:.82rem;letter-spacing:.25em;color:var(--gold-dark);margin:0 0 .7rem;text-transform:uppercase}.section-title{font-family:var(--arabic);font-size:clamp(2.1rem,7vw,3rem);font-weight:400;line-height:1.5;margin:0 0 1.4rem}.section-intro{color:var(--muted);max-width:33rem;margin:0 auto 2rem}.reveal{opacity:0;transform:translateY(20px);transition:opacity .9s var(--ease),transform .9s var(--ease)}.reveal.visible{opacity:1;transform:none}.section-divider{width:70px;border:0;border-top:1px solid var(--line);margin:0 auto}.countdown{display:flex;direction:rtl;justify-content:center;gap:clamp(1.1rem,5vw,3.4rem);margin:2.3rem auto 0}.countdown-unit{display:grid;min-width:42px}.countdown-unit b{font-family:var(--serif);font-weight:400;font-size:clamp(2.7rem,10vw,4.6rem);line-height:1.2;font-variant-numeric:tabular-nums;color:var(--gold-dark)}.countdown-unit span{font-size:.85rem;color:var(--muted);margin-top:.5rem}.countdown-note{font-size:.85rem;color:var(--muted);margin:1.8rem 0 0}.story-layout{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;margin:2.5rem auto 0;text-align:right;max-width:850px}.story-art{aspect-ratio:4/5;background:url('./media/hero-background.webp') center/cover;border-radius:48% 48% 0 0;display:grid;place-items:center;position:relative}.story-art::after{content:'';position:absolute;inset:12px;border:1px solid #a48d6159;border-radius:48% 48% 0 0}.story-art p{font-family:var(--serif);font-size:4rem;color:var(--gold-dark);font-style:italic}.draft-label{display:inline-block;color:var(--gold-dark);font-size:.78rem;letter-spacing:.02em;border-bottom:1px solid var(--line);padding-bottom:.2rem;margin:0 0 .8rem}.story-copy h3{font-family:var(--arabic);font-size:2rem;font-weight:400;margin:0 0 1rem}.story-copy p{color:var(--muted)}.details-band{background:#eee7da;border-block:1px solid #c6b28d38}.details-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin:2.5rem 0 0}.detail{padding:1rem}.icon{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;color:var(--gold-dark);margin-bottom:.9rem}.detail h3{font-size:.87rem;color:var(--muted);font-weight:400;margin:0 0 .5rem}.detail p{font-family:var(--arabic);font-size:1.35rem;margin:0}.detail .venue{font-family:var(--serif);font-size:1.4rem}.location-wrap{max-width:730px;margin:2rem auto 0;border:1px solid var(--line);padding:3rem 1.5rem;position:relative}.location-wrap::before{content:'';position:absolute;inset:7px;border:1px solid #b6a17c33;pointer-events:none}.venue-name{font-family:var(--serif);font-size:clamp(2rem,8vw,3rem);font-weight:400;margin:.3rem 0}.text-link{display:inline-block;text-decoration:none;border:0;border-bottom:1px solid var(--gold);background:none;color:var(--gold-dark);padding:.35rem 0;font-size:.95rem}.text-link:disabled{opacity:.6}.location-note{font-size:.87rem;color:var(--muted);margin:1rem 0 0}.timeline{max-width:590px;margin:2.5rem auto 0;text-align:right;list-style:none;padding:0}.timeline li{position:relative;padding:0 2rem 2.5rem 0;border-right:1px solid var(--line)}.timeline li:last-child{padding-bottom:0}.timeline li::before{content:'';position:absolute;right:-4px;top:.7rem;width:7px;height:7px;border:1px solid var(--gold);background:var(--ivory);transform:rotate(45deg)}.timeline time{font-family:var(--serif);font-size:1.3rem;color:var(--gold-dark)}.timeline h3{font-family:var(--arabic);font-size:1.4rem;font-weight:400;margin:.2rem 0}.timeline p{color:var(--muted);margin:.4rem 0;font-size:.94rem}.rsvp-band{background:#eee7da}.rsvp-form{max-width:540px;text-align:right;margin:2rem auto 0}.rsvp-form label,.rsvp-form legend{font-size:.93rem;display:block;margin-bottom:.45rem}.rsvp-form input[type=text],.rsvp-form input[type=number],.rsvp-form textarea{width:100%;border:0;border-bottom:1px solid #a693706f;border-radius:0;background:#fbf8f133;padding:.8rem .6rem;outline-offset:1px;color:var(--ink)}.field{margin-bottom:1.65rem}.rsvp-form fieldset{border:0;padding:0;margin:0 0 1.65rem}.attendance-options{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}.attendance-options label{display:flex;align-items:center;gap:.6rem;border:1px solid var(--line);padding:.8rem;font-size:.9rem;cursor:pointer}.attendance-options label:has(input:checked){background:#faf6ed;border-color:var(--gold)}input[type=radio]{accent-color:var(--gold-dark);width:17px;height:17px}.submit-button{display:block;width:100%;background:var(--gold-dark);color:#fffaf0;border:1px solid var(--gold-dark);border-radius:2px;padding:.8rem 1.2rem;transition:background .2s}.submit-button:hover{background:#5b492d}.form-notice{font-size:.86rem;line-height:1.9;color:#655a48;text-align:center;margin:1rem 0}.form-result{padding:1rem;border:1px solid var(--line);margin-top:1rem;text-align:center}.gallery-grid{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:1rem;align-items:center;margin:2.5rem auto 0;max-width:850px}.photo-placeholder{aspect-ratio:3/4;border:1px solid var(--line);background:#efe8dc66;display:grid;place-content:center;gap:.4rem;color:var(--muted);padding:1rem}.photo-placeholder:first-child{aspect-ratio:3/4.6}.photo-placeholder span{font-family:var(--serif);font-size:2rem;color:#9c8968;font-style:italic}.photo-placeholder p{font-size:.84rem;margin:0}.gallery-grid figure{margin:0}.gallery-grid img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover}.footer{position:relative;text-align:center;padding:7rem 1.5rem 8rem;background:var(--paper);overflow:hidden}.footer::before{content:'';position:absolute;inset:0;background:url('./media/hero-background.webp') center/cover;opacity:.6}.footer>*{position:relative}.footer h2{font-family:var(--arabic);font-weight:400;font-size:clamp(1.8rem,6vw,2.7rem);margin:0 0 2rem}.footer .signature{font-family:var(--serif);font-size:2.8rem;color:var(--gold-dark);margin:.5rem 0}.footer .date{font-family:var(--serif);letter-spacing:.14em}.footer small{font-family:var(--arabic);font-size:1rem}.lightbox{border:1px solid var(--line);background:var(--ivory);max-width:min(90vw,850px);padding:1rem}.lightbox::backdrop{background:#201c18cc}.lightbox img{max-width:100%;max-height:75vh}.lightbox button{display:block;background:none;border:0;margin:0 0 1rem auto}.gallery-button{border:0;background:none;padding:0;width:100%}@keyframes breathe{50%{opacity:.65;transform:translateY(-3px)}}@media(min-width:700px){.hero-paper,.cinema{max-width:min(650px,56.25svh)}.hero{min-height:100svh}.hero-content{padding-top:5rem;padding-bottom:6rem}h1{font-size:clamp(4.5rem,10vh,6.4rem)}.hero-paper::after{content:'';position:absolute;inset:0;box-shadow:inset 24px 0 25px -25px var(--paper),inset -24px 0 25px -25px var(--paper)}.opening{background:radial-gradient(ellipse at center,#f6f0e5,#e7dece)}.music-control{left:2rem;bottom:2rem}.menu-control{right:2rem;bottom:2rem}#wedding-menu{right:2rem;bottom:6rem}}@media(max-width:600px){section.content-section{padding:4.5rem 1.5rem}.story-layout{grid-template-columns:1fr;gap:2rem}.story-art{width:70%;max-width:280px;margin:auto;aspect-ratio:4/4.5}.story-copy{text-align:center}.details-grid{grid-template-columns:1fr;gap:0}.detail{padding:1.3rem 0}.detail+.detail{border-top:1px solid var(--line);width:70%;margin:auto}.gallery-grid{gap:.65rem;grid-template-columns:1fr 1fr}.photo-placeholder:first-child{grid-column:1/-1;aspect-ratio:4/3}.photo-placeholder{aspect-ratio:3/4}.attendance-options{gap:.5rem}.attendance-options label{padding:.75rem .55rem;font-size:.85rem}.hero-content{padding-top:5rem}.eyebrow{font-size:1rem}.hero-paper{max-width:none}.invitation-heading{top:12%}.tap-label{bottom:15%}}@media(max-height:640px){.invitation-heading{top:5%}.tap-label{bottom:7%}.hero-content{padding:4rem 1rem 6rem}h1{font-size:4rem}.eyebrow{margin-bottom:1rem}.fine-rule{margin:1.3rem auto 1rem}.scroll-cue{bottom:.8rem}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition-duration:.01ms!important;transition-delay:0ms!important}.reveal{opacity:1;transform:none}}
