@charset "UTF-8";

/* DreamDay — STORYVERSE
   Original cinematic private-story system.
   All selectors are scoped to the .sv-* namespace. */

html.sv-html {
    scroll-behavior: smooth;
    background: #070b16;
}

body.sv-body {
    --sv-bg: #080c18;
    --sv-ink: #f6f5f8;
    --sv-muted: rgba(246, 245, 248, .64);
    --sv-soft: rgba(246, 245, 248, .1);
    --sv-line: rgba(255,255,255,.16);
    --sv-pink: #ffc0d7;
    --sv-cyan: #93edff;
    --sv-lilac: #d8c6ff;
    --sv-deep: #11172a;
    --sv-radius-xl: 42px;
    --sv-radius-lg: 30px;
    --sv-radius-md: 22px;
    --sv-side: clamp(18px, 4vw, 64px);
    --sv-stage-max: 1180px;
    margin: 0;
    min-width: 0;
    width: 100%;
    overflow-x: clip;
    color: var(--sv-ink);
    background: var(--sv-bg);
    font-family: "DM Sans", "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body.sv-body.sv-is-locked { overflow: hidden; }
.sv-body *, .sv-body *::before, .sv-body *::after { box-sizing: border-box; }
.sv-body img { display: block; max-width: 100%; }
.sv-body button, .sv-body input, .sv-body textarea, .sv-body select { font: inherit; }
.sv-body button, .sv-body a { -webkit-tap-highlight-color: transparent; }
.sv-body a { color: inherit; }

.sv-grain {
    position: fixed;
    inset: 0;
    z-index: 100;
    pointer-events: none;
    opacity: .32;
    background: url("assets/misc/grain.svg") repeat;
    mix-blend-mode: soft-light;
}

.sv-kicker {
    display: inline-flex;
    align-items: center;
    gap: .7rem;
    color: rgba(255,255,255,.64);
    font: 600 .69rem/1.2 "Manrope", sans-serif;
    letter-spacing: .2em;
    text-transform: uppercase;
}
.sv-kicker::before { content:""; width: 28px; height: 1px; background: linear-gradient(90deg,var(--sv-pink),transparent); }

/* OPENING */
.sv-opening {
    position: fixed;
    inset: 0;
    z-index: 120;
    display: grid;
    place-items: end center;
    min-height: 100svh;
    overflow: hidden;
    background: #090d19;
    transition: opacity .65s ease, visibility .65s ease;
}
.sv-opening.is-leaving { opacity: 0; visibility: hidden; pointer-events: none; }
.sv-opening__bg { position: absolute; inset: 0; background: url("assets/backgrounds/storyverse-aurora.svg") center/cover no-repeat; }
.sv-opening__bg img { width: 100%; height: 100%; object-fit: cover; opacity: .7; filter: saturate(.72) contrast(1.08); transform: scale(1.04); animation: svOpeningZoom 12s ease-out both; }
.sv-opening__veil { position:absolute; inset:0; background: linear-gradient(180deg,rgba(4,7,17,.24),rgba(5,8,16,.28) 28%,rgba(6,8,16,.88) 88%), radial-gradient(circle at 18% 16%,rgba(255,175,207,.22),transparent 28%), radial-gradient(circle at 78% 45%,rgba(130,228,255,.16),transparent 36%); }
.sv-light-leak { position:absolute; width:min(86vw,900px); pointer-events:none; opacity:.8; mix-blend-mode:screen; filter:saturate(1.15); }
.sv-light-leak--opening { top:-7%; right:-16%; animation:svLeakDrift 9s ease-in-out infinite alternate; }
.sv-camera-corners { position:absolute; inset:4.5%; width:91%; height:91%; object-fit:fill; pointer-events:none; opacity:.64; }
.sv-opening__segments { position:absolute; top:max(15px,env(safe-area-inset-top)); left:clamp(16px,4vw,54px); right:clamp(16px,4vw,54px); display:grid; grid-template-columns:repeat(var(--sv-count,11),1fr); grid-auto-flow:column; gap:5px; z-index:3; }
.sv-opening__segments i { height:2px; border-radius:3px; background:rgba(255,255,255,.22); overflow:hidden; }
.sv-opening__segments i.is-live { background:linear-gradient(90deg,#fff,var(--sv-pink)); box-shadow:0 0 14px rgba(255,198,220,.38); }
.sv-opening__meta { position:absolute; top:calc(max(15px,env(safe-area-inset-top)) + 28px); left:clamp(20px,4vw,56px); z-index:3; display:flex; align-items:center; gap:11px; }
.sv-opening__avatar { position:relative; width:46px; height:46px; display:grid; place-items:center; }
.sv-opening__avatar img { position:absolute; inset:0; width:100%; height:100%; }
.sv-opening__avatar span { font-size:.62rem; font-weight:600; letter-spacing:.06em; }
.sv-opening__meta strong,.sv-opening__meta small { display:block; }
.sv-opening__meta strong { font-size:.78rem; letter-spacing:.06em; }
.sv-opening__meta small { margin-top:2px; color:rgba(255,255,255,.56); font-size:.66rem; }
.sv-opening__content { position:relative; z-index:3; width:min(100%,980px); padding:0 clamp(22px,6vw,86px) max(92px,calc(58px + env(safe-area-inset-bottom))); text-align:left; }
.sv-opening__content h1 { margin:18px 0 14px; max-width:880px; font:500 clamp(3.7rem,10vw,8.8rem)/.78 "Playfair Display",Georgia,serif; letter-spacing:-.055em; }
.sv-opening__content h1 span { display:block; }
.sv-opening__content h1 span:last-child { margin-left:12%; }
.sv-opening__content h1 em { display:block; margin:.12em 0 -.06em 4%; color:var(--sv-pink); font-weight:500; font-size:.48em; font-style:italic; }
.sv-opening__content > p { max-width:560px; margin:24px 0 24px; color:rgba(255,255,255,.7); font-size:clamp(.88rem,2vw,1.05rem); line-height:1.7; }
.sv-opening__guest { display:flex; flex-direction:column; gap:2px; margin:0 0 20px; }
.sv-opening__guest small { color:rgba(255,255,255,.46); font-size:.68rem; letter-spacing:.13em; text-transform:uppercase; }
.sv-opening__guest strong { font-size:.96rem; font-weight:500; }
.sv-open-btn { min-height:52px; padding:0 18px 0 22px; border:1px solid rgba(255,255,255,.27); border-radius:999px; color:#101522; background:linear-gradient(135deg,#fff,#fbe9f1 58%,#d8f8ff); display:inline-flex; align-items:center; gap:25px; cursor:pointer; box-shadow:0 18px 55px rgba(0,0,0,.3); transition:transform .25s ease,box-shadow .25s ease; }
.sv-open-btn:hover { transform:translateY(-2px); box-shadow:0 22px 70px rgba(0,0,0,.42); }
.sv-open-btn:active { transform:scale(.985); }
.sv-open-btn span { font-weight:600; font-size:.86rem; letter-spacing:.02em; }
.sv-open-btn i { display:grid; place-items:center; width:31px; height:31px; border-radius:50%; color:#fff; background:#101522; font-style:normal; }
.sv-gesture-hint { position:absolute; right:clamp(18px,4vw,54px); bottom:max(22px,env(safe-area-inset-bottom)); z-index:3; display:flex; align-items:center; gap:10px; color:rgba(255,255,255,.5); font-size:.64rem; letter-spacing:.14em; text-transform:uppercase; }
.sv-gesture-hint i { width:26px; height:40px; border:1px solid rgba(255,255,255,.26); border-radius:18px; position:relative; }
.sv-gesture-hint i::after { content:""; position:absolute; top:8px; left:50%; width:3px; height:7px; border-radius:4px; background:#fff; transform:translateX(-50%); animation:svGesture 1.8s ease-in-out infinite; }

/* GLOBAL STORY UI */
.sv-story-progress { position:fixed; top:max(10px,env(safe-area-inset-top)); left:max(14px,env(safe-area-inset-left)); right:max(14px,env(safe-area-inset-right)); z-index:82; display:grid; grid-auto-flow:column; grid-auto-columns:1fr; gap:4px; opacity:0; transform:translateY(-10px); pointer-events:none; transition:opacity .35s ease,transform .35s ease; }
.sv-body.sv-opened .sv-story-progress { opacity:1; transform:none; pointer-events:auto; }
.sv-story-progress button { position:relative; height:12px; padding:5px 0; border:0; background:transparent; cursor:pointer; }
.sv-story-progress button::before { content:""; position:absolute; left:0; right:0; top:5px; height:2px; border-radius:3px; background:rgba(255,255,255,.2); }
.sv-progress-fill { position:absolute; left:0; top:5px; width:100%; height:2px; border-radius:3px; background:linear-gradient(90deg,#fff,var(--sv-pink),var(--sv-cyan)); transform:scaleX(0); transform-origin:left center; }

.sv-side-rail { position:fixed; left:clamp(18px,2.6vw,44px); top:50%; z-index:78; width:108px; transform:translateY(-50%); opacity:0; pointer-events:none; transition:opacity .35s ease; }
.sv-body.sv-opened .sv-side-rail { opacity:1; pointer-events:auto; }
.sv-side-rail__brand { display:flex; align-items:center; gap:9px; margin-bottom:28px; }
.sv-side-rail__brand > span { display:grid; place-items:center; width:30px; height:30px; border:1px solid rgba(255,255,255,.18); border-radius:50%; background:rgba(13,18,35,.66); backdrop-filter:blur(16px); font:500 1rem "Playfair Display",serif; }
.sv-side-rail__brand small { font-size:.58rem; letter-spacing:.13em; text-transform:uppercase; color:rgba(255,255,255,.48); }
.sv-side-rail__chapters { display:grid; gap:8px; }
.sv-side-rail__chapters button { display:flex; align-items:center; gap:9px; min-height:26px; padding:0; border:0; color:rgba(255,255,255,.33); background:none; text-align:left; cursor:pointer; transition:color .25s ease,transform .25s ease; }
.sv-side-rail__chapters button::before { content:""; width:8px; height:1px; background:currentColor; transition:width .25s ease; }
.sv-side-rail__chapters button span { font-size:.58rem; font-variant-numeric:tabular-nums; }
.sv-side-rail__chapters button small { display:none; font-size:.56rem; letter-spacing:.08em; text-transform:uppercase; }
.sv-side-rail__chapters button.is-active { color:#fff; transform:translateX(3px); }
.sv-side-rail__chapters button.is-active::before { width:20px; background:linear-gradient(90deg,var(--sv-pink),var(--sv-cyan)); }
.sv-side-rail__chapters button.is-active small { display:block; }

.sv-music { position:fixed; right:max(18px,env(safe-area-inset-right)); bottom:max(18px,env(safe-area-inset-bottom)); z-index:86; width:48px; height:48px; border:1px solid rgba(255,255,255,.18); border-radius:50%; color:#fff; background:rgba(8,13,27,.72); backdrop-filter:blur(18px); display:grid; place-items:center; cursor:pointer; box-shadow:0 18px 45px rgba(0,0,0,.24); }
.sv-music img { width:20px; height:20px; filter:brightness(0) invert(1); }
.sv-music span { position:absolute; inset:3px; border:1px dashed rgba(255,255,255,.22); border-radius:50%; animation:svSpin 8s linear infinite; }
.sv-music.is-paused span { animation-play-state:paused; }

.sv-reactions { position:fixed; right:clamp(13px,3vw,42px); bottom:92px; z-index:76; width:50px; height:42vh; pointer-events:none; opacity:0; transition:opacity .4s ease; }
.sv-body.sv-opened .sv-reactions { opacity:.9; }
.sv-reaction { position:absolute; width:26px; filter:drop-shadow(0 7px 14px rgba(0,0,0,.2)); animation:svReactionFloat 7s ease-in-out infinite; }
.sv-reaction--1 { left:4px; bottom:0; animation-delay:-1s; }
.sv-reaction--2 { right:2px; bottom:26%; width:18px; animation-delay:-4s; }
.sv-reaction--3 { left:12px; bottom:50%; width:28px; animation-delay:-2.5s; }
.sv-reaction--4 { right:0; bottom:75%; width:20px; animation-delay:-6s; opacity:.65; }

/* STORY SCENES */
.sv-story { position:relative; background:#070b16; }
.sv-scene { position:relative; min-height:100svh; width:100%; display:grid; place-items:center; overflow:hidden; isolation:isolate; scroll-snap-align:start; background:url("assets/backgrounds/storyverse-midnight.svg") center/cover no-repeat; }
.sv-scene:nth-child(3n+1) { background-image:url("assets/backgrounds/storyverse-aurora.svg"); }
.sv-scene::before { content:""; position:absolute; inset:0; z-index:-3; background:radial-gradient(circle at var(--sv-light-x,78%) var(--sv-light-y,22%),rgba(255,186,215,.09),transparent 27%),linear-gradient(180deg,rgba(255,255,255,.01),rgba(0,0,0,.16)); }
.sv-scene__ambient { position:absolute; z-index:-2; inset:-20%; background:radial-gradient(circle,rgba(133,230,255,.12),transparent 52%); filter:blur(40px); transform:translate3d(calc(var(--sv-px,0) * 1px),calc(var(--sv-py,0) * 1px),0); }
.sv-stage { position:relative; z-index:3; width:min(calc(100% - 42px),var(--sv-stage-max)); min-height:min(860px,calc(100svh - 80px)); margin:40px auto; display:grid; align-items:center; }
.sv-stage::before { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; border:1px solid rgba(255,255,255,.08); border-radius:var(--sv-radius-xl); background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.012) 45%,rgba(133,235,255,.03)); box-shadow:inset 0 1px rgba(255,255,255,.06),0 36px 100px rgba(0,0,0,.18); backdrop-filter:blur(10px); }
.sv-story-head { position:absolute; top:28px; left:32px; right:32px; z-index:8; display:flex; align-items:center; gap:12px; }
.sv-profile-seal { position:relative; width:44px; height:44px; flex:0 0 44px; display:grid; place-items:center; }
.sv-profile-seal img { position:absolute; inset:0; width:100%; height:100%; }
.sv-profile-seal span { font-size:.58rem; letter-spacing:.04em; }
.sv-story-head strong,.sv-story-head small { display:block; }
.sv-story-head strong { font-size:.76rem; font-weight:600; }
.sv-story-head small { margin-top:2px; color:rgba(255,255,255,.42); font-size:.62rem; }
.sv-story-head__tag { margin-left:auto; padding:7px 10px; border:1px solid rgba(255,255,255,.12); border-radius:999px; color:rgba(255,255,255,.5); font-size:.58rem; letter-spacing:.13em; }
.sv-reveal { --sv-dx:0px; --sv-dy:0px; --sv-base-y:0px; --sv-reveal-y:26px; --sv-reveal-scale:.985; opacity:0; transform:translate3d(var(--sv-dx),calc(var(--sv-dy) + var(--sv-base-y) + var(--sv-reveal-y)),0) scale(var(--sv-reveal-scale)); transition:opacity .72s cubic-bezier(.22,.8,.23,1),transform .72s cubic-bezier(.22,.8,.23,1); transition-delay:var(--sv-delay,0s); }
.sv-scene.sv-is-active .sv-reveal { --sv-reveal-y:0px; --sv-reveal-scale:1; opacity:1; }
.sv-depth:not(.sv-reveal) { --sv-dx:0px; --sv-dy:0px; transform:translate3d(var(--sv-dx),var(--sv-dy),0); transition:transform .18s linear; will-change:transform; }
.sv-reveal.sv-depth { will-change:transform,opacity; }
.sv-appear { opacity:0; transition:opacity .65s ease; transition-delay:var(--sv-delay,0s); }
.sv-scene.sv-is-active .sv-appear { opacity:1; }

/* Opening story scene */
.sv-stage--opening { grid-template-rows:1fr; padding:96px 60px 54px; }
.sv-opening-story__grid { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(360px,.75fr); gap:clamp(40px,7vw,90px); align-items:center; }
.sv-opening-story__copy { padding-left:clamp(0px,4vw,52px); }
.sv-opening-story__copy h2 { margin:15px 0 24px; font:500 clamp(3.6rem,6vw,6.9rem)/.88 "Playfair Display",Georgia,serif; letter-spacing:-.045em; }
.sv-opening-story__copy h2 em { color:var(--sv-pink); font-weight:500; }
.sv-opening-story__copy p { max-width:470px; margin:0 0 26px; color:rgba(255,255,255,.64); font:italic 1.08rem/1.7 "Playfair Display",serif; }
.sv-opening-story__copy time { color:rgba(255,255,255,.45); font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; }
.sv-cover-frame { position:relative; justify-self:center; width:min(100%,430px); aspect-ratio:.68; padding:24px; }
.sv-cover-frame::before { content:""; position:absolute; inset:12% -16% -9% 12%; z-index:-1; border-radius:50%; background:radial-gradient(circle,rgba(129,232,255,.16),transparent 65%); filter:blur(28px); }
.sv-frame-art { position:absolute; inset:0; z-index:5; width:100%; height:100%; pointer-events:none; }
.sv-cover-frame__photo,.sv-cover-frame .sv-media-fallback { width:100%; height:100%; object-fit:cover; border-radius:38px; overflow:hidden; background:#141b2d; }
.sv-cover-frame__photo { filter:saturate(.88) contrast(1.03); }
.sv-cover-frame__caption { position:absolute; z-index:6; left:46px; right:46px; bottom:44px; padding:14px 16px; border:1px solid rgba(255,255,255,.15); border-radius:18px; background:rgba(9,14,28,.52); backdrop-filter:blur(18px); }
.sv-cover-frame__caption span,.sv-cover-frame__caption small { display:block; }
.sv-cover-frame__caption span { font:500 1rem "Playfair Display",serif; }
.sv-cover-frame__caption small { margin-top:3px; color:rgba(255,255,255,.5); font-size:.62rem; letter-spacing:.1em; }
.sv-media-fallback { display:grid; place-items:center; grid-auto-flow:column; gap:10px; color:rgba(255,255,255,.75); font:500 clamp(3rem,7vw,6rem) "Playfair Display",serif; background:radial-gradient(circle at 30% 20%,rgba(255,185,216,.22),transparent 35%),linear-gradient(135deg,#1b2238,#171426 50%,#102933); }
.sv-media-fallback b { color:var(--sv-pink); font-size:.5em; font-style:italic; }
.sv-swipe-cue { position:absolute; left:50%; bottom:26px; transform:translateX(-50%); display:flex; gap:10px; color:rgba(255,255,255,.35); font-size:.59rem; letter-spacing:.12em; text-transform:uppercase; }
.sv-swipe-cue i { font-style:normal; animation:svCue 1.8s ease-in-out infinite; }

/* Couple */
.sv-stage--couple { padding:96px 62px 50px; }
.sv-couple-stack { position:relative; min-height:650px; display:grid; grid-template-columns:1fr .34fr 1fr; align-items:center; gap:12px; }
.sv-person { position:relative; min-width:0; }
.sv-person__photo { position:relative; width:min(100%,360px); aspect-ratio:.72; overflow:hidden; border-radius:210px 210px 34px 34px; border:1px solid rgba(255,255,255,.18); background:#111829; box-shadow:0 30px 80px rgba(0,0,0,.3); }
.sv-person__photo::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%,rgba(8,12,24,.38)); pointer-events:none; }
.sv-person__photo > img { width:100%; height:100%; object-fit:cover; }
.sv-person .sv-media-fallback { width:100%; height:100%; }
.sv-person__text { position:absolute; z-index:4; width:min(88%,320px); bottom:-42px; padding:18px 20px; border:1px solid rgba(255,255,255,.15); border-radius:22px; background:rgba(9,13,27,.72); backdrop-filter:blur(20px); box-shadow:0 18px 42px rgba(0,0,0,.22); }
.sv-person--bride .sv-person__text { left:11%; }
.sv-person--groom .sv-person__text { right:11%; text-align:right; }
.sv-person__text small { color:var(--sv-pink); font-size:.58rem; letter-spacing:.16em; }
.sv-person__text h2 { margin:3px 0 2px; font:500 clamp(2rem,4vw,3.6rem)/1 "Playfair Display",serif; }
.sv-person__text p { margin:0; color:rgba(255,255,255,.7); font-size:.72rem; }
.sv-person__text > span { display:block; margin-top:7px; color:rgba(255,255,255,.4); font-size:.62rem; line-height:1.45; }
.sv-person--groom { justify-self:end; --sv-base-y:46px; }
.sv-couple-amp { align-self:center; text-align:center; z-index:6; }
.sv-couple-amp span { display:block; font:italic 5.5rem/1 "Playfair Display",serif; color:var(--sv-pink); text-shadow:0 0 40px rgba(255,173,207,.22); }
.sv-couple-amp small { display:block; width:130px; margin:9px 0 0 50%; transform:translateX(-50%); color:rgba(255,255,255,.34); font-size:.55rem; letter-spacing:.12em; text-transform:uppercase; }
.sv-social-row { position:absolute; left:50%; bottom:28px; transform:translateX(-50%); display:flex; gap:8px; z-index:7; }
.sv-scene.sv-is-active .sv-social-row { transform:translateX(-50%); }
.sv-social-row a { display:inline-flex; align-items:center; gap:7px; padding:8px 12px; border:1px solid rgba(255,255,255,.12); border-radius:999px; color:rgba(255,255,255,.64); background:rgba(12,17,32,.42); text-decoration:none; font-size:.64rem; }

/* Save the date */
.sv-film-line { position:absolute; left:0; right:0; top:13%; width:100%; opacity:.7; pointer-events:none; }
.sv-stage--date { padding:74px 58px 44px; grid-template-columns:.85fr 1.2fr; gap:45px; }
.sv-date-story__top { align-self:start; }
.sv-date-story__top strong { display:block; margin-top:14px; font-size:.74rem; font-weight:500; letter-spacing:.19em; color:rgba(255,255,255,.56); }
.sv-date-story__number { align-self:center; justify-self:center; grid-row:1 / span 2; grid-column:1; text-align:center; }
.sv-date-story__number span { display:block; font:500 clamp(10rem,18vw,16rem)/.74 "Playfair Display",serif; letter-spacing:-.08em; background:linear-gradient(155deg,#fff 20%,#ffc7dc 60%,#89eaff); -webkit-background-clip:text; color:transparent; }
.sv-date-story__number i { display:block; margin-top:18px; color:rgba(255,255,255,.35); font-style:normal; font-size:.75rem; letter-spacing:.55em; }
.sv-date-story__info { grid-column:2; grid-row:1 / span 2; display:grid; gap:18px; align-self:center; }
.sv-event-tile { position:relative; overflow:hidden; padding:27px 28px; min-height:220px; border:1px solid rgba(255,255,255,.13); border-radius:30px; background:linear-gradient(135deg,rgba(255,255,255,.085),rgba(255,255,255,.025)); backdrop-filter:blur(12px); }
.sv-event-tile::before { content:""; position:absolute; inset:0; background:url("assets/cards/event-glass.svg") center/100% 100% no-repeat; opacity:.55; pointer-events:none; }
.sv-event-tile > * { position:relative; z-index:2; }
.sv-event-tile > span { color:rgba(255,255,255,.36); font-size:.6rem; letter-spacing:.15em; text-transform:uppercase; }
.sv-event-tile h3 { margin:12px 0 20px; font:500 clamp(2rem,3.3vw,3.1rem)/1 "Playfair Display",serif; }
.sv-event-tile time { display:block; color:rgba(255,255,255,.72); font-size:.8rem; }
.sv-event-tile p { margin:5px 0 0; color:var(--sv-cyan); font-size:.74rem; }
.sv-event-tile small { display:block; margin-top:12px; color:rgba(255,255,255,.42); line-height:1.5; }
.sv-event-tile--reception { margin-left:12%; }

/* Countdown */
.sv-stage--countdown { grid-template-columns:.9fr 1.1fr; gap:60px; padding:70px; }
.sv-countdown-story__copy h2 { margin:16px 0 20px; font:500 clamp(3.4rem,6vw,6.2rem)/.9 "Playfair Display",serif; letter-spacing:-.04em; }
.sv-countdown-story__copy h2 em { color:var(--sv-cyan); }
.sv-countdown-story__copy p { color:rgba(255,255,255,.48); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; }
.sv-countdown-orbit { position:relative; width:min(100%,520px); aspect-ratio:1; justify-self:center; display:grid; grid-template-columns:1fr 1fr; gap:14px; padding:58px; }
.sv-countdown-orbit::before,.sv-countdown-orbit::after { content:""; position:absolute; inset:7%; border:1px solid rgba(255,255,255,.08); border-radius:50%; }
.sv-countdown-orbit::after { inset:17%; border-style:dashed; animation:svSpin 30s linear infinite; }
.sv-countdown-orbit > img { position:absolute; inset:34%; width:32%; opacity:.65; animation:svSpin 24s linear infinite reverse; }
.sv-count-unit { position:relative; z-index:3; display:grid; place-items:center; align-content:center; min-width:0; border:1px solid rgba(255,255,255,.12); border-radius:28px; background:rgba(255,255,255,.045); backdrop-filter:blur(13px); box-shadow:inset 0 1px rgba(255,255,255,.06); }
.sv-count-unit strong { font:500 clamp(2.8rem,5vw,5.2rem)/1 "Playfair Display",serif; font-variant-numeric:tabular-nums; }
.sv-count-unit span { margin-top:5px; color:rgba(255,255,255,.4); font-size:.58rem; letter-spacing:.15em; text-transform:uppercase; }
.sv-countdown-status { position:absolute; left:70px; bottom:42px; margin:0; color:var(--sv-pink); font-size:.68rem; }

/* Journey */
.sv-stage--journey { padding:104px 58px 46px; }
.sv-journey-deck { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; align-items:end; }
.sv-journey-card { position:relative; min-height:360px; padding:30px 26px; display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; border:1px solid rgba(255,255,255,.13); border-radius:34px; background:linear-gradient(155deg,rgba(255,255,255,.095),rgba(255,255,255,.025)); backdrop-filter:blur(12px); transform:translate3d(0,calc((var(--sv-card-index) - 1) * 16px),0); }
.sv-scene.sv-is-active .sv-journey-card { transform:translate3d(0,calc((var(--sv-card-index) - 1) * 16px),0); }
.sv-journey-card::after { content:""; position:absolute; width:170px; height:170px; right:-70px; top:-70px; border-radius:50%; background:radial-gradient(circle,rgba(255,188,214,.18),transparent 67%); }
.sv-journey-card__index { color:rgba(255,255,255,.14); font:500 4.8rem/1 "Playfair Display",serif; }
.sv-journey-card small { color:var(--sv-cyan); font-size:.62rem; letter-spacing:.15em; }
.sv-journey-card h3 { margin:9px 0 12px; font:500 clamp(1.6rem,2.4vw,2.5rem)/1.05 "Playfair Display",serif; }
.sv-journey-card p { margin:0; color:rgba(255,255,255,.55); font-size:.77rem; line-height:1.65; }
.sv-journey-empty { justify-self:center; text-align:center; max-width:520px; }
.sv-journey-empty span { font:italic 8rem/1 "Playfair Display",serif; color:rgba(255,255,255,.12); }
.sv-journey-empty h3 { margin:-20px 0 12px; font:500 2.6rem "Playfair Display",serif; }
.sv-journey-empty p { color:rgba(255,255,255,.55); line-height:1.7; }
.sv-video-link { position:absolute; right:52px; bottom:34px; display:inline-flex; align-items:center; gap:18px; padding:10px 14px 10px 18px; border:1px solid rgba(255,255,255,.13); border-radius:999px; color:#fff; text-decoration:none; background:rgba(9,14,28,.52); }
.sv-video-link span { font-size:.68rem; }
.sv-video-link i { font-style:normal; }

/* Gallery */
.sv-stage--gallery { grid-template-columns:.7fr 1.3fr; gap:46px; padding:92px 48px 46px 58px; }
.sv-gallery-copy h2 { margin:16px 0 18px; font:500 clamp(3.2rem,5vw,5.4rem)/.9 "Playfair Display",serif; letter-spacing:-.04em; }
.sv-gallery-copy h2 em { color:var(--sv-pink); }
.sv-gallery-copy p { color:rgba(255,255,255,.42); font-size:.67rem; letter-spacing:.12em; text-transform:uppercase; }
.sv-gallery-shell { min-width:0; }
.sv-gallery-track { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(260px,74%); gap:16px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scrollbar-width:none; padding:18px 2px 28px; }
.sv-gallery-track::-webkit-scrollbar { display:none; }
.sv-gallery-card { position:relative; padding:0; aspect-ratio:.73; overflow:hidden; border:1px solid rgba(255,255,255,.13); border-radius:36px; background:#11182a; scroll-snap-align:center; cursor:zoom-in; box-shadow:0 24px 70px rgba(0,0,0,.28); }
.sv-gallery-card img { width:100%; height:100%; object-fit:cover; transition:transform .8s cubic-bezier(.22,.8,.23,1),filter .4s ease; }
.sv-gallery-card::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 58%,rgba(7,10,19,.62)); pointer-events:none; }
.sv-gallery-card:hover img { transform:scale(1.035); }
.sv-gallery-card.is-broken { cursor:default; background:radial-gradient(circle at 30% 20%,rgba(255,191,216,.15),transparent 36%),linear-gradient(145deg,#172035,#101522); }
.sv-gallery-card.is-broken::before { content:"Photo unavailable"; position:absolute; inset:0; z-index:1; display:grid; place-items:center; color:rgba(255,255,255,.45); font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; }
.sv-media-fallback--error { position:absolute; inset:0; z-index:1; font-size:3.4rem; }
.sv-gallery-card > span { position:absolute; z-index:3; left:18px; right:18px; bottom:16px; display:flex; align-items:end; justify-content:space-between; color:#fff; }
.sv-gallery-card b { font:500 2rem "Playfair Display",serif; }
.sv-gallery-card small { color:rgba(255,255,255,.6); font-size:.58rem; letter-spacing:.1em; }
.sv-gallery-controls { display:flex; align-items:center; justify-content:center; gap:18px; }
.sv-gallery-controls button { width:36px; height:36px; border:1px solid rgba(255,255,255,.14); border-radius:50%; color:#fff; background:rgba(255,255,255,.04); cursor:pointer; }
.sv-gallery-controls span { min-width:70px; text-align:center; color:rgba(255,255,255,.42); font-size:.62rem; letter-spacing:.14em; }
.sv-gallery-controls i { color:#fff; font-style:normal; }
.sv-gallery-empty { min-height:400px; display:grid; place-items:center; align-content:center; gap:18px; border:1px dashed rgba(255,255,255,.15); border-radius:34px; color:rgba(255,255,255,.48); text-align:center; }
.sv-gallery-empty img { width:44px; filter:brightness(0) invert(1); opacity:.5; }
.sv-gallery-empty p { max-width:320px; line-height:1.6; }

/* Location */
.sv-stage--location { grid-template-columns:1.2fr .8fr; gap:42px; padding:66px; }
.sv-location-map { position:relative; height:620px; overflow:hidden; border:1px solid rgba(255,255,255,.12); border-radius:38px; background:linear-gradient(145deg,rgba(105,231,255,.08),rgba(255,184,213,.035)); }
.sv-map-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px); background-size:48px 48px; transform:perspective(700px) rotateX(54deg) scale(1.45) translateY(-5%); transform-origin:center bottom; }
.sv-map-route { position:absolute; left:9%; right:7%; top:48%; height:160px; border-top:2px dashed rgba(145,235,255,.55); border-radius:50%; transform:rotate(-17deg); }
.sv-map-route::after { content:""; position:absolute; right:6%; top:-7px; width:11px; height:11px; border-radius:50%; background:var(--sv-cyan); box-shadow:0 0 30px var(--sv-cyan); }
.sv-map-pin { position:absolute; left:61%; top:35%; width:72px; height:72px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.16); border-radius:50%; background:rgba(15,21,39,.74); box-shadow:0 18px 50px rgba(0,0,0,.3); }
.sv-map-pin::before { content:""; position:absolute; inset:-20px; border:1px dashed rgba(255,255,255,.12); border-radius:50%; animation:svSpin 18s linear infinite; }
.sv-map-pin img { width:28px; filter:brightness(0) invert(1); }
.sv-map-label { position:absolute; padding:7px 10px; border:1px solid rgba(255,255,255,.1); border-radius:8px; background:rgba(7,12,25,.72); color:rgba(255,255,255,.52); font-size:.54rem; letter-spacing:.13em; }
.sv-map-label--a { left:9%; bottom:20%; }
.sv-map-label--b { left:65%; top:24%; }
.sv-location-card { padding:34px; border:1px solid rgba(255,255,255,.12); border-radius:34px; background:rgba(255,255,255,.055); backdrop-filter:blur(14px); }
.sv-location-card h2 { margin:17px 0 14px; font:500 clamp(2.8rem,4.6vw,4.8rem)/.94 "Playfair Display",serif; }
.sv-location-card > p { color:rgba(255,255,255,.56); font-size:.78rem; line-height:1.65; }
.sv-location-card__meta { display:flex; flex-wrap:wrap; gap:8px; margin:22px 0; }
.sv-location-card__meta span { padding:7px 10px; border:1px solid rgba(255,255,255,.1); border-radius:999px; color:rgba(255,255,255,.58); font-size:.62rem; }
.sv-action { display:flex; align-items:center; gap:11px; width:max-content; max-width:100%; padding:10px 12px; border:1px solid rgba(255,255,255,.14); border-radius:999px; color:#11182a; background:linear-gradient(135deg,#fff,#dbf8ff); text-decoration:none; }
.sv-action img { width:20px; height:20px; filter:none; }
.sv-action span { font-size:.68rem; font-weight:600; }
.sv-action i { font-style:normal; margin-left:6px; }

/* Forms */
.sv-stage--form { grid-template-columns:.8fr 1.2fr; gap:56px; padding:68px; }
.sv-form-intro h2 { margin:16px 0 18px; font:500 clamp(3.3rem,5.3vw,5.8rem)/.9 "Playfair Display",serif; letter-spacing:-.04em; }
.sv-form-intro h2 em { color:var(--sv-cyan); }
.sv-form-intro > p { max-width:420px; color:rgba(255,255,255,.56); font-size:.82rem; line-height:1.7; }
.sv-mini-reaction { margin-top:28px; display:flex; align-items:center; gap:10px; color:rgba(255,255,255,.4); }
.sv-mini-reaction span { display:grid; place-items:center; width:38px; height:38px; border:1px solid rgba(255,255,255,.12); border-radius:50%; color:var(--sv-pink); }
.sv-mini-reaction small { font-size:.6rem; letter-spacing:.1em; }
.sv-form,.sv-wish-form { padding:28px; border:1px solid rgba(255,255,255,.14); border-radius:34px; background:linear-gradient(145deg,rgba(255,255,255,.085),rgba(255,255,255,.025)); backdrop-filter:blur(18px); box-shadow:0 28px 80px rgba(0,0,0,.22); }
.sv-form__header { display:flex; justify-content:space-between; gap:16px; margin-bottom:18px; color:rgba(255,255,255,.42); font-size:.58rem; letter-spacing:.12em; text-transform:uppercase; }
.sv-field { display:grid; gap:7px; margin:0 0 14px; }
.sv-field > span { color:rgba(255,255,255,.56); font-size:.64rem; letter-spacing:.06em; }
.sv-field > span small { color:rgba(255,255,255,.3); }
.sv-field input,.sv-field textarea,.sv-field select { width:100%; min-height:46px; padding:11px 13px; border:1px solid rgba(255,255,255,.12); border-radius:14px; outline:none; color:#fff; background:rgba(8,13,27,.56); box-shadow:none; transition:border-color .2s ease,background .2s ease; }
.sv-field textarea { resize:vertical; min-height:88px; }
.sv-field select { appearance:none; }
.sv-field input::placeholder,.sv-field textarea::placeholder { color:rgba(255,255,255,.25); }
.sv-field input:focus,.sv-field textarea:focus,.sv-field select:focus { border-color:rgba(146,236,255,.55); background:rgba(8,13,27,.78); }
.sv-field-grid { display:grid; grid-template-columns:1fr .7fr; gap:12px; }
.sv-attendance { margin:0 0 14px; padding:0; border:0; }
.sv-attendance legend { margin-bottom:7px; color:rgba(255,255,255,.56); font-size:.64rem; }
.sv-attendance { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
.sv-attendance legend { grid-column:1/-1; }
.sv-attendance label { cursor:pointer; }
.sv-attendance input { position:absolute; opacity:0; pointer-events:none; }
.sv-attendance span { min-height:38px; padding:0 8px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.1); border-radius:12px; color:rgba(255,255,255,.48); background:rgba(255,255,255,.025); font-size:.6rem; text-align:center; transition:.2s ease; }
.sv-attendance input:checked + span { border-color:rgba(255,195,218,.55); color:#fff; background:rgba(255,185,214,.12); }
.sv-submit { width:100%; min-height:47px; padding:0 15px 0 18px; border:0; border-radius:15px; color:#101522; background:linear-gradient(135deg,#fff,#ffe7f1 54%,#d9f8ff); display:flex; align-items:center; justify-content:space-between; cursor:pointer; font-weight:600; }
.sv-submit i { font-style:normal; }
.sv-submit:disabled { opacity:.55; cursor:wait; }
.sv-form-status { min-height:18px; margin:10px 0 0; color:rgba(255,255,255,.58); font-size:.64rem; line-height:1.4; }
.sv-form-status.is-success { color:#b7ffd7; }
.sv-form-status.is-error { color:#ffc0ca; }

/* Gift */
.sv-stage--gift { grid-template-columns:.72fr 1.28fr; gap:50px; padding:70px 58px; }
.sv-gift-copy h2 { margin:16px 0 18px; font:500 clamp(3.5rem,5.5vw,5.9rem)/.9 "Playfair Display",serif; }
.sv-gift-copy h2 em { color:var(--sv-pink); }
.sv-gift-copy > p { max-width:430px; color:rgba(255,255,255,.56); font-size:.8rem; line-height:1.7; }
.sv-gift-address { margin-top:22px; padding:14px 16px; border-left:1px solid rgba(255,255,255,.2); }
.sv-gift-address small,.sv-gift-address span { display:block; }
.sv-gift-address small { color:rgba(255,255,255,.34); font-size:.56rem; letter-spacing:.13em; }
.sv-gift-address span { margin-top:5px; color:rgba(255,255,255,.6); font-size:.7rem; line-height:1.55; }
.sv-gift-stack { display:grid; gap:16px; }
.sv-gift-pass { position:relative; min-height:220px; padding:26px 34px; overflow:hidden; transform:translateX(calc(var(--sv-gift-index) * 18px)); }
.sv-scene.sv-is-active .sv-gift-pass { transform:translateX(calc(var(--sv-gift-index) * 18px)); }
.sv-gift-pass > img:first-child { position:absolute; inset:0; z-index:-1; width:100%; height:100%; object-fit:fill; }
.sv-gift-pass__body { display:flex; justify-content:space-between; gap:20px; }
.sv-gift-pass__body small { color:rgba(255,255,255,.38); font-size:.56rem; letter-spacing:.14em; }
.sv-gift-pass__body h3 { margin:6px 0 0; font:500 1.9rem "Playfair Display",serif; }
.sv-gift-pass__body > span { color:rgba(255,255,255,.14); font:500 3rem "Playfair Display",serif; }
.sv-gift-pass > strong { display:block; margin:24px 0 3px; font-size:clamp(1.3rem,2.5vw,2.2rem); letter-spacing:.05em; font-weight:500; word-break:break-all; }
.sv-gift-pass > p { margin:0; color:rgba(255,255,255,.45); font-size:.68rem; }
.sv-copy { position:absolute; right:32px; bottom:24px; min-height:38px; padding:0 12px; border:1px solid rgba(255,255,255,.12); border-radius:999px; color:#fff; background:rgba(255,255,255,.045); display:flex; align-items:center; gap:8px; cursor:pointer; }
.sv-copy img { width:17px; filter:brightness(0) invert(1); }
.sv-copy span,.sv-copy b { font-size:.58rem; font-weight:500; }
.sv-copy b { display:none; color:#b8ffd7; }
.sv-copy.is-copied span { display:none; }
.sv-copy.is-copied b { display:block; }

/* Wishes */
.sv-stage--wishes { grid-template-columns:1.1fr .8fr; gap:38px; padding:76px 58px 48px; }
.sv-wishes-feed { min-width:0; }
.sv-wishes-feed__title h2 { margin:15px 0 26px; font:500 clamp(3.1rem,4.8vw,5.1rem)/.91 "Playfair Display",serif; }
.sv-wishes-feed__title h2 em { color:var(--sv-cyan); }
.sv-wishes-list { display:grid; gap:12px; max-height:440px; overflow:auto; scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.18) transparent; padding-right:8px; }
.sv-wish { display:flex; gap:12px; padding:17px 18px; border:1px solid rgba(255,255,255,.11); border-radius:20px 20px 20px 5px; background:rgba(255,255,255,.05); }
.sv-wish__avatar { flex:0 0 34px; width:34px; height:34px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.14); border-radius:50%; background:rgba(255,255,255,.05); font-size:.64rem; }
.sv-wish strong { font-size:.7rem; }
.sv-wish p { margin:4px 0 5px; color:rgba(255,255,255,.6); font-size:.73rem; line-height:1.55; }
.sv-wish small { color:rgba(255,255,255,.28); font-size:.54rem; }
.sv-wishes-empty { color:rgba(255,255,255,.4); font-size:.76rem; line-height:1.6; }
.sv-wish-form { align-self:center; }
.sv-wish-form__icon { width:46px; height:46px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.12); border-radius:50%; background:rgba(255,255,255,.04); }
.sv-wish-form__icon img { width:22px; filter:brightness(0) invert(1); }
.sv-wish-form h3 { margin:14px 0 20px; font:500 2rem "Playfair Display",serif; }

/* Closing */
.sv-scene--closing { background:#070912; }
.sv-closing-media { position:absolute; inset:0; z-index:-2; }
.sv-closing-media > img { width:100%; height:100%; object-fit:cover; opacity:.34; filter:grayscale(.15) saturate(.7); }
.sv-closing-media > div { position:absolute; inset:0; background:linear-gradient(180deg,rgba(4,6,14,.45),rgba(4,6,14,.84)),radial-gradient(circle at 50% 40%,transparent,rgba(4,6,14,.72)); }
.sv-camera-corners--closing { inset:6%; width:88%; height:88%; opacity:.42; }
.sv-stage--closing { min-height:100svh; margin:0; padding:70px; place-items:center; text-align:center; align-content:center; }
.sv-stage--closing::before { display:none; }
.sv-stage--closing h2 { margin:18px 0 22px; font:500 clamp(4.1rem,8vw,8.4rem)/.84 "Playfair Display",serif; letter-spacing:-.055em; }
.sv-stage--closing h2 em { color:var(--sv-pink); }
.sv-stage--closing > p { max-width:520px; margin:0 auto; color:rgba(255,255,255,.58); line-height:1.75; }
.sv-closing-names { display:flex; align-items:center; justify-content:center; gap:15px; margin-top:34px; font:500 clamp(1.6rem,3vw,2.6rem) "Playfair Display",serif; }
.sv-closing-names i { color:var(--sv-cyan); font-style:italic; }
.sv-closing-credit { position:absolute; bottom:34px; color:rgba(255,255,255,.28); font-size:.55rem; letter-spacing:.18em; }

/* Lightbox */
.sv-lightbox[hidden] { display:none; }
.sv-lightbox { position:fixed; inset:0; z-index:150; display:grid; place-items:center; padding:22px; background:rgba(4,6,13,.94); backdrop-filter:blur(18px); }
.sv-lightbox > img { max-width:min(92vw,980px); max-height:88svh; object-fit:contain; border-radius:22px; box-shadow:0 30px 120px rgba(0,0,0,.5); }
.sv-lightbox > button { position:absolute; right:max(18px,env(safe-area-inset-right)); top:max(18px,env(safe-area-inset-top)); z-index:3; width:44px; height:44px; border:1px solid rgba(255,255,255,.18); border-radius:50%; color:#fff; background:rgba(255,255,255,.06); cursor:pointer; font-size:1.5rem; }
.sv-lightbox__grain { position:absolute; inset:0; pointer-events:none; background:url("assets/misc/grain.svg"); opacity:.22; mix-blend-mode:soft-light; }

/* KEYFRAMES */
@keyframes svOpeningZoom { from{transform:scale(1.1)} to{transform:scale(1.025)} }
@keyframes svLeakDrift { from{transform:translate3d(-6%,0,0) rotate(-3deg)} to{transform:translate3d(5%,4%,0) rotate(4deg)} }
@keyframes svGesture { 0%,100%{transform:translate(-50%,0);opacity:.35} 50%{transform:translate(-50%,11px);opacity:1} }
@keyframes svSpin { to{transform:rotate(360deg)} }
@keyframes svReactionFloat { 0%,100%{transform:translate3d(0,0,0) rotate(-4deg);opacity:.15} 25%{opacity:.9} 50%{transform:translate3d(-12px,-30px,0) rotate(8deg);opacity:.75} 75%{opacity:.32} }
@keyframes svCue { 0%,100%{transform:translateY(0);opacity:.4} 50%{transform:translateY(6px);opacity:1} }

/* RESPONSIVE */
@media (max-width: 1180px) {
    .sv-side-rail { display:none; }
    .sv-stage { width:min(calc(100% - 32px),1050px); }
    .sv-stage--opening,.sv-stage--countdown,.sv-stage--location,.sv-stage--form,.sv-stage--gift,.sv-stage--wishes { padding-left:48px; padding-right:48px; }
    .sv-couple-stack { min-height:610px; }
}

@media (max-width: 900px) {
    .sv-stage { min-height:auto; margin:32px auto; }
    .sv-stage--opening { padding:90px 38px 54px; }
    .sv-opening-story__grid { grid-template-columns:1fr .8fr; gap:28px; }
    .sv-opening-story__copy h2 { font-size:clamp(3rem,7vw,5rem); }
    .sv-cover-frame { width:min(100%,350px); }
    .sv-stage--couple { padding:92px 34px 64px; }
    .sv-couple-stack { min-height:560px; }
    .sv-person__photo { width:min(100%,300px); }
    .sv-couple-amp span { font-size:4.2rem; }
    .sv-stage--date { padding:72px 34px 42px; gap:26px; }
    .sv-date-story__number span { font-size:9rem; }
    .sv-stage--countdown { padding:62px 38px; gap:26px; }
    .sv-countdown-orbit { padding:42px; }
    .sv-stage--journey { padding:98px 34px 58px; }
    .sv-journey-deck { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .sv-stage--gallery { padding:88px 34px 42px; grid-template-columns:.8fr 1.2fr; gap:24px; }
    .sv-stage--location { padding:40px; gap:28px; }
    .sv-location-map { height:520px; }
    .sv-stage--form,.sv-stage--gift,.sv-stage--wishes { padding:54px 38px; gap:30px; }
}

@media (max-width: 767px) {
    html.sv-html { scroll-snap-type:none; }
    .sv-grain { opacity:.22; }
    .sv-reactions { right:8px; bottom:80px; width:36px; height:32vh; opacity:.7; }
    .sv-reaction { width:20px; }
    .sv-music { width:44px; height:44px; right:max(12px,env(safe-area-inset-right)); bottom:max(12px,env(safe-area-inset-bottom)); }
    .sv-story-progress { gap:3px; left:max(10px,env(safe-area-inset-left)); right:max(10px,env(safe-area-inset-right)); }
    .sv-stage { width:100%; margin:0; min-height:100svh; border-radius:0; }
    .sv-stage::before { inset:0; border-width:0; border-radius:0; background:linear-gradient(180deg,rgba(255,255,255,.035),transparent 24%,rgba(255,255,255,.015)); }
    .sv-story-head { top:36px; left:18px; right:18px; }
    .sv-opening__content { padding-left:22px; padding-right:22px; }
    .sv-opening__content h1 { font-size:clamp(3.35rem,16vw,5.2rem); }
    .sv-opening__content h1 span:last-child { margin-left:7%; }
    .sv-opening__meta { left:18px; }
    .sv-camera-corners { inset:2.5%; width:95%; height:95%; }
    .sv-gesture-hint { right:16px; }

    .sv-stage--opening { padding:104px 20px 64px; display:block; }
    .sv-opening-story__grid { display:flex; flex-direction:column; gap:28px; }
    .sv-opening-story__copy { padding:0 5px; z-index:5; }
    .sv-opening-story__copy h2 { margin:14px 0 14px; font-size:clamp(3rem,13vw,4.8rem); }
    .sv-opening-story__copy p { margin-bottom:16px; font-size:.9rem; }
    .sv-cover-frame { width:min(78vw,330px); margin:-4px 0 0 auto; aspect-ratio:.72; }
    .sv-cover-frame__caption { left:38px; right:38px; bottom:40px; }
    .sv-swipe-cue { bottom:20px; }

    .sv-stage--couple { padding:102px 18px 82px; }
    .sv-couple-stack { min-height:780px; display:block; }
    .sv-person { position:absolute; width:72%; max-width:300px; }
    .sv-person--bride { left:2%; top:12%; }
    .sv-person--groom { right:1%; bottom:8%; --sv-base-y:0px; }
    .sv-person__photo { width:100%; }
    .sv-person--groom .sv-person__photo { border-radius:34px 34px 190px 190px; }
    .sv-person__text { width:88%; bottom:-34px; padding:14px 15px; }
    .sv-person__text h2 { font-size:2rem; }
    .sv-couple-amp { position:absolute; left:50%; top:49%; transform:translate(-50%,-50%); }
    .sv-scene.sv-is-active .sv-couple-amp { transform:translate(-50%,-50%); }
    .sv-couple-amp span { font-size:4.5rem; }
    .sv-social-row { bottom:18px; max-width:90%; overflow:auto; scrollbar-width:none; }

    .sv-stage--date { padding:84px 18px 34px; display:block; }
    .sv-date-story__top { position:absolute; top:85px; left:20px; }
    .sv-date-story__number { padding-top:68px; text-align:right; }
    .sv-date-story__number span { font-size:clamp(8rem,42vw,12rem); }
    .sv-date-story__number i { margin-top:9px; }
    .sv-date-story__info { margin-top:18px; gap:10px; }
    .sv-event-tile { min-height:0; padding:20px; border-radius:24px; }
    .sv-event-tile h3 { margin:8px 0 12px; font-size:2.1rem; }
    .sv-event-tile--reception { margin-left:9%; }

    .sv-stage--countdown { padding:88px 20px 52px; display:flex; flex-direction:column; justify-content:center; gap:18px; }
    .sv-countdown-story__copy h2 { font-size:clamp(3.1rem,13vw,4.6rem); }
    .sv-countdown-orbit { width:min(100%,430px); padding:44px; gap:10px; }
    .sv-count-unit { border-radius:22px; }
    .sv-count-unit strong { font-size:clamp(2.7rem,13vw,4rem); }
    .sv-countdown-status { left:20px; bottom:18px; }

    .sv-stage--journey { padding:96px 18px 48px; }
    .sv-journey-deck { display:flex; overflow-x:auto; gap:12px; scroll-snap-type:x mandatory; scrollbar-width:none; padding:12px 2px 28px; }
    .sv-journey-card { flex:0 0 min(78vw,310px); min-height:380px; scroll-snap-align:center; transform:none!important; }
    .sv-video-link { position:static; margin:4px 0 0 auto; width:max-content; }

    .sv-stage--gallery { padding:84px 18px 34px; display:block; }
    .sv-gallery-copy h2 { font-size:clamp(3.1rem,12vw,4.4rem); }
    .sv-gallery-shell { margin-top:22px; }
    .sv-gallery-track { grid-auto-columns:78%; }
    .sv-gallery-card { border-radius:28px; }

    .sv-stage--location { padding:78px 18px 30px; display:flex; flex-direction:column-reverse; justify-content:center; gap:14px; }
    .sv-location-map { width:100%; height:42svh; min-height:300px; border-radius:28px; }
    .sv-location-card { padding:22px; border-radius:26px; }
    .sv-location-card h2 { font-size:clamp(2.6rem,11vw,4rem); }

    .sv-stage--form { padding:82px 16px 30px; display:block; }
    .sv-form-intro { margin-bottom:18px; }
    .sv-form-intro h2 { font-size:clamp(3.1rem,12vw,4.4rem); }
    .sv-form-intro > p { font-size:.76rem; }
    .sv-mini-reaction { display:none; }
    .sv-form,.sv-wish-form { padding:20px 16px; border-radius:24px; }
    .sv-field-grid { grid-template-columns:1fr 1fr; }
    .sv-attendance { grid-template-columns:repeat(3,minmax(0,1fr)); }

    .sv-stage--gift { padding:80px 16px 34px; display:block; }
    .sv-gift-copy h2 { font-size:clamp(3.1rem,12vw,4.5rem); }
    .sv-gift-stack { margin-top:24px; }
    .sv-gift-pass { min-height:205px; padding:22px; transform:none!important; }
    .sv-gift-pass > strong { margin-top:18px; max-width:70%; font-size:1.25rem; }
    .sv-copy { right:18px; bottom:20px; }

    .sv-stage--wishes { padding:82px 16px 30px; display:block; }
    .sv-wishes-feed__title h2 { font-size:clamp(3rem,12vw,4.3rem); }
    .sv-wishes-list { max-height:250px; margin-bottom:18px; }
    .sv-wish-form h3 { font-size:1.7rem; }

    .sv-stage--closing { padding:64px 18px; }
    .sv-stage--closing h2 { font-size:clamp(4rem,17vw,6rem); }
    .sv-closing-credit { bottom:max(18px,env(safe-area-inset-bottom)); }
}

@media (max-width: 430px) {
    .sv-opening__content > p { font-size:.82rem; }
    .sv-opening__content h1 { font-size:clamp(3.05rem,15.7vw,4.55rem); }
    .sv-open-btn { min-height:48px; }
    .sv-cover-frame { width:min(76vw,300px); }
    .sv-person { width:69%; }
    .sv-person--bride { top:14%; }
    .sv-person--groom { bottom:10%; }
    .sv-couple-stack { min-height:740px; }
    .sv-date-story__number span { font-size:9rem; }
    .sv-countdown-orbit { padding:38px; }
    .sv-count-unit strong { font-size:2.7rem; }
    .sv-field-grid { grid-template-columns:1fr; gap:0; }
    .sv-attendance span { font-size:.56rem; padding:0 5px; }
    .sv-gift-pass__body h3 { font-size:1.55rem; }
}

@media (max-width: 375px) {
    .sv-opening__content { padding-left:18px; padding-right:18px; }
    .sv-opening__content h1 { font-size:3.2rem; }
    .sv-opening__content > p { line-height:1.55; }
    .sv-stage--opening { padding-left:16px; padding-right:16px; }
    .sv-opening-story__copy h2 { font-size:3.05rem; }
    .sv-cover-frame { width:72vw; }
    .sv-person { width:70%; }
    .sv-person__text p { font-size:.65rem; }
    .sv-couple-amp small { display:none; }
    .sv-date-story__number span { font-size:8rem; }
    .sv-event-tile h3 { font-size:1.85rem; }
    .sv-countdown-story__copy h2 { font-size:3rem; }
    .sv-countdown-orbit { padding:34px; }
    .sv-count-unit strong { font-size:2.4rem; }
    .sv-gallery-track { grid-auto-columns:82%; }
    .sv-location-card h2 { font-size:2.65rem; }
    .sv-form-intro h2,.sv-gift-copy h2,.sv-wishes-feed__title h2 { font-size:3rem; }
}

@media (min-width: 1280px) {
    .sv-stage { width:min(calc(100% - 250px),var(--sv-stage-max)); }
}

@media (min-width: 1440px) {
    .sv-stage { --sv-stage-max:1260px; }
    .sv-opening-story__grid { grid-template-columns:1.1fr .72fr; }
    .sv-cover-frame { width:450px; }
}

@media (prefers-reduced-motion: reduce) {
    html.sv-html { scroll-behavior:auto; }
    .sv-opening__bg img,.sv-light-leak,.sv-gesture-hint i,.sv-music span,.sv-reaction,.sv-countdown-orbit::after,.sv-countdown-orbit > img,.sv-map-pin::before,.sv-swipe-cue i { animation:none!important; }
    .sv-reveal,.sv-appear { opacity:1!important; transform:none!important; transition:none!important; }
    .sv-depth { transform:none!important; transition:none!important; }
    .sv-gallery-card img,.sv-open-btn { transition:none!important; }
}


/* =========================================================
   DreamDay Storyverse — layout polish + richer motion v1.0.1
   ========================================================= */

/* Navigation rule: chapter sidebar is label-only, never numbered. */
.sv-side-rail{width:132px}
.sv-side-rail__chapters button{gap:8px;min-height:29px}
.sv-side-rail__chapters button small{display:block;font-size:.57rem;letter-spacing:.09em;text-transform:uppercase;white-space:nowrap}
.sv-side-rail__chapters button.is-active small{display:block}

/* First content story: the old SVG sat outside the photo because its canvas
   was larger than the media box. Use one frame that follows the photo exactly. */
.sv-stage--opening::before{opacity:.48}
.sv-cover-frame{padding:20px}
.sv-cover-frame .sv-frame-art{display:none}
.sv-cover-frame::after{content:"";position:absolute;z-index:5;inset:20px;border:1px solid rgba(255,255,255,.26);border-radius:38px;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(126,230,255,.05),0 0 34px rgba(255,183,214,.08)}
.sv-cover-frame__photo,.sv-cover-frame .sv-media-fallback{border-radius:38px}
.sv-cover-frame__caption{left:40px;right:40px;bottom:38px}

/* Couple: cards are anchored to the same width as their portraits. */
.sv-person{width:min(100%,360px)}
.sv-person--bride{justify-self:start}
.sv-person--groom{justify-self:end}
.sv-person__text{left:14px!important;right:14px!important;width:auto;bottom:-34px;padding:17px 18px;border-radius:20px;overflow:hidden}
.sv-person__text h2{font-size:clamp(1.9rem,3.2vw,3rem);line-height:.96;overflow-wrap:anywhere}
.sv-person__text p,.sv-person__text>span{overflow-wrap:anywhere}
.sv-person--groom .sv-person__text{text-align:right}

/* Event scene: keep the real date visible and every event fully inside one card. */
.sv-stage--date{grid-template-columns:minmax(210px,.68fr) minmax(0,1.32fr);gap:34px;padding:74px 52px 46px}
.sv-date-story__number{width:100%;max-width:300px;justify-self:center;overflow:visible}
.sv-date-story__number span{font-size:clamp(6.6rem,12vw,10.5rem);line-height:.8;letter-spacing:-.055em;white-space:nowrap}
.sv-date-story__number i{margin-top:14px;letter-spacing:.34em}
.sv-date-story__info{width:100%;max-width:620px;justify-self:end;gap:16px}
.sv-event-tile{min-height:0;padding:26px 28px 24px;border-radius:28px;background:linear-gradient(135deg,rgba(255,255,255,.09),rgba(255,255,255,.035));box-shadow:inset 0 1px rgba(255,255,255,.055),0 18px 48px rgba(0,0,0,.12)}
.sv-event-tile::before{display:none}
.sv-event-tile--reception{margin-left:7%}
.sv-event-tile>span{display:inline-block;margin-bottom:2px;color:rgba(255,255,255,.46)}
.sv-event-tile h3{margin:9px 0 15px;font-size:clamp(2rem,3.1vw,2.9rem);line-height:.96;overflow-wrap:anywhere}
.sv-event-tile time{max-width:100%;font-size:.82rem;line-height:1.45;white-space:normal;overflow-wrap:anywhere}
.sv-event-tile p{margin-top:5px}
.sv-event-tile small{margin-top:10px;overflow-wrap:anywhere}

/* Map CTA: explicit contrast so text remains readable in all browsers. */
.sv-action{min-height:46px;padding:0 16px;border-color:rgba(255,255,255,.34);background:linear-gradient(135deg,#fff 0%,#f8f4ff 48%,#d7f8ff 100%);box-shadow:0 12px 30px rgba(0,0,0,.18)}
.sv-action span,.sv-action i{color:#0d1424!important;opacity:1!important;text-shadow:none!important}
.sv-action span{font-size:.7rem;font-weight:700;letter-spacing:.02em}
.sv-action img{filter:brightness(0) saturate(100%)!important;opacity:.88}

/* Gift: use the glass card itself as the content frame; no copy control outside. */
.sv-gift-stack{gap:18px}
.sv-gift-pass{min-height:0;padding:28px 30px 26px;border:1px solid rgba(255,255,255,.15);border-radius:28px;background:linear-gradient(135deg,rgba(255,255,255,.075),rgba(255,255,255,.025));box-shadow:inset 0 1px rgba(255,255,255,.05),0 20px 55px rgba(0,0,0,.15);overflow:hidden;transform:none!important}
.sv-scene.sv-is-active .sv-gift-pass{transform:none!important}
.sv-gift-pass>img:first-child{display:none}
.sv-gift-pass::before{content:"";position:absolute;right:-45px;top:-55px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(255,185,216,.14),transparent 67%);pointer-events:none}
.sv-gift-pass__body{display:block}
.sv-gift-pass__body>span{display:none!important}
.sv-gift-pass__body h3{margin:6px 0 0;font-size:clamp(1.8rem,3vw,2.45rem)}
.sv-gift-pass>strong{max-width:100%;margin:22px 0 5px;font-size:clamp(1.3rem,2.45vw,2rem);word-break:break-word;overflow-wrap:anywhere}
.sv-gift-pass>p{max-width:100%;overflow-wrap:anywhere}
.sv-copy{position:static;width:max-content;max-width:100%;margin-top:20px;min-height:40px;padding:0 13px}

/* Extra story motion. Animations run only while their scene is active. */
.sv-scene.sv-is-active .sv-cover-frame__photo{animation:svMediaBreath 7s ease-in-out infinite}
.sv-scene.sv-is-active .sv-cover-frame::after{animation:svFrameGlow 4.8s ease-in-out infinite}
.sv-scene.sv-is-active .sv-person__photo{animation:svPortraitFloat 6.2s ease-in-out infinite}
.sv-scene.sv-is-active .sv-person--groom .sv-person__photo{animation-delay:-2.6s}
.sv-scene.sv-is-active .sv-person__text{animation:svGlassPulse 4.6s ease-in-out infinite}
.sv-scene.sv-is-active .sv-couple-amp span{animation:svAmpBreath 4s ease-in-out infinite}
.sv-scene.sv-is-active .sv-date-story__number span{animation:svDateGlow 4.2s ease-in-out infinite}
.sv-scene.sv-is-active .sv-event-tile{animation:svGlassPulse 5.2s ease-in-out infinite}
.sv-scene.sv-is-active .sv-event-tile--reception{animation-delay:-2.5s}
.sv-scene.sv-is-active .sv-count-unit:nth-child(1),.sv-scene.sv-is-active .sv-count-unit:nth-child(3){animation:svCountFloat 4.8s ease-in-out infinite}
.sv-scene.sv-is-active .sv-count-unit:nth-child(2),.sv-scene.sv-is-active .sv-count-unit:nth-child(4){animation:svCountFloat 5.4s ease-in-out -2.1s infinite}
.sv-scene.sv-is-active .sv-journey-card>div:last-child{animation:svInnerDrift 5.8s ease-in-out infinite}
.sv-scene.sv-is-active .sv-gallery-card:nth-child(odd) img{animation:svMediaBreath 7.8s ease-in-out infinite}
.sv-scene.sv-is-active .sv-gallery-card:nth-child(even) img{animation:svMediaBreath 8.6s ease-in-out -3s infinite}
.sv-scene.sv-is-active .sv-map-route{animation:svRoutePulse 3.4s ease-in-out infinite}
.sv-scene.sv-is-active .sv-map-pin{animation:svPinPulse 2.8s ease-in-out infinite}
.sv-scene.sv-is-active .sv-action{animation:svActionNudge 3.2s ease-in-out infinite}
.sv-scene.sv-is-active .sv-gift-pass::before{animation:svGiftGlow 5s ease-in-out infinite}
.sv-scene.sv-is-active .sv-gift-pass:nth-child(even)::before{animation-delay:-2.4s}
.sv-scene.sv-is-active .sv-wish:nth-child(odd){animation:svWishFloat 5.8s ease-in-out infinite}
.sv-scene.sv-is-active .sv-wish:nth-child(even){animation:svWishFloat 6.6s ease-in-out -2.4s infinite}
.sv-scene--closing.sv-is-active .sv-closing-media>img{animation:svClosingZoom 12s ease-in-out infinite alternate}
.sv-scene--closing.sv-is-active .sv-camera-corners--closing{animation:svFrameGlow 5s ease-in-out infinite}
.sv-scene--closing.sv-is-active .sv-closing-names{animation:svNamesFloat 5.4s ease-in-out infinite}

@keyframes svMediaBreath{0%,100%{transform:scale(1)}50%{transform:scale(1.018)}}
@keyframes svFrameGlow{0%,100%{opacity:.68;filter:drop-shadow(0 0 0 rgba(255,185,216,0))}50%{opacity:1;filter:drop-shadow(0 0 12px rgba(255,185,216,.22))}}
@keyframes svPortraitFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-9px,0)}}
@keyframes svGlassPulse{0%,100%{box-shadow:inset 0 1px rgba(255,255,255,.05),0 18px 48px rgba(0,0,0,.12)}50%{box-shadow:inset 0 1px rgba(255,255,255,.08),0 24px 62px rgba(0,0,0,.2)}}
@keyframes svAmpBreath{0%,100%{transform:scale(1);text-shadow:0 0 30px rgba(255,173,207,.16)}50%{transform:scale(1.06);text-shadow:0 0 52px rgba(255,173,207,.34)}}
@keyframes svDateGlow{0%,100%{filter:drop-shadow(0 0 0 rgba(142,235,255,0));opacity:.9}50%{filter:drop-shadow(0 0 22px rgba(142,235,255,.22));opacity:1}}
@keyframes svCountFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-7px,0)}}
@keyframes svInnerDrift{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-6px,0)}}
@keyframes svRoutePulse{0%,100%{opacity:.42;filter:drop-shadow(0 0 0 rgba(133,235,255,0))}50%{opacity:1;filter:drop-shadow(0 0 9px rgba(133,235,255,.28))}}
@keyframes svPinPulse{0%,100%{transform:scale(1);box-shadow:0 18px 50px rgba(0,0,0,.3)}50%{transform:scale(1.07);box-shadow:0 18px 58px rgba(133,235,255,.18)}}
@keyframes svActionNudge{0%,100%{transform:translateX(0)}50%{transform:translateX(5px)}}
@keyframes svGiftGlow{0%,100%{transform:scale(.94);opacity:.62}50%{transform:scale(1.08);opacity:1}}
@keyframes svWishFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-6px,0)}}
@keyframes svClosingZoom{from{transform:scale(1.02)}to{transform:scale(1.07)}}
@keyframes svNamesFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-6px,0)}}

@media (max-width:900px){
  .sv-stage--date{grid-template-columns:minmax(180px,.62fr) minmax(0,1.38fr);gap:22px;padding-left:30px;padding-right:30px}
  .sv-date-story__number span{font-size:clamp(6rem,15vw,8rem)}
  .sv-event-tile--reception{margin-left:0}
}

@media (max-width:767px){
  .sv-cover-frame{padding:16px}
  .sv-cover-frame::after{inset:16px;border-radius:30px}
  .sv-cover-frame__photo,.sv-cover-frame .sv-media-fallback{border-radius:30px}
  .sv-cover-frame__caption{left:32px;right:32px;bottom:32px}
  .sv-person{width:72%;max-width:300px}
  .sv-person__text{left:10px!important;right:10px!important;bottom:-28px;padding:13px 14px}
  .sv-person__text h2{font-size:clamp(1.7rem,8vw,2rem)}
  .sv-stage--date{display:flex;flex-direction:column;padding:84px 18px 36px;gap:16px}
  .sv-date-story__top{position:static;order:1}
  .sv-date-story__number{order:2;max-width:none;padding-top:0;text-align:left;display:flex;align-items:flex-end;gap:15px}
  .sv-date-story__number span{font-size:clamp(5.5rem,25vw,8rem);line-height:.78}
  .sv-date-story__number i{margin:0 0 8px;letter-spacing:.25em}
  .sv-date-story__info{order:3;margin-top:0;max-width:none;gap:12px}
  .sv-event-tile{padding:21px 20px 20px}
  .sv-event-tile--reception{margin-left:0}
  .sv-event-tile time{font-size:.76rem}
  .sv-action{width:100%;justify-content:flex-start}
  .sv-action i{margin-left:auto}
  .sv-gift-pass{padding:24px 22px 22px}
  .sv-gift-pass>strong{max-width:100%;margin-top:18px;font-size:1.3rem}
  .sv-copy{margin-top:17px}
}

@media (max-width:430px){
  .sv-date-story__number span{font-size:clamp(5.2rem,24vw,6.8rem)}
  .sv-date-story__number i{font-size:.65rem}
  .sv-person{width:69%}
  .sv-person__text h2{font-size:1.75rem}
  .sv-gift-pass{border-radius:24px}
}

@media (prefers-reduced-motion:reduce){
  .sv-scene.sv-is-active .sv-cover-frame__photo,.sv-scene.sv-is-active .sv-cover-frame::after,.sv-scene.sv-is-active .sv-person__photo,.sv-scene.sv-is-active .sv-person__text,.sv-scene.sv-is-active .sv-couple-amp span,.sv-scene.sv-is-active .sv-date-story__number span,.sv-scene.sv-is-active .sv-event-tile,.sv-scene.sv-is-active .sv-count-unit,.sv-scene.sv-is-active .sv-journey-card>div:last-child,.sv-scene.sv-is-active .sv-gallery-card img,.sv-scene.sv-is-active .sv-map-route,.sv-scene.sv-is-active .sv-map-pin,.sv-scene.sv-is-active .sv-action,.sv-scene.sv-is-active .sv-gift-pass::before,.sv-scene.sv-is-active .sv-wish,.sv-scene--closing.sv-is-active .sv-closing-media>img,.sv-scene--closing.sv-is-active .sv-camera-corners--closing,.sv-scene--closing.sv-is-active .sv-closing-names{animation:none!important}
}
