/* GSAP controls the first four scenes. The invitation then continues in native flow. */
html,body{height:auto;min-height:100%;overflow-x:clip;overflow-y:visible}
html{scroll-behavior:auto;scroll-padding-top:80px}
body{background:#f6ebe7}
#journey{height:auto;overflow:visible;background:#f6ebe7}
.cinematic{--intro-presence:1;position:relative;width:100%;height:100svh;isolation:isolate}
.cinema-stage{height:100%;width:100%;position:relative;overflow:hidden;background:radial-gradient(ellipse at 73% 48%,#f0d9f0aa,transparent 47%),linear-gradient(120deg,#faf4e9,#f5e5ea)}
.cinematic .scene{inset:80px 0 90px;transform:none;transition:none;overflow:hidden}
.cinematic .scene.active{transform:none}
.cinematic .world{transition:none}
.cinematic .world-art{transition:none;transform:none}
.cinematic .gift-split,.cinematic .gift-stage,.cinematic .gift-inner-light,.cinematic .book-pages,.cinematic .book-cover{transition:none}
.cinematic .gift-stage:hover .gift-lid{transform:none}
.cinematic .portal-flash{animation:none!important}
.cinematic .book-pages{transform:scale(.55) rotateX(12deg)}
.cinematic .book-cover{transform:rotateY(-14deg) rotateZ(-4deg)}
.cinematic .path-bottom .text-button{display:none}
.cinematic .scene-caption{bottom:10px}
.cinematic .book-note{bottom:0;font-size:12px;color:var(--muted)}
.cinematic .scene-0{z-index:3}
.cinema-video-frame{position:absolute;inset:0;z-index:2;pointer-events:none;transform:translateX(calc(18vw * var(--intro-presence))) scale(calc(1 - .18 * var(--intro-presence)));transform-origin:center;will-change:transform}
.cinema-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:2;opacity:0;pointer-events:none;background:#f4e6e7;transition:opacity .5s}
.video-shade{position:absolute;inset:0;z-index:3;opacity:0;pointer-events:none;background:linear-gradient(#fff8ef45,transparent 28%,transparent 78%,#fff8efb8);transition:opacity .5s}
.video-shade:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#fff8effa 0%,#fff8eff7 38%,#fff8efbf 48%,transparent 67%);opacity:var(--intro-presence)}
.has-kling .cinema-video{opacity:1}
.has-kling .video-shade{opacity:1}
.has-kling .cinematic .world,.has-kling .cinematic .gift-stage,.has-kling .cinematic .book-stage,.has-kling .cinematic .welcome-olesya,.has-kling .cinematic .portal-flash{opacity:0!important;visibility:hidden!important;pointer-events:none!important}
.has-kling .cinematic #scene-0{justify-content:flex-start}
.has-kling .cinematic .intro-copy{width:39%;max-width:450px}
.has-kling .cinematic .intro-copy h1{font-size:clamp(60px,6vw,90px);font-weight:500;line-height:1.02;letter-spacing:-.045em;text-shadow:none}
.has-kling .cinematic .intro-copy h1 em{font-weight:500}
.has-kling .cinematic .intro-copy .eyebrow{font-size:11px;letter-spacing:.17em;color:#715743;margin-bottom:24px}
.has-kling .cinematic .intro-copy .intro-description{font-size:16px;line-height:1.65;color:var(--ink);margin:24px 0}
.has-kling .cinematic .intro-copy>.primary{font-size:15px;min-height:50px;padding-inline:26px}
.has-kling .cinematic .intro-copy .tiny-note{font-size:12px;color:var(--muted);line-height:1.55}
.has-kling .cinematic .book-heading,.has-kling .cinematic .path-heading{left:0;right:0;top:10px;width:fit-content;max-width:560px;margin-inline:auto;padding:18px 28px 20px;background:#fff8eff7;border:1px solid #e0cebf;border-radius:5px;box-shadow:0 8px 30px #5a344b0b;filter:none}
.has-kling .cinematic .book-heading h2,.has-kling .cinematic .path-heading h2{font-size:clamp(36px,3.8vw,53px);font-weight:500}
.has-kling .cinematic .book-heading h2 em,.has-kling .cinematic .path-heading h2 em{font-weight:500}
.has-kling .cinematic .book-heading .eyebrow,.has-kling .cinematic .path-heading .eyebrow{font-size:10px;letter-spacing:.16em;color:#715743}
.has-kling .cinematic .book-note{display:none}
.has-kling .cinematic .book-action{bottom:75px;font-size:14px}
.has-kling .cinematic .path-bottom{bottom:75px}
.has-kling .cinematic .path-bottom p{font-size:14px;color:var(--ink);line-height:1.5;padding:8px 18px;background:#fff8eff7;border:1px solid #e0cebf}
.has-kling .cinematic .path-bottom .primary{font-size:14px}
.has-kling .cinematic .welcome-card{margin-left:auto;max-width:440px}
.scroll-cue{position:absolute;z-index:18;bottom:92px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none;color:var(--ink)}
.scroll-cue span{font-size:10px;line-height:1.5;letter-spacing:.15em;white-space:nowrap;background:#fff8eff0;border:1px solid #e0cebf80;padding:5px 12px;border-radius:20px}
.scroll-cue i{font-size:20px;font-style:normal}
.cinema-progress{position:absolute;bottom:0;height:2px;left:0;right:0;background:#b795a420;z-index:30}
.cinema-progress span{display:block;height:100%;width:100%;background:#a47b96;transform:scaleX(0);transform-origin:left}
.celebration-flow{position:relative;isolation:isolate;background:linear-gradient(#f8eee8,#f4e6ec 55%,#f9f1e8)}
.celebration-flow:before{content:'';position:absolute;inset:0;z-index:-1;background:url('/art/castle-world.png') center top/cover no-repeat;opacity:.14;mask-image:linear-gradient(black,transparent 70%);pointer-events:none}
.celebration-flow>.scene{position:relative;inset:auto;min-height:100svh;height:auto;padding:110px 8vw 105px;opacity:1;visibility:visible;transform:none;pointer-events:auto;overflow:visible;transition:none;scroll-margin-top:0}
.celebration-flow .story-card{box-shadow:0 18px 70px #7157650b}
.celebration-flow .date-side,.celebration-flow .location-side{z-index:0}
.celebration-flow .rsvp-intro{height:650px;max-height:80svh;align-self:center}
.celebration-flow .form-card{margin-block:0}
.celebration-flow .gifts-art{position:relative;top:auto;right:auto}
.celebration-flow #scene-8{display:none}
.celebration-flow #scene-8.pass-visible{display:flex}
.celebration-flow .gifts-art img{animation:none}
.journey-footer{background:linear-gradient(#faf3ea00,#faf3eaf7 60%)}
.chapters small{font-size:10px;color:var(--muted)}
.chapters button[aria-current=step] small{color:var(--ink);font-weight:500}
.masthead{background:linear-gradient(#fcf7f1f7,#fcf7f145)}
.ambient{opacity:.45}
@media(max-width:760px){
  html{scroll-padding-top:66px}
  .cinematic .scene{inset:66px 0 94px}
  .cinematic #scene-0{padding-top:14px}
  .cinematic .gift-stage{max-height:43%;margin-block:8px}
  .cinematic .gift-split{transform:translateX(-50%)}
  .cinematic .gift-stage:hover .gift-lid{transform:translateX(-50%)}
  .cinematic .book-stage{top:33%;height:44%;width:94vw}
  .cinematic .book-heading h2{font-size:35px}
  .cinematic .path-bottom{bottom:30px}
  .cinematic .welcome-card{padding:23px 25px}
  .cinematic .welcome-olesya{bottom:39%;height:61%}
  .scroll-cue{bottom:90px}
  .scroll-cue span{font-size:10px;letter-spacing:.09em}
  .scroll-cue i{font-size:17px}
  .celebration-flow>.scene{min-height:100svh;padding:90px 22px 100px;justify-content:safe center}
  .celebration-flow .gifts-art{width:52%;max-width:230px;margin-bottom:25px;flex:none}
  .celebration-flow .gifts-card{z-index:2}
  .celebration-flow .rsvp-intro{width:100%;height:auto;max-height:none}
  .celebration-flow .rsvp-scene{display:block;padding-inline:20px}
  .celebration-flow .form-card{margin-inline:auto}
  .celebration-flow .rsvp-intro h2{font-size:38px;margin-bottom:26px}
  .cinema-video-frame{top:calc(5% + 31% * var(--intro-presence));bottom:auto;height:calc(78% - 22% * var(--intro-presence));transform:none;will-change:top,height}
  .cinema-video{object-position:42% center;mask-image:linear-gradient(transparent,black 6%,black 88%,transparent)}
  .has-kling .cinematic #scene-0{justify-content:flex-start;padding-top:17px}
  .has-kling .cinematic .intro-copy{display:block;width:100%;max-width:440px}
  .has-kling .cinematic .intro-copy h1{font-size:clamp(44px,10.5vw,56px);line-height:1.03;letter-spacing:-.035em}
  .has-kling .cinematic .intro-copy .eyebrow{font-size:10px;letter-spacing:.12em;margin-bottom:12px}
  .has-kling .cinematic .intro-copy .intro-description{font-size:14px;line-height:1.55;margin:14px auto 0;max-width:360px}
  .has-kling .cinematic .intro-copy .intro-description br{display:none}
  .has-kling .cinematic .intro-copy>.primary{margin-top:16px;font-size:15px;min-height:48px}
  .has-kling .cinematic .intro-copy .tiny-note{font-size:11px;line-height:1.5;margin-top:10px}
  .has-kling .cinematic .book-heading,.has-kling .cinematic .path-heading{top:10px;width:calc(100% - 40px);max-width:440px;padding:16px 18px 18px}
  .has-kling .cinematic .book-heading h2,.has-kling .cinematic .path-heading h2{font-size:clamp(33px,8.4vw,42px);line-height:1.05}
  .has-kling .cinematic .book-heading .eyebrow,.has-kling .cinematic .path-heading .eyebrow{font-size:10px;letter-spacing:.1em}
  .has-kling .cinematic .book-action{bottom:65px;font-size:14px;min-height:46px}
  .has-kling .cinematic .path-bottom{bottom:65px;padding-inline:20px}
  .has-kling .cinematic .path-bottom p{font-size:14px;max-width:350px;border-radius:12px}
  .has-kling .cinematic .path-bottom .primary{font-size:14px;min-height:46px}
  .has-kling .cinematic .welcome-card{margin-left:0;max-width:420px}
  .video-shade{background:linear-gradient(#fff8ef66,transparent 28%,transparent 72%,#fff8ef99)}
  .video-shade:before{background:linear-gradient(#fff8effa 0%,#fff8eff7 42%,#fff8efaa 49%,transparent 63%)}
  .journey-footer{height:80px;padding-inline:18px}
  .footer-date{display:none}
  .back-button{min-width:24px;width:24px}
  .chapters{width:min(420px,calc(100% - 76px));max-width:420px;gap:0}
  .chapters button{flex:1;min-width:44px;min-height:52px}
  .chapters small{font-size:10px}
  .chapters button:not(:last-child):after{left:calc(50% + 4px);width:calc(100% - 8px);top:16px}
}
@media(max-width:760px) and (max-height:720px){
  .cinematic .scene{inset:60px 0 82px}
  .cinematic #scene-0{padding-top:8px}
  .cinematic .gift-stage{max-height:39%;min-height:110px;margin-block:3px}
  .cinematic .book-heading h2{font-size:30px}
  .cinematic .book-stage{top:34%;height:39%}
  .cinematic .book-action{bottom:22px}
  .cinematic .book-note{font-size:7px;bottom:0}
  .scroll-cue{bottom:85px;gap:3px}
  .scroll-cue span{font-size:10px}
  .scroll-cue i{font-size:14px}
  .has-kling .cinematic #scene-0{padding-top:8px}
  .has-kling .cinematic .intro-copy h1{font-size:44px}
  .has-kling .cinematic .intro-copy .eyebrow{margin-bottom:8px}
  .has-kling .cinematic .intro-copy .intro-description{margin-top:10px;font-size:14px}
  .has-kling .cinematic .intro-copy>.primary{margin-top:12px;min-height:44px}
  .cinematic .welcome-card{padding:20px}
  .cinematic .welcome-card h2{font-size:34px}
  .cinematic .welcome-card .handwriting{font-size:20px!important}
  .cinematic .welcome-olesya{bottom:43%;height:57%}
  .cinematic .path-bottom{bottom:16px}
}
@media(max-width:360px){
  .back-button{display:none}
  .chapters{width:calc(100% - 24px)}
}
/* Reduced motion and unavailable GSAP retain an ordinary readable document. */
.story-static .cinematic{height:auto}
.story-static .cinema-stage{height:auto;overflow:visible}
.story-static .cinematic .scene{position:relative;inset:auto;min-height:100svh;height:auto;padding:110px 8vw 100px;opacity:1!important;visibility:visible!important;transform:none!important;pointer-events:auto}
.story-static .cinematic .world,.story-static .portal-flash,.story-static .cinema-video-frame,.story-static .video-shade,.story-static .scroll-cue,.story-static .cinema-progress{display:none}
.story-static .cinematic #scene-2,.story-static .cinematic #scene-3{background:linear-gradient(#faf4ebb0,#faf4eb40),url('/art/castle-world.png') center/cover}
.story-static .cinematic .book-heading{position:relative;top:auto;margin-bottom:30px}
.story-static .cinematic #scene-1{display:flex;flex-direction:column}
.story-static .cinematic .book-stage{position:relative;top:auto;height:auto;aspect-ratio:1.5;max-width:750px;width:80vw}
.story-static .cinematic .book-pages{transform:none;opacity:1}
.story-static .cinematic .book-cover{display:none}
.story-static .cinematic .book-action,.story-static .cinematic .book-note{position:relative;bottom:auto;margin-top:20px}
.story-static .cinematic .path-heading{position:relative;top:auto}
.story-static .cinematic .path-bottom{position:relative;bottom:auto;margin-top:40vh}
.story-static .cinematic #scene-2{flex-direction:column}
.story-static .cinematic .welcome-olesya{height:60vh;position:relative;bottom:auto;left:auto}
.story-static .cinematic .gift-stage{flex:none;height:auto;aspect-ratio:1}
@media(max-width:760px){
  .story-static .cinematic .scene{padding:100px 22px 90px}
  .story-static .cinematic #scene-0{padding-top:100px}
  .story-static .cinematic .gift-stage{width:80%;height:310px;max-height:none;margin:20px 0}
  .story-static .cinematic #scene-3{padding-top:70px}
  .story-static .cinematic .welcome-olesya{height:45vh;width:80%;margin-bottom:-30px}
  .story-static .cinematic .welcome-card{margin-left:0}
}

/* Two-tap confirmation for personal invitation links. */
.rsvp-card{width:49%;max-width:460px;padding:34px 38px;text-align:center}
.rsvp-card h3{font-size:38px;line-height:1.05;margin-top:4px}
.rsvp-card [data-view]>p:not(.rsvp-for){font-size:13px;line-height:1.6;margin-top:10px;color:var(--muted)}
.rsvp-for{font-size:11px;letter-spacing:.06em;color:var(--muted);margin-bottom:10px}
.rsvp-for strong{display:block;font:italic 500 28px/1.15 'Cormorant Garamond',Georgia,serif;letter-spacing:0;color:var(--rose);margin-top:2px;overflow-wrap:anywhere}
.choice-buttons{display:grid;gap:10px;margin-top:22px}
.choice-buttons>*{min-height:56px;font-size:14px;border-radius:30px}
.count-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:22px}
.count-button{min-height:64px;border:1px solid #d5c1c3;border-radius:16px;background:#fffefa;font:500 30px/1 'Cormorant Garamond',Georgia,serif;color:var(--ink);transition:background var(--quick),border-color var(--quick),transform var(--quick)}
.count-button[aria-pressed=true]{background:#f1e3ed;border-color:#a67c99}
@media(hover:hover){.count-button:hover{background:#f1e3ed;border-color:#a67c99}}
.count-button:active{transform:scale(.97)}
.count-more{font:500 14px 'DM Sans',sans-serif}
.more-count{display:grid;gap:10px;margin-top:14px}
.more-count[hidden],.rsvp-card [data-view][hidden]{display:none}
.more-count .stepper{justify-content:space-between;margin:0}
.more-count .stepper button{width:56px;height:50px;font-size:20px}
.more-count output{font:500 30px 'Cormorant Garamond',Georgia,serif}
.more-count .primary{min-height:52px;font-size:13px}
.rsvp-card .text-button{margin-top:14px;font-size:12px}
.rsvp-card .error{margin-top:14px}
.rsvp-card .privacy-note{font-size:10px;color:var(--muted);margin-top:18px}
.rsvp-card[aria-busy=true]{opacity:.72}
.celebration-flow .rsvp-card{margin-block:0}
.pass-pin span{display:block;font-size:10px;color:var(--muted);margin-top:2px}
.pass-links{display:flex;flex-wrap:wrap;justify-content:center;gap:0 20px;margin-top:6px}
.pass-links .text-button{font-size:11px}
.ics-form{display:contents}
@media(max-width:760px){
  .celebration-flow .rsvp-card{width:100%;max-width:420px;margin-inline:auto;padding:28px 22px}
  .rsvp-card h3{font-size:34px}
}
