@font-face{font-family:Vazirmatn;src:url('./assets/vazirmatn.woff2') format('woff2');font-weight:400; font-style:normal;font-display:swap}
@font-face{font-family:Cormorant;src:url('./assets/cormorant.woff2') format('woff2');font-weight:400 500;font-style:normal;font-display:swap}
:root{
  --obsidian:#050609;--midnight:#080d15;--charcoal:#10151d;--silver:#e7ecf3;--platinum:#bfc9d7;--muted:#9faebb;--blue:#6d9fc9;--atmosphere:#274b70;--warm:#d8b58a;
  --line:rgba(191,201,215,.22);--font-fa:Vazirmatn,Tahoma,sans-serif;--font-display:Cormorant,Georgia,serif;--ease-out:cubic-bezier(.23,1,.32,1);
}
*{box-sizing:border-box}
html{background:var(--obsidian);color:var(--silver);font-family:var(--font-fa);-webkit-text-size-adjust:100%;scroll-padding-top:96px}
body{margin:0;min-width:280px;-webkit-tap-highlight-color:transparent}
button,a{touch-action:manipulation;-webkit-user-select:none;user-select:none}
a{color:inherit;text-decoration:none}
button{font:inherit}
button,a,input{outline-offset:6px}
:focus-visible{outline:2px solid var(--warm)}
button{cursor:pointer}
button:disabled{cursor:default}
button:active,.button:active{transform:translateY(1px)}
svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
h1,h2,p{margin:0}
[hidden]{display:none!important}
::selection{background:var(--platinum);color:var(--obsidian)}
.keyboard-skip{position:fixed;z-index:100;inset-block-start:12px;inset-inline-start:20px;background:var(--silver);color:var(--obsidian);padding:16px;transform:translateY(-180%)}
.keyboard-skip:focus{transform:translateY(0)}
.site-header{position:absolute;z-index:30;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:26px 5.3vw;padding-top:calc(26px + env(safe-area-inset-top));gap:24px}
.brand{display:flex;align-items:center;gap:17px;min-height:44px}
.brand-monogram{font-family:var(--font-display);font-size:40px;font-weight:400;line-height:1;letter-spacing:-8px;padding-right:8px;position:relative;color:var(--platinum)}
.brand-monogram>span{font-size:33px;position:relative;top:4px}
.brand-word{font:11px/1.8 var(--font-fa);letter-spacing:.3em;color:var(--silver)}
.brand-word>span{display:block;font-size:7px;letter-spacing:.24em;color:var(--muted)}


.journey{position:relative;height:100svh;min-height:640px;background:var(--obsidian)}
.cinema{height:100svh;min-height:640px;position:relative;overflow:hidden;isolation:isolate}
.cinema::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:16;box-shadow:inset 0 0 12vw 2vw rgba(0,0,0,.28)}
.scene-copy{position:absolute;z-index:12;text-align:center;inset-inline:24px;pointer-events:none}
.opening-copy{top:13%}
.eyebrow{font:9px/1.6 var(--font-fa);letter-spacing:.32em;color:var(--platinum);text-transform:uppercase}
h1{font-family:var(--font-fa);font-size:clamp(40px,4vw,58px);line-height:1.48;font-weight:400;letter-spacing:0;margin-top:6px;color:var(--silver)}
h1 em{font-style:normal;font-weight:400;color:var(--warm)}
.birthday-kicker{font-size:12px;line-height:2;color:var(--warm);margin-top:13px}
.opening-persian{font-size:14px;line-height:2;margin-top:12px;color:var(--platinum)}
.envelope-scene{position:absolute;inset:0;z-index:8;background:var(--obsidian)}
.studio-light{position:absolute;inset:0;background:radial-gradient(ellipse at 67% 37%,#c3864224,transparent 48%),radial-gradient(ellipse at 30% 68%,#6d9fc926,transparent 49%),linear-gradient(114deg,transparent 23%,#d8b58a08 36%,transparent 52%)}
.studio-bokeh{position:absolute;inset:0;background:linear-gradient(#05060930,#050609f2 52%,#050609 86%),url('./assets/birthday-entrance.webp') center 8%/cover;opacity:.44;mask-image:linear-gradient(#000 0,#000 18%,transparent 60%)}
.studio-column{position:absolute;top:0;bottom:16%;width:15%;background:linear-gradient(90deg,#080b10,#090d14 75%,#121b27 99%,#2d3a49);opacity:.46;box-shadow:30px 0 65px #000}
.column-left{left:-4%;transform:skewY(-8deg)}
.column-right{right:-4%;transform:scaleX(-1) skewY(-8deg)}
.studio-floor{position:absolute;inset:76% -30% -65%;transform:perspective(440px) rotateX(66deg);transform-origin:top;background:linear-gradient(90deg,transparent 49.94%,rgba(191,201,215,.1) 50%,transparent 50.06%),linear-gradient(0deg,transparent 89%,rgba(191,201,215,.035) 90%,transparent 91%),radial-gradient(ellipse at 50% 0%,#1a2430 0,transparent 45%);background-size:100% 100%,100% 120px,100% 100%;border-top:1px solid #141c27;opacity:.5}
.envelope-position{position:absolute;left:50%;top:63%;width:clamp(290px,36vw,510px);aspect-ratio:1.64;transform:translate(-50%,-50%);perspective:1300px}
.envelope-rig{position:absolute;inset:0;transform:rotateZ(-7deg) rotateX(10deg) rotateY(-10deg);transform-style:preserve-3d;direction:ltr}
.envelope-back{position:absolute;inset:0;border-radius:3px;background:linear-gradient(130deg,#202b36,#0f141c 47%,#121b26);box-shadow:0 1px 1px #65717c,1px -1px 1px #55616d,-1px 0 1px #2c3540,0 35px 48px #0009,inset 0 0 30px #0009}
.textured::after{content:'';position:absolute;inset:0;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.84' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.12' d='M0 0h200v200H0z'/%3E%3C/svg%3E");opacity:.29;mix-blend-mode:screen}
.envelope-pocket{position:absolute;inset:0;z-index:4;transform:translateZ(4px);clip-path:polygon(0 0,50% 50%,100% 0,100% 100%,0 100%);border-radius:2px;background:#0c121b}
.fold-left,.fold-right,.fold-bottom{position:absolute;inset:0}
.fold-left{clip-path:polygon(0 0,52% 53%,0 100%);background:linear-gradient(42deg,#141e2a,#273443 99%);box-shadow:inset 1px 0 #71808b}
.fold-right{clip-path:polygon(100% 0,48% 53%,100% 100%);background:linear-gradient(240deg,#131b26,#090d14);box-shadow:inset -1px 0 #394757}
.fold-bottom{clip-path:polygon(0 100%,48% 45%,52% 45%,100% 100%);background:linear-gradient(155deg,#23303d,#111925 67%,#111821);border-bottom:1px solid #435161}
.envelope-flap{position:absolute;top:0;left:0;right:0;height:56%;transform-origin:center top;transform:translateZ(5px);transform-style:preserve-3d;z-index:6}
.flap-face,.flap-lining{position:absolute;inset:0;clip-path:polygon(0 0,100% 0,52% 98%,48% 98%);backface-visibility:hidden}
.flap-face{background:linear-gradient(153deg,#27333f 0,#171e28 47%,#0d121a 88%);filter:drop-shadow(0 3px 2px #000);border-top:1px solid #72808c}
.flap-lining{background:linear-gradient(160deg,#10151d,#263746);transform:rotateY(180deg);border-top:1px solid #586575}
.silver-seal{position:absolute;width:18%;aspect-ratio:1;left:41%;top:43%;z-index:10;transform:translateZ(12px);border-radius:47% 49% 44% 50% / 43% 49% 46% 51%;background:conic-gradient(from 20deg,#b0bac4,#536270 11%,#b9c4cf 26%,#e0e6e9 38%,#8995a3 53%,#c2cad1 66%,#6f7d8b 85%,#b0bac4);box-shadow:0 5px 9px #0009,inset 1px 2px 2px #fff9,inset -1px -3px 2px #202833;display:grid;place-items:center;color:#344352}
.seal-rim{position:absolute;inset:10%;border:1px solid #6c7b87;border-radius:50%;box-shadow:0 1px 0 #e9f0f3b3,inset 0 1px 0 #dce5ed66}
.silver-seal>span{font:clamp(29px,3.7vw,50px)/1 var(--font-display);letter-spacing:-.2em;transform:translateX(-6%);text-shadow:0 1px 0 #ffffffa0}
.silver-seal>span>span{font-size:.83em;position:relative;top:.08em}
.seal-glint{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(120deg,transparent 38%,#fff9 48%,transparent 61%);opacity:0;transform:translateX(-55%)}
.envelope-engraving{position:absolute;z-index:5;bottom:8%;left:0;right:0;text-align:center;font-size:7px;letter-spacing:.42em;color:#8190a1;opacity:.7;transform:translateZ(5px)}
.envelope-shadow{position:absolute;left:31%;right:28%;top:80%;height:8%;background:radial-gradient(ellipse,#000b,transparent 66%);transform:rotateZ(-6deg);filter:blur(7px)}
.invitation-card{position:absolute;z-index:2;inset:6% 6% 4%;background:linear-gradient(135deg,#1d2835,#0d1520 70%);border:1px solid #62707d;box-shadow:0 0 20px #0006;display:flex;align-items:center;flex-direction:column;text-align:center;padding-top:7%;color:var(--platinum);transform:translateZ(2px);overflow:hidden}
.card-rule{position:absolute;inset:10px;border:1px solid #6b778a55}
.card-overline{font-size:7px;letter-spacing:.3em}
.card-monogram{font:52px/1 var(--font-display);letter-spacing:-.06em;margin-top:6%}
.card-title{font:19px/1.1 var(--font-display);letter-spacing:.12em;margin-top:5%}
.card-date{font-size:6px;letter-spacing:.3em;margin-top:8%}
.card-portal{position:absolute;inset:0;background:var(--midnight);opacity:0}
.garden-world{position:absolute;inset:0;z-index:1;opacity:0;overflow:hidden;background:var(--midnight)}




.garden-shade{position:absolute;inset:0;background:linear-gradient(180deg,#050609bb 0,#05060966 25%,#0506090a 64%,#050609dd 100%);opacity:.78}
.garden-light{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 59%,#d8b58a22,transparent 55%);opacity:0}
.arrival-shade{position:absolute;inset:0;background:linear-gradient(180deg,#05060988,#050609ab 25%,#05060977 38%,transparent 56%);opacity:0}
.celebration-glow{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 65%,#f9c77844,transparent 62%);opacity:0;mix-blend-mode:screen;pointer-events:none}
/* Full-frame velvet wings: their folds gather at the outer edges. */
.curtain-scene{position:absolute;inset:0;z-index:3;opacity:0;overflow:hidden;pointer-events:none;direction:ltr}
.curtain-fabric{position:absolute;top:-4%;bottom:-6%;width:50.5%;background:radial-gradient(ellipse at 100% 6%,#d8b58a24,transparent 60%),repeating-linear-gradient(90deg,#04070c 0%,#101722 3%,#29323e 6%,#141c27 9%,#05080e 12%,#111925 15%,#242c36 19%,#0b1018 23%,#030509 25%);box-shadow:inset 0 -24px 32px #000a,14px 0 32px #0008;will-change:transform}
.curtain-left{left:0;transform-origin:0 0;border-radius:0 0 2% 0}
.curtain-right{right:0;transform-origin:100% 0;background:radial-gradient(ellipse at 0 6%,#d8b58a24,transparent 60%),repeating-linear-gradient(270deg,#04070c 0%,#101722 3%,#29323e 6%,#141c27 9%,#05080e 12%,#111925 15%,#242c36 19%,#0b1018 23%,#030509 25%);box-shadow:inset 0 -24px 32px #000a,-14px 0 32px #0008;border-radius:0 0 0 2%}
.curtain-fabric::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 29%,transparent 5%,#0204088a 85%),linear-gradient(#0008,transparent 16%,transparent 80%,#0008);border-inline:1px solid #bfc9d71c}
.curtain-fabric.textured::after{opacity:.1;mix-blend-mode:soft-light}
.curtain-sheen{position:absolute;inset:0;background:linear-gradient(90deg,transparent 68%,#d8b58a30 93%,#d8b58a66 99%,#e7ecf344);opacity:0}
.curtain-right .curtain-sheen{transform:scaleX(-1)}
.curtain-light{position:absolute;left:50%;top:0;bottom:0;width:3px;transform:translateX(-50%);background:var(--warm);box-shadow:0 0 70px 20px #d8b58a55;opacity:0}
.curtain-overhead{position:absolute;inset:0 0 auto;height:16%;background:linear-gradient(#030509cc,transparent);pointer-events:none}
.curtain-copy{top:37%;opacity:0}
.curtain-copy h2{font-size:clamp(29px,3.2vw,46px);font-weight:400;line-height:1.8;margin-block:16px 6px;color:var(--warm)}
.curtain-copy>p:last-child{font-size:15px;line-height:2;color:var(--platinum)}
.arrival-copy{top:9%;opacity:0;transform:translateY(20px)}
.latin-name{font:clamp(30px,5vw,72px)/1.2 var(--font-display);letter-spacing:.08em;margin:12px auto 5px;color:var(--silver)}
.arrival-copy h2{font-size:clamp(40px,3.6vw,52px);font-weight:400;line-height:1.35;color:var(--warm)}
.arrival-copy h2 span{display:block;font-size:23px;line-height:1.6;color:var(--silver);margin-top:3px}
.arrival-event{font-size:12px;color:var(--platinum);margin-top:8px}
.arrival-quote{font-size:15px;line-height:2;margin-top:12px;color:var(--silver)}
.story-confetti,.burst-overlay{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:14}
.burst-overlay{position:fixed;z-index:100}
.confetti-piece{position:absolute;width:6px;height:13px;left:50%;top:48%;opacity:0;background:var(--warm);backface-visibility:visible}
.confetti-piece:nth-child(3n){width:4px;height:17px;background:var(--platinum)}
.confetti-piece:nth-child(3n + 1){width:8px;height:8px;background:var(--silver)}
.confetti-piece:nth-child(5n){border-radius:50%;width:5px;height:5px}
.cinema-footer{position:absolute;inset:auto 5.3vw 4%;z-index:20;display:flex;align-items:flex-end;justify-content:space-between;gap:20px;padding-bottom:env(safe-area-inset-bottom)}
.date-stamp{display:flex;flex-direction:column;gap:6px;font-size:10px;color:var(--muted);width:180px}
.date-stamp>span:first-child{letter-spacing:.2em;color:var(--platinum);font-size:11px}
.date-stamp>span:last-child{text-align:left}
.scroll-invitation{display:flex;flex-direction:column;align-items:center;gap:8px;min-height:64px;color:var(--platinum);font-size:11px;line-height:2}

.act-progress{display:flex;align-items:center;gap:13px;font-size:10px;letter-spacing:.1em;color:var(--muted);width:180px;justify-content:flex-end;padding-bottom:4px}
.act-number{color:var(--silver)}
.progress-track{width:68px;height:1px;background:var(--line);overflow:hidden}
.progress-track i{display:block;width:100%;height:1px;background:var(--silver);transform:scaleX(.04);transform-origin:left}
.edge-caption{position:absolute;z-index:15;left:28px;top:51%;font-size:8px;letter-spacing:.24em;color:#7f8b99;writing-mode:vertical-rl;transform:rotate(180deg)}
.invitation{position:relative;isolation:isolate;padding:118px 7vw 32px;scroll-margin-top:0;overflow:hidden;background:var(--obsidian)}
.invitation-atmosphere{position:absolute;z-index:-1;inset:0;background:linear-gradient(#050609 0,#050609dd 35%,#050609fa 76%),url('./assets/birthday-entrance.webp') center top/cover;opacity:.95}
.invitation-inner{max-width:1020px;margin:auto}
.invitation-heading{text-align:center}
.small-monogram{font:50px/1 var(--font-display);letter-spacing:-.08em;display:block;color:var(--platinum);margin:26px auto 15px}
.invitation-intro{font-size:clamp(32px,3.6vw,46px);line-height:1.7;font-weight:400}
.invitation-intro em{font-style:normal;color:var(--warm)}
.invitation-note{font-size:14px;line-height:2.2;margin:25px auto 0;color:var(--platinum)}
.celebrate-button{min-height:48px;display:inline-flex;align-items:center;gap:12px;padding:9px 20px;margin-top:22px;background:#d8b58a12;border:1px solid #d8b58a70;color:var(--warm);font-size:13px;transition:background 160ms ease,transform 160ms var(--ease-out)}
.celebration-feedback{font-size:12px;color:var(--warm);line-height:2;min-height:24px;margin-top:8px}
.invitation-heading h2{font-size:17px;line-height:1.8;margin-top:8px;font-weight:400;color:var(--platinum)}
.invitation-name{font:19px/1.5 var(--font-display);letter-spacing:.24em;color:var(--muted);margin:14px auto 0}
.event-layout{display:grid;grid-template-columns:1fr 1.15fr;gap:70px;margin-top:70px;padding-top:28px;border-top:1px solid var(--line)}
.detail-label{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:12px;margin-bottom:20px}
.detail-label>span:last-child{font-size:9px;letter-spacing:.2em}
.event-date,.event-city{font-size:clamp(21px,2vw,26px);line-height:1.9}
.event-time{font-size:19px;line-height:2;margin-top:8px;color:var(--platinum)}
.event-time strong{font-weight:400;font-size:24px}
.event-time>span{font-size:11px;display:inline-block;margin-inline-start:14px;color:var(--muted)}
.calendar-link{display:inline-flex;gap:10px;align-items:center;margin-top:18px;font-size:13px;min-height:44px;border-bottom:1px solid var(--line)}
.calendar-link svg{width:17px;height:17px;color:var(--warm)}
address{font-style:normal;font-size:17px;line-height:2.1;margin-top:7px;color:var(--platinum)}
.event-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:25px}
.button{border:1px solid var(--line);min-height:52px;padding:11px 19px;display:inline-flex;align-items:center;justify-content:center;gap:10px;font-size:13px;line-height:1.7;transition:background 180ms ease,color 180ms ease,border-color 180ms ease,transform 120ms var(--ease-out)}
.button-primary{background:var(--platinum);border-color:var(--platinum);color:var(--midnight)}
.button-secondary{background:transparent;color:var(--silver)}
.map-note{font-size:11px;color:var(--muted);line-height:1.9;margin-top:14px}
.copy-feedback{min-height:28px;line-height:1.9;font-size:12px;color:var(--warm);padding-top:5px}
.countdown-section{border-top:1px solid var(--line);padding-top:30px;margin:38px auto 0;text-align:center}
#countdown-heading{color:var(--platinum);font-size:13px}
.countdown{display:flex;justify-content:center;align-items:flex-start;gap:24px;margin-top:18px;font-variant-numeric:tabular-nums}
.countdown>div{min-width:62px;display:flex;flex-direction:column;gap:0}
.countdown span{font-size:40px;font-weight:400;line-height:1.5;color:var(--silver)}
.countdown small{font-size:11px;color:var(--muted)}
.countdown>i{font:25px/2.2 var(--font-display);font-style:normal;color:#586776}
.completed-event{font-size:16px;line-height:2.2;padding:20px 0;color:var(--warm)}
.invitation-footer{border-top:1px solid var(--line);margin-top:78px;padding-top:25px;display:flex;align-items:center;justify-content:space-between;gap:25px;color:var(--muted)}
.invitation-footer>span{font-size:8px;letter-spacing:.18em}
.invitation-footer>span>i{color:var(--warm);font-style:normal;margin:0 8px}
.invitation-footer>p{font-size:10px;line-height:1.8}
.invitation-footer>a{font-size:11px;display:flex;gap:20px;align-items:center;min-height:44px}
.no-script{text-align:center;line-height:2;margin:30px auto;font-size:14px}
@media(hover:hover) and (pointer:fine){.button-primary:hover{background:var(--silver);border-color:var(--silver)}.button-secondary:hover{border-color:var(--platinum);background:#bfc9d70a}.calendar-link:hover,.invitation-footer>a:hover{color:var(--warm)}}
@media(min-width:1600px){.envelope-position{width:560px}.opening-copy{top:19%}}
@media(max-width:700px){
 .site-header{padding:20px 24px;padding-top:calc(20px + env(safe-area-inset-top));gap:12px}.brand{gap:11px}.brand-monogram{font-size:34px}.brand-monogram>span{font-size:29px}.brand-word{font-size:9px;letter-spacing:.23em}.brand-word>span{font-size:6px}
 .journey,.cinema{height:100svh;min-height:600px}.opening-copy{top:22%;inset-inline:20px}.eyebrow{font-size:7px;letter-spacing:.24em}h1{font-size:clamp(42px,8.7vw,58px);margin-top:16px;letter-spacing:-.035em;white-space:nowrap}.opening-persian{font-size:14px;line-height:2;margin-top:15px}
 .envelope-position{width:76%;max-width:420px;top:57.5%}.silver-seal>span{font-size:10vw}.envelope-engraving{font-size:5px;letter-spacing:.32em}.envelope-shadow{left:18%;right:18%;top:73%;height:7%}.studio-floor{top:75%}.studio-column{width:21%;opacity:.34}.column-left{left:-12%}.column-right{right:-12%}
 .card-overline{font-size:5px}.card-monogram{font-size:38px}.card-title{font-size:15px;margin-top:3%}.card-date{font-size:5px;margin-top:5%}.card-rule{inset:6px}
 .cinema-footer{inset:auto 24px 5%;gap:10px;align-items:flex-end}.date-stamp{width:105px;font-size:8px;gap:4px}.date-stamp>span:first-child{font-size:9px;letter-spacing:.1em}.act-progress{width:76px;gap:7px;font-size:8px}.progress-track{width:26px}.scroll-invitation{position:absolute;bottom:80px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:11px;gap:12px}.edge-caption{display:none}
 .curtain-copy{top:36%;inset-inline:22px}.curtain-copy h2{font-size:29px;line-height:1.9}.curtain-copy>p:last-child{font-size:13px}.curtain-fabric{width:50.8%}.garden-shade{background:linear-gradient(#05060999,#05060944 30%,#0506090a 63%,#050609cc)}
 .arrival-copy{top:29%;inset-inline:14px}.latin-name{font-size:clamp(27px,7.8vw,52px);letter-spacing:.035em;margin-top:22px}.arrival-copy h2{font-size:38px;margin-top:12px}.arrival-event{font-size:14px}.arrival-quote{font-size:13px;line-height:2.3;margin:26px auto 0;max-width:350px}
 .invitation{padding:82px 25px 24px}.invitation-heading .eyebrow{font-size:8px}.small-monogram{font-size:45px;margin-top:22px}.invitation-intro{font-size:33px}.invitation-heading h2{font-size:15px}.invitation-name{font-size:16px;letter-spacing:.16em;margin-top:16px}.event-layout{grid-template-columns:1fr;gap:30px;margin-top:43px;padding-top:23px}.event-when{padding-bottom:22px;border-bottom:1px solid var(--line)}.detail-label{margin-bottom:12px}.event-date{font-size:23px}.event-city{font-size:24px}.event-time{font-size:18px;margin-top:7px}.calendar-link{margin-top:12px}.event-actions{flex-wrap:nowrap;gap:10px;margin-top:21px}.button{padding:11px 12px;font-size:12px;flex:1;gap:8px}.button svg{width:18px;height:18px}address{font-size:16px;line-height:2.2;max-width:330px}.map-note{font-size:10px;margin-top:14px}.countdown-section{margin-top:20px;padding-top:24px}.countdown{gap:13px}.countdown>div{min-width:47px}.countdown span{font-size:34px}.countdown>i{font-size:23px;line-height:2.1}.invitation-footer{margin-top:55px;flex-direction:column;gap:14px;text-align:center;padding-top:28px}.invitation-footer>p{font-size:10px}.invitation-footer>a{min-height:44px}
}
@media(max-width:360px){.curtain-copy h2{font-size:25px}.site-header{padding-inline:18px}.brand-word>span{display:none}.brand-word{font-size:8px}.opening-copy{inset-inline:12px}h1{font-size:39px}.opening-persian{font-size:12px}.envelope-position{width:79%}.arrival-quote{font-size:12px}.invitation{padding-inline:20px}.event-date{font-size:21px}.button{font-size:11px;padding-inline:10px}.countdown{gap:9px}}
@media(max-height:620px) and (min-width:701px){.opening-copy{top:18%}h1{font-size:56px}.envelope-position{width:340px;top:62%}.journey,.cinema{min-height:550px}.arrival-copy{top:23%}.latin-name{font-size:64px}.arrival-quote{margin-top:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.journey,.cinema{height:100svh;min-height:600px}.button{transition:none}.cinema::after{box-shadow:none}}
.journey{height:auto}
@media(max-width:700px){.invitation-atmosphere{background-image:linear-gradient(#050609 0,#050609e8 40%,#050609f5 100%),url('./assets/birthday-mobile-portrait.webp')}}
@media(max-width:700px) and (max-height:700px){.opening-copy{top:20%}.envelope-position{width:72%;top:58%}.scroll-invitation{bottom:55px}}
/* The birthday revision keeps the focal cake below the name on phones. */
@media(max-width:700px){
 .opening-copy{top:13%;inset-inline:20px}.opening-copy h1{font-size:39px;line-height:1.5;letter-spacing:0;white-space:normal;margin-top:7px}.birthday-kicker{font-size:11px;margin-top:10px}.opening-persian{font-size:12px;margin-top:9px}.envelope-position{top:62%;width:74%}.studio-column{opacity:.17}.studio-bokeh{background-image:linear-gradient(#05060930,#050609f2 52%,#050609 86%),url('./assets/birthday-mobile-portrait.webp');opacity:.5}
 .arrival-copy{top:11%;inset-inline:16px}.latin-name{font-size:clamp(26px,7.5vw,45px);letter-spacing:.02em;margin-top:12px}.arrival-copy h2{font-size:41px;line-height:1.3;margin-top:8px}.arrival-copy h2 span{font-size:22px;margin-top:4px}.arrival-event{font-size:11px;margin-top:10px}.arrival-quote{font-size:12px;line-height:1.9;margin-top:11px}.garden-shade{background:linear-gradient(#05060966,#05060922 30%,transparent 65%,#050609cc)}.arrival-shade{background:linear-gradient(#05060988,#050609b5 27%,#05060966 40%,transparent 53%)}
 .invitation-atmosphere{background-image:linear-gradient(#050609 0,#050609dd 35%,#050609fa 76%),url('./assets/birthday-mobile-portrait.webp')}.invitation-note{font-size:12px;line-height:2.2;margin-top:20px}.invitation-intro{font-size:33px;line-height:1.6}.event-layout{margin-top:30px}.celebrate-button{font-size:12px;margin-top:19px}.invitation-heading .eyebrow{font-size:7px;letter-spacing:.16em}
}
@media(max-width:700px) and (max-height:700px){.opening-copy{top:10%}.opening-copy h1{font-size:34px;line-height:1.48}.birthday-kicker{margin-top:7px;font-size:10px}.envelope-position{width:68%;top:59.5%}.opening-persian{font-size:11px}.arrival-copy{top:8%}.arrival-copy h2{font-size:33px}.arrival-copy h2 span{font-size:19px}.arrival-quote{margin-top:7px}.arrival-event{margin-top:7px}.scroll-invitation{bottom:55px}}
@media(hover:hover) and (pointer:fine){.celebrate-button:hover{background:#d8b58a28}}
@media(prefers-reduced-motion:reduce){.celebrate-button{transition:none}.story-confetti{display:none}}


/* The complete user-supplied photograph is visible before the camera moves. */
.garden-plate{position:absolute;inset:0;display:block;transform-origin:50% 50%}
.garden-plate img{display:block;width:100%;height:100%;object-fit:contain;object-position:50% 50%}

@media(max-width:700px){.garden-plate img{width:100%;height:auto;object-fit:contain;object-position:center top}}

/* A full table remains in frame; the mobile greeting sits on the foreground. */
@media(max-width:700px){
 .arrival-copy{top:49%}
 .arrival-shade{background:linear-gradient(transparent 33%,#05060966 44%,#050609b5 56%,#05060999 77%,transparent)}
}
@media(max-width:700px) and (max-height:700px){
 .arrival-copy{top:47%}.arrival-copy .latin-name{margin-top:8px;font-size:25px}.arrival-copy h2{font-size:30px}.arrival-copy h2 span{font-size:18px}.arrival-quote{font-size:11px}
 .cinema-footer .scroll-invitation{bottom:47px}
}
.open-invitation-control{position:absolute;z-index:18;top:39%;inset-inline:0;text-align:center}
#open-invitation{background:#0b111be6;border:1px solid #bfc9d755;color:var(--silver);padding:10px 24px;min-height:60px;font-size:13px;line-height:1.7}
#open-invitation>span{display:block;font-size:10px;color:var(--warm);margin-top:3px}
.music-control{position:fixed;z-index:50;top:calc(25px + env(safe-area-inset-top));left:50%;transform:translateX(-50%);text-align:center}
#music-toggle{display:flex;gap:8px;align-items:center;justify-content:center;min-width:74px;min-height:44px;padding:8px 12px;background:#080d15e8;border:1px solid var(--line);color:var(--platinum);font-size:11px}
#music-toggle svg{width:17px;height:17px}
#music-toggle[aria-pressed=true]{border-color:#d8b58a80;color:var(--warm)}
.music-feedback{position:absolute;top:52px;left:50%;transform:translateX(-50%);width:240px;font-size:11px;line-height:1.9;background:var(--midnight);color:var(--silver)}
.music-feedback:empty{display:none}
.music-credit{text-align:center;color:var(--muted);font-size:10px;line-height:2;padding-top:18px}
.music-credit a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:700px){.open-invitation-control{top:40%}.music-control{left:51.2%;top:calc(20px + env(safe-area-inset-top))}#music-toggle{min-width:44px;padding-inline:8px}#music-toggle>span{display:none}}
@media(max-width:360px){.music-control{left:55%}#music-toggle{min-width:44px}#music-toggle>span{display:none}}
@media(max-width:700px) and (max-height:700px){.open-invitation-control{top:39%}#open-invitation{min-height:52px;padding-block:6px;font-size:12px}}

/* Personal birthday identity; the story cue is text, never a skip control. */
.brand-word[dir=rtl]{font-family:var(--font-fa);font-size:19px;line-height:1.65;letter-spacing:0;text-align:right}
.brand-word[dir=rtl]>span{font-size:10px;letter-spacing:0}
.header-date{font-size:12px;line-height:2;color:var(--platinum)}
.invitation-footer>span[dir=rtl]{font-size:11px;letter-spacing:0}
.scroll-invitation{pointer-events:none}
@media(max-width:700px){.brand-word[dir=rtl]{font-size:17px}.brand-word[dir=rtl]>span{font-size:9px}.header-date{font-size:10px}}
@media(max-width:360px){.brand-word[dir=rtl]{font-size:16px}.brand-word[dir=rtl]>span{display:block}.header-date{font-size:9px}}