:root {
  --cream: #f7f1e6; --paper: #eee0cb; --rose: #c98684;
  --burgundy: #792a32; --red: #9d4146; --gold: #c4a16a; --ink: #3c2b2a;
  --font-display: Georgia, 'Times New Roman', 'Noto Serif', serif;
  --font-body: Georgia, 'Times New Roman', serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: #eee9df; color: var(--ink); font-family: var(--font-body); }
button, select, input, textarea { font: inherit; }
button { cursor: pointer; }
.site-shell { width: min(100%, 460px); margin: 0 auto; min-height: 100svh; background: var(--cream); overflow: clip; box-shadow: 0 10px 45px #35252418; }
.cover { position: fixed; inset: 0; width: 100%; height: 100svh; min-height: 100svh; overflow: hidden; background: linear-gradient(180deg, #f7f1e6f5 0%, #f7f1e6d9 24%, #f7f1e64d 50%, #f7f1e600 66%), #f3e7d5 url('assets/svg/bg-cover.svg') center/cover no-repeat; padding: max(48px, env(safe-area-inset-top)) 18px max(32px, env(safe-area-inset-bottom)); display:flex; flex-direction:column; align-items:center; justify-content: center; text-align:center; gap: 10px; transition: opacity 720ms ease; }
.cover-inner { display:flex; flex-direction:column; align-items:center; justify-content:center; width:100%; gap:10px; transition: transform 900ms cubic-bezier(.4,0,.2,1); }
.cover-copy { position:relative; z-index:1; margin-top: 13px; }
.cover-visual { position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; width:100%; }
.cover.is-departing { opacity:0; pointer-events:none; }
.cover.is-departing .cover-inner { transform: perspective(1600px) rotateX(6deg) translateY(-16px) scale(.99); }
.cover-skip { margin-top: 2px; min-height:44px; padding: 8px 12px; border:0; background:none; color:#7a6157; font-size:11px; letter-spacing:.05em; text-decoration:underline; text-underline-offset:4px; text-decoration-color:#c9b49c; }
.cover-skip:hover { color: var(--burgundy); }
.eyebrow, .section-intro { font-size: 10px; letter-spacing: .32em; font-weight: 700; color: var(--burgundy); }
.cover-title { font-size: clamp(27px, 7vw, 39px); font-weight: 400; font-style: italic; margin: 12px 0 6px; line-height: 1.15; }
.cover-title em { color: var(--gold); font-size: .72em; }
.sub, .hint { font-size: 13px; opacity: .8; }
.cover-guest { margin: 18px 0 0; font: italic 17px/1.4 var(--font-display); letter-spacing: .01em; color: var(--burgundy); }
.cover-seats { margin: 7px 0 0; font-size: 9px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: #8a6a4f; }
.envelope-hit { display:block; margin: 36px auto 10px; padding: 0; background: transparent; border: 0; width: min(100%, 390px); min-height: 240px; perspective: 1200px; }
.envelope { position:relative; display: block; width: 100%; aspect-ratio:900/620; transform-style:preserve-3d; filter: drop-shadow(0 12px 18px #51362b32); }
.envelope > span { position:absolute; display:block; background-position:center; background-size:100% 100%; background-repeat:no-repeat; }
.envelope-back { inset:0; background-image:url('assets/svg/envelope-back.svg'); z-index:1; }
.letter-peek { left:15%; top:11%; width:70%; height:78%; z-index:2; background-image:url('assets/svg/letter-paper.svg'); color:var(--burgundy); display:flex!important; flex-direction: column; justify-content:center; align-items:center; gap:8px; padding:0 8% 6%; font-style:italic; font-size:25px; transition:transform 900ms cubic-bezier(.18,.65,.15,1); }
.letter-peek small { font-size:7px; font-style:normal; letter-spacing:.05em; text-align:center; }
.letter-peek .peek-name { max-width: 100%; font-size: clamp(11px, 3vw, 14px); line-height: 1.25; overflow-wrap: anywhere; text-align:center; }
.peek-divider { width: 35%; height:1px; background: var(--gold); }
.envelope-front { inset:0; background-image:url('assets/svg/envelope-front.svg'); z-index:3; }
.envelope-flap { top: 7%; left:0; height:58%; width:100%; z-index:4; background-image:url('assets/svg/envelope-flap.svg'); transform-origin:50% 0; transition: transform 700ms ease, opacity 700ms; backface-visibility:hidden; }
.red-string { top: 59%; left:6%; width:88%; height:1.2%; z-index:4; background:var(--burgundy); opacity:.78; transition:opacity .2s; }
.wax-seal { left:42.5%; top:49%; width:15%; aspect-ratio:1; z-index:5; background-image:url('assets/svg/wax-seal.svg'); transition:transform .5s,opacity .5s; }
.red-tassel { top:60%; left:44.7%; width:11%; height:29%; z-index:4; background-image:url('assets/svg/red-tassel.svg'); transition:opacity .35s; }
.envelope.is-opening .wax-seal { opacity:0; transform:translateY(12px) scale(.72); transition-delay:0ms; }
.envelope.is-opening .red-string, .envelope.is-opening .red-tassel { opacity:0; transition-delay:70ms; }
.envelope.is-opening .envelope-flap { transform:rotateX(179deg); transition-delay:180ms; }
.envelope.is-opening .letter-peek { transform:translateY(-34%); transition-delay:640ms; }
.primary, .secondary { border:0; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; gap:14px; padding:14px 28px; font-size:15px; text-decoration:none; }
.primary { background:linear-gradient(130deg,#8a343b,#6f1d2c); color:#fff8ed; box-shadow: 0 3px 0 #511923, 0 8px 25px #671f2129; }
.secondary { color:var(--burgundy); border:1px solid #b99566; background:#fff8ee80; }
.cover-open-btn { width: min(72%, 290px); }
.hint { margin: 8px 0 0; }
.invitation[hidden], .cover[hidden] { display:none!important; }
.invitation { animation: exhibit .85s cubic-bezier(.2,.7,.2,1) both; background:var(--cream); }
.invitation:focus { outline: none; }
@keyframes exhibit { from {opacity:0; transform:translateY(26px)} to {opacity:1; transform:none} }
.compact-head { position:sticky; top:0; z-index:30; display:none; align-items:center; gap:8px; min-height:53px; padding:0 14px; padding-top: env(safe-area-inset-top, 0px); background:#f8f1e5f2; border-bottom:1px solid #e4d6c1; -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); }
.head-seal { width:24px; height:24px; flex:none; }
.seal-mark { display:inline-block; background-color:var(--burgundy); -webkit-mask:url('assets/svg/double-happiness.svg?v=vector-2') center/contain no-repeat; mask:url('assets/svg/double-happiness.svg?v=vector-2') center/contain no-repeat; }
.closing-seal { display:flex; justify-content:center; }
.closing-seal.seal-mark { width:46px; height:46px; margin:0 auto; }
.head-brand { display:none; flex:1; font-size:9px; letter-spacing:.18em; color:var(--burgundy); opacity:.72; white-space:nowrap; }
.head-nav { display:none; gap:0; margin-left:auto; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.head-nav::-webkit-scrollbar { display:none; }
.head-nav a { display:inline-flex; align-items:center; min-height:44px; padding:0 8px; font-size:10px; letter-spacing:.11em; text-transform:uppercase; text-decoration:none; color:var(--burgundy); white-space:nowrap; }
.head-nav a:hover, .head-nav a:focus-visible { text-decoration:underline; text-underline-offset:4px; }
.lang-switch { display:flex; align-items:center; gap:2px; margin-left:8px; font-size:10px; letter-spacing:.08em; }
.lang-switch button { padding:6px 4px; border:0; background:none; color:#8a6a4f; font-size:10px; letter-spacing:.1em; }
.lang-switch button[aria-pressed="true"] { color:var(--burgundy); font-weight:700; text-decoration:underline; text-underline-offset:3px; }
.lang-switch span { color:#c9b49c; }
.lang-switch--floating { position:fixed; top:max(10px, env(safe-area-inset-top)); right:max(12px, calc((100vw - 460px) / 2 + 12px)); z-index:50; margin-left:0; padding:5px 10px; border:1px solid #b99566; border-radius:999px; background:#fff9f0e8; box-shadow:0 4px 14px #51362b20; -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.text-btn { background:transparent; border:0; font-size:11px; color:var(--burgundy); }
.hero { min-height: 100svh; position:relative; display:flex; flex-direction: column; justify-content:flex-end; overflow:hidden; text-align:center; background:var(--cream); }
.hero-image-wrap { position:absolute; top:0; left:0; width:100%; height:75%; }
.hero-image { width:100%; height:100%; object-fit:cover; object-position:center 20%; }
.hero-image-fade { position:absolute; inset:0; background:linear-gradient(180deg,transparent 45%,#f7f1e6 98%); }
.hero-copy { position:relative; padding:180px 25px 54px; background:url('assets/svg/pavilion-landscape.svg') bottom/100% auto no-repeat; }
.hero h2 { color:var(--burgundy); font:italic 39px/1.15 var(--font-display); font-weight:400; margin: 17px 0 0; }
.hero h2 em { color:var(--gold); font-size: .72em; }
.hero p { font-size:15px; line-height:1.7; }
.hero-fullnames { font-size:11px!important; letter-spacing:.04em; line-height:1.7!important; color:#6b524a; margin:12px 0 0; }
.hero-date { border: 1px solid #b99566; border-radius:30px; padding:10px 6px; margin:25px auto 0; max-width:310px; font-size:12px!important; letter-spacing:.08em; }
@media (max-width: 959px) {
  .hero-copy {
    background:
      linear-gradient(180deg, #2b141200 0%, #2b141240 18%, #2b1412b8 45%, #2b1412e6 100%),
      url('assets/svg/pavilion-landscape.svg') bottom/100% auto no-repeat;
  }
  .hero .eyebrow { color: var(--gold); }
  .hero h2 { color: var(--cream); text-shadow: 0 2px 16px #2b141280; }
  .hero h2 em { color: var(--gold); }
  .hero p { color: #f7f1e6; }
  .hero-fullnames { color: #e6d5c4!important; }
  .hero-date { color: var(--cream); border-color: #c4a16a99; background:#2b141226; }
}
.divider-img { display:block; width:205px; max-width:100%; margin:12px auto 16px; height:22px; object-fit:contain; }
.paper-section { padding:90px 32px 94px; background:url('assets/svg/bg-letter.svg') center/100% 100% no-repeat; text-align:center; }
h2 { font:italic normal 35px/1.2 var(--font-display); margin:15px 0; color:var(--burgundy); }
.detail-list { text-align:left; max-width:330px; margin:37px auto; display:grid; gap:16px; }
.detail-row { display:flex; gap:16px; padding:20px 18px; border:1px solid #d8c5ac; border-radius:6px; background:#fff9f0a8; box-shadow:0 10px 26px #51281a0a; }
.detail-icon { width:28px; flex:none; color:var(--burgundy); font-size:22px; line-height:1.2; }
.detail-icon svg { display:block; width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.detail-row b { font-size:15px; color:var(--burgundy); }
.detail-row p { margin:7px 0; font-size:14px; line-height:1.6; }
.detail-row .detail-venue { margin:10px 0 0; padding-top:10px; border-top:1px solid #e4d6c1; font-size:12px; color:#6b524a; }
.detail-note { margin:22px auto 0; font-size:12px; line-height:1.6; color:#6b524a; font-style:italic; }
.couple-intro { max-width:340px; margin:0 auto; font-size:14px; line-height:1.7; font-style:italic; color:#6b524a; }
.couple-grid { max-width:360px; margin:34px auto 0; display:flex; flex-direction:column; align-items:center; gap:14px; }
.couple-section { position:relative; }
.couple-section::after {
  content:"";
  position:absolute;
  left:32px;
  right:32px;
  bottom:18px;
  height:1px;
  background:linear-gradient(90deg, transparent, #c4a16a80 20%, #c4a16a80 80%, transparent);
}
.couple-card { width:100%; padding:26px 20px; border:1px solid #d8c5ac; border-radius:6px; background:#fff9f0a8; box-shadow:0 10px 26px #51281a0a; }
.couple-role { font-size:10px; letter-spacing:.24em; text-transform:uppercase; color:var(--gold); }
.couple-name { font:italic normal 24px/1.3 var(--font-display); margin:10px 0 0; color:var(--burgundy); }
.couple-card .divider-img { width:150px; margin:12px auto 10px; }
.couple-parents { margin:0; font-size:14px; line-height:1.8; color:#6b524a; }
.couple-parents span { display:block; margin-bottom:4px; font-size:12px; font-style:italic; color:var(--burgundy); }
.couple-amp { font:italic normal 34px/1 var(--font-display); color:var(--gold); }
.interlude-divider { position:relative; overflow:hidden; padding:54px 32px 58px; text-align:center; background:radial-gradient(circle at 0% 0%,#240d15e6 0%,#240d1500 44%),radial-gradient(circle at 100% 100%,#240d15e6 0%,#240d1500 44%),linear-gradient(135deg,#6d1b28,#8d343c 55%,#671a26); border-block:1px solid #b9956680; color:var(--cream); }
.interlude-divider::before, .interlude-divider::after { content:""; position:absolute; z-index:0; width:clamp(150px,26vw,300px); height:clamp(150px,26vw,300px); opacity:.55; pointer-events:none; }
.interlude-divider::before { top:-34px; left:-34px; background:url('assets/blossoms/branch-left.webp') left top/contain no-repeat; transform:rotate(-6deg); }
.interlude-divider::after { right:-34px; bottom:-34px; background:url('assets/blossoms/branch-right.webp') right bottom/contain no-repeat; transform:rotate(6deg); }
.interlude-divider > * { position:relative; z-index:1; }
.interlude-ornament { display:flex; align-items:center; justify-content:center; gap:14px; color:#d9b47b; }
.interlude-ornament span { display:block; width:min(90px,22vw); height:1px; background:linear-gradient(90deg,transparent,#d9b47b); }
.interlude-ornament span:last-child { background:linear-gradient(90deg,#d9b47b,transparent); }
.interlude-ornament b { font:normal 18px/1 var(--font-display); }
.interlude-divider .divider-img { width:135px; margin:14px auto 16px; opacity:.95; }
.interlude-quote { max-width:24ch; margin:0 auto; font:italic 400 clamp(20px,6vw,24px)/1.5 var(--font-display); color:#fff6e9; text-shadow:0 2px 16px #2b141280; }
.countdown-section { padding:56px 26px 58px; text-align:center; color:var(--cream); background:linear-gradient(135deg,#6d1b28,#8d343c 55%,#671a26); }
.countdown-section h2 { color:#fff6e9; margin:12px 0 26px; }
.countdown-section .section-intro { color:var(--gold); }
.countdown-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; max-width:360px; margin:0 auto 18px; }
.count-box { padding:11px 2px 9px; border:1px solid #e5cda254; border-radius:4px; background:#fff8ef0a; }
.count-num { display:block; font:400 clamp(22px,7vw,30px)/1 var(--font-display); color:#f0d6a8; font-variant-numeric:tabular-nums; }
.count-label { display:block; margin-top:6px; font-size:7px; letter-spacing:.18em; text-transform:uppercase; color:#fff6e899; }
.countdown-note { margin:0; font-size:9.5px; letter-spacing:.18em; color:#fff6e8b8; }
.story-section { text-align:center; padding:90px 30px 100px; background: #f3e6d5; }
.story-section p { font-size:16px; line-height:1.8; font-style:italic; }
.story-lead { max-width:330px; margin:0 auto; }
.milestones { list-style:none; max-width:340px; margin:38px auto 0; padding:0 0 0 25px; text-align:left; position:relative; }
.milestones::before { content:""; position:absolute; top:6px; bottom:6px; left:5px; width:1px; background:linear-gradient(transparent,#c4a16ab3,transparent); }
.milestones li { position:relative; padding:0 0 24px 8px; }
.milestones li:last-child { padding-bottom:0; }
.milestones li::before { content:""; position:absolute; top:5px; left:-24.5px; width:9px; height:9px; border:1px solid var(--gold); border-radius:50%; background:#f3e6d5; box-shadow:0 0 0 4px #c4a16a21; }
.milestone-date { font-size:8px; font-weight:700; letter-spacing:.24em; color:#a8844f; }
.milestones h3 { margin:3px 0 4px; font:italic 400 19px/1.3 var(--font-display); color:var(--burgundy); }
.milestones p { margin:0; font-size:12.5px!important; line-height:1.7!important; font-style:normal!important; color:#5a443e; }
.story-divider { margin-top:34px; }
.photo-frame { position:relative; margin:32px auto 35px; width:min(100%,300px); aspect-ratio:800/1050; padding:13px; }
.photo-frame>img:first-child { display:block; width:100%; height:100%; object-fit:cover; object-position:center 18%; }
.photo-frame .frame-overlay {position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.rsvp-section { background-image:url('assets/svg/bg-rsvp.svg'); }
@media (max-width: 959px) {
  .rsvp-copy { position:relative; isolation:isolate; }
  .rsvp-copy::before { content:""; position:absolute; z-index:-1; inset:-28px -20px -18px; background:radial-gradient(78% 82% at 50% 45%, #f7f1e6 0%, #f7f1e6fa 68%, #f7f1e600 90%); }
}
.rsvp-intro { font-size:15px; line-height:1.6; }
.rsvp-deadline { display:inline-block; margin-top:8px; font-size:11px; letter-spacing:.08em; color:var(--burgundy); font-style:italic; }
.rsvp-late-notice { margin:14px 0 0; padding:10px 13px; border-left:2px solid var(--gold); background:#fff9f0a3; color:#5a443e; font-size:12px; line-height:1.65; }
.guest-seat-note { margin:12px 0 0; padding:9px 12px; border:1px solid #d8c5ac; border-radius:4px; background:#fff9f0a8; font-size:11px; font-style:italic; letter-spacing:.03em; color:var(--burgundy); }
form { margin:42px auto 0; text-align:left; max-width:340px; }
.attendance, .events-choice { padding:0; margin:0 0 24px; border:0; display:grid; gap:10px; }
.attendance legend, .events-choice legend { font-size:14px; font-weight:bold; color:var(--burgundy); padding-bottom:11px; }
.attendance label, .events-choice label { display:block; }
.attendance input, .events-choice input { position:absolute; opacity:0; }
.attendance span, .events-choice span { display:block; border:1px solid #b99472; border-radius:30px; text-align:center; padding:13px; color:var(--burgundy); background:#fff9f0a3; }
.attendance input:checked + span, .events-choice input:checked + span { background:var(--burgundy); color:white; }
.attendance input:focus-visible + span, .events-choice input:focus-visible + span { outline:3px solid #c98684; outline-offset:2px; }
@media (min-width:700px) { .attendance { grid-template-columns:repeat(2,minmax(0,1fr)); } .attendance legend { grid-column:1 / -1; } }
.events-choice span { padding:11px; font-size:13px; }
.events-choice input:disabled + span { opacity:.5; cursor:not-allowed; }
.form-label { display:block; color:var(--burgundy); font-size:13px; font-weight:bold; margin:18px 0 8px; }
.field { background:#fffaf0b8; border:1px solid #caaa91; border-radius:9px; padding:12px 13px; width:100%; color:var(--ink); }
.field:focus { outline:2px solid var(--gold); }
.field:disabled { opacity:.55; cursor:not-allowed; }
.field-hint { margin:7px 0 0; font-size:10.5px; line-height:1.55; color:#6b524a; font-style:italic; }
.form-submit { width:100%; margin-top:22px; }
.form-submit:disabled { opacity:.6; cursor:progress; }
.rsvp-actions { display:grid; gap:8px; }
.rsvp-fields > .attendance { margin-bottom:0; }
.rsvp-fields > .form-label { margin-top:24px; }
.rsvp-fields > .field { display:block; }
.rsvp-fields > .guest-name-display { margin-top:0; margin-bottom:0; }
.rsvp-actions .form-submit { margin-top:22px; }
.text-button { border:0; background:none; color:var(--burgundy); padding:9px; text-decoration:underline; cursor:pointer; font:inherit; }
.saved-rsvp { padding:17px; border:1px solid #caaa91; border-radius:8px; background:#fffaf0b8; }
.saved-rsvp h3 { margin:0 0 12px; color:var(--burgundy); font:600 19px/1.3 var(--serif, Georgia, serif); }
.saved-rsvp dl { display:grid; grid-template-columns:minmax(90px, .8fr) 1.2fr; gap:8px 12px; margin:0; font-size:13px; line-height:1.5; }
.saved-rsvp dt { color:#6b524a; font-weight:600; }
.saved-rsvp dd { margin:0; overflow-wrap:anywhere; }
.saved-rsvp .form-submit { margin-top:18px; }
.rsvp-fields[hidden], .saved-rsvp[hidden], .rsvp-late-notice[hidden], .rsvp-actions [hidden] { display:none !important; }
.form-status { font-size:12px; margin:15px 0 0; line-height:1.6; }
.form-status.is-pending { color:#6b524a; font-style:italic; }
.form-status.is-saved { color:#6b524a; font-style:italic; }
.form-status.is-success { padding:10px 12px; border:1px solid #9bb98a; border-radius:4px; background:#f2f7ec; color:#3f5c33; }
.form-status.is-error { padding:10px 12px; border:1px solid #d3a79f; border-radius:4px; background:#fbf0ee; color:#7c3229; }
.form-status a { display:inline-block; margin-top:6px; color:var(--burgundy); text-decoration:underline; }
.hp-field { position:absolute; left:-9999px; width:1px; height:1px; opacity:0; pointer-events:none; }
.music-toggle { position:fixed; right:14px; bottom:max(14px, env(safe-area-inset-bottom)); z-index:40; width:42px; height:42px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid #b99566; border-radius:50%; background:#fff9f0e8; color:var(--burgundy); font-size:19px; line-height:1; box-shadow:0 6px 20px #51362b30; -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); transition:opacity .3s, transform .3s; }
.music-toggle[hidden] { display:none; }
.music-toggle:hover { transform:translateY(-1px); }
.music-toggle:focus-visible { outline:2px solid var(--rose); outline-offset:2px; }
.music-toggle.is-paused { color:#a08468; }
.music-toggle.is-paused span { opacity:.55; }
.music-toggle:not(.is-paused) span { animation:musicPulse 2.4s ease-in-out infinite; }
@keyframes musicPulse { 0%,100% { opacity:.55; } 50% { opacity:1; } }
.gift-section { background:#f3e6d5; }
.gift-intro { max-width:330px; margin:0 auto 28px; font-size:13.5px; line-height:1.8; color:#5a443e; }
.gift-card { max-width:340px; margin:0 auto 16px; padding:22px 20px; border:1px solid #d8c5ac; border-radius:6px; background:#fff9f0b8; text-align:left; box-shadow:0 10px 26px #51281a0a; }
.gift-card[hidden] { display:none; }
.gift-tabs { display:flex; max-width:340px; margin:0 auto 20px; padding:4px; gap:4px; border:1px solid #d8c5ac; border-radius:999px; }
.gift-tabs button { flex:1; padding:10px 12px; border:0; border-radius:999px; background:transparent; color:var(--burgundy); font:inherit; font-size:13px; cursor:pointer; }
.gift-tabs button[aria-selected="true"] { background:var(--burgundy); color:var(--cream); }
.gift-tabs button:focus-visible { outline:2px solid var(--rose); outline-offset:2px; }
.gift-tag { display:inline-block; margin-bottom:8px; font-size:8px; font-weight:700; letter-spacing:.24em; color:#a8844f; }
.gift-bank { margin:0; font:italic 19px/1.3 var(--font-display); color:var(--burgundy); }
.gift-number { margin:7px 0 2px; font:20px/1.3 var(--font-display); letter-spacing:.08em; color:var(--ink); font-variant-numeric:tabular-nums; }
.gift-owner { margin:0; font-size:11px; color:#6b524a; }
.gift-details { display:grid; gap:8px; margin:12px 0 0; }
.gift-details div { display:grid; grid-template-columns:88px 1fr; gap:8px; }
.gift-details dt { padding-top:2px; font-size:8.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:#a8844f; }
.gift-details dd { margin:0; font-size:12px; line-height:1.55; color:var(--ink); }
.gift-note { margin:14px 0; font-size:11px; line-height:1.7; color:#6b524a; }
.gift-actions { display:flex; flex-wrap:wrap; gap:8px; }
.gift-copy { margin-top:14px; padding:8px 14px; border:1px solid #b99472; border-radius:999px; background:transparent; color:var(--burgundy); font-size:10px; letter-spacing:.06em; }
.gift-copy:hover { background:#fff9f0; border-color:var(--burgundy); }
.gift-copy:focus-visible { outline:2px solid var(--rose); outline-offset:2px; }
.gift-actions .gift-copy { margin-top:0; }
.wishes-section { background:#fbf5ea; border-top:1px solid #e6d7c3; }
.wishes-intro { max-width:330px; margin:0 auto; font-size:13.5px; line-height:1.8; color:#5a443e; }
.wish-form { margin-top:30px; }
.wishes-empty { margin:26px auto 0; max-width:320px; font-size:12px; line-height:1.7; font-style:italic; color:#6b524a; }
.wish-list { list-style:none; margin:26px auto 0; padding:0; max-width:340px; display:grid; gap:12px; text-align:left; }
.wish-item { padding:16px 18px; border:1px solid #e2d2bd; border-radius:6px; background:#fffdf8; box-shadow:0 6px 18px #51281a08; }
.wish-text { margin:0 0 9px; font-size:13.5px; line-height:1.75; font-style:italic; color:#4a3733; overflow-wrap:anywhere; }
.wish-meta { margin:0; font-size:9px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:#a8844f; }
.closing { padding:125px 30px 140px; text-align:center; background:url('assets/svg/bg-cover.svg') center/cover no-repeat; }
.closing p { font-size:16px; font-style:italic; line-height:1.7; }
.footer-names { font:italic 23px var(--font-display); margin:40px 0 8px; color:var(--burgundy); }
.footer-date { margin:0 0 15px; font-size:10px!important; font-style:normal!important; letter-spacing:.22em; color:#6b524a; }
/* ------------------------------------------------------------------
   Reading motion
   Content is visible by default. Only when JavaScript enables
   `.motion-ready` do items wait for their one-time reveal, so a
   failed script can never leave the invitation blank.
------------------------------------------------------------------ */
.motion-ready [data-reveal] {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .65s ease, transform .65s cubic-bezier(.2,.7,.2,1);
  transition-delay: var(--reveal-delay, 0ms);
}
.motion-ready [data-reveal].is-visible { opacity: 1; transform: none; }

@keyframes wishIn { from {opacity:0; transform:translateY(12px)} to {opacity:1; transform:none} }
.wish-item--enter { animation: wishIn .55s ease both; }

section, footer { scroll-margin-top: 66px; }

/* ------------------------------------------------------------------
   Wider screens
------------------------------------------------------------------ */
@media (min-width: 700px) {
  .compact-head { display: flex; padding-inline: 22px; }
  .head-brand { display: block; }
  .head-nav { display: flex; }
  .head-nav a { padding-inline: 10px; }
  .lang-switch--floating { display: none; }
}

@media (min-width: 700px) and (max-width: 959px) {
  .site-shell { width: min(100%, 720px); }
  .paper-section { position: relative; padding: 82px 56px 88px; background: var(--cream) url('assets/svg/paper-texture.svg') center/cover no-repeat; }
  .paper-section::before,
  .paper-section::after { content: ""; position: absolute; pointer-events: none; }
  .paper-section::before { inset: 24px 28px; border: 1px solid #c4a16a59; }
  .paper-section::after { inset: 31px 35px; border: 1px solid #c4a16a2e; }
  .hero-copy { padding-inline: 44px; }
  .detail-list { grid-template-columns: 1fr 1fr; gap: 16px; max-width: 600px; }
}

@media (min-width: 960px) {
  .site-shell { width: min(100%, 1240px); }
  .compact-head { min-height: 60px; padding-inline: clamp(28px, 4vw, 56px); }
  .head-brand { font-size: 10px; letter-spacing: .22em; }
  .head-nav a { padding-inline: 14px; font-size: 10.5px; }

  /* Opening cover: invitation wording left, envelope right */
  .cover { padding: 56px clamp(48px, 6vw, 96px); background: linear-gradient(90deg, #f7f1e6f7 0%, #f7f1e6d9 30%, #f7f1e633 58%, #f7f1e600 76%), #f3e7d5 url('assets/svg/bg-cover.svg') center/cover no-repeat; }
  .cover-inner {
    display: grid;
    grid-template-columns: minmax(320px, 470px) minmax(0, 600px);
    justify-content: space-between;
    align-items: center;
    gap: clamp(48px, 6vw, 96px);
    width: min(100%, 1180px);
    text-align: left;
  }
  .cover-copy { margin-top: 0; text-align: left; }
  .cover-title { font-size: clamp(46px, 4.6vw, 64px); line-height: 1.05; }
  .cover .sub { font-size: 15px; }
  .cover-guest { margin-top: 24px; font-size: 22px; }
  .cover-seats { font-size: 9.5px; }
  .cover-visual { align-items: center; }
  .envelope-hit { width: min(100%, 540px); margin: 0 0 26px; }
  .cover-open-btn { width: min(100%, 300px); }
  .cover .hint, .cover-skip { margin-inline: 0; text-align: left; }

  /* Hero: photograph and invitation copy side by side */
  .hero {
    display: grid;
    grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr);
    min-height: min(820px, 92svh);
    text-align: left;
  }
  .hero-image-wrap { position: relative; height: 100%; min-height: 620px; }
  .hero-image { object-position: center 20%; }
  .hero-image-fade { background: linear-gradient(90deg, #f7f1e600 42%, #f7f1e6a8 78%, var(--cream) 99%); }
  .hero-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    text-align: left;
    padding: 92px clamp(40px, 4.5vw, 76px) 84px;
  }
  .hero h2 { font-size: clamp(46px, 4.2vw, 62px); line-height: 1.08; }
  .hero p { font-size: 16px; }
  .hero-fullnames { font-size: 11.5px!important; }
  .hero-date { margin: 26px 0 0; max-width: 330px; }
  .hero .divider-img { margin: 16px 0 14px; }

  /* Paper sections: a plain texture with a drawn frame instead of
     stretching the portrait letter artwork across wide screens. */
  .paper-section {
    position: relative;
    padding: 96px clamp(56px, 6vw, 96px) 104px;
    background: var(--cream) url('assets/svg/paper-texture.svg') center/cover no-repeat;
  }
  .paper-section::before,
  .paper-section::after { content: ""; position: absolute; pointer-events: none; }
  .paper-section::before { inset: 30px clamp(30px, 4vw, 58px); border: 1px solid #c4a16a59; }
  .paper-section::after { inset: 37px clamp(37px, 4.4vw, 65px); border: 1px solid #c4a16a2e; }

  .section-head { max-width: 780px; margin: 0 auto; text-align: center; }
  .section-head .divider-img { margin: 14px auto 18px; }

  h2 { font-size: 42px; }
  .section-intro { font-size: 10.5px; }

  .detail-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    max-width: 880px;
    margin: 36px auto 30px;
  }
  .detail-row { padding: 24px 22px; }
  .detail-row p { font-size: 15px; }
  .detail-row .detail-venue { font-size: 13px; }
  .details-actions { max-width: 880px; margin: 0 auto; }
  .detail-note { margin: 18px auto 0; }

  .countdown-section { padding: 76px clamp(40px, 6vw, 96px); }
  .countdown-section h2 { font-size: 40px; }
  .countdown-grid { max-width: 680px; gap: 12px; margin-bottom: 22px; }
  .count-box { padding: 18px 4px 14px; }
  .count-num { font-size: 42px; }
  .count-label { font-size: 8px; }

  .story-section { padding: 96px clamp(56px, 6vw, 96px) 104px; }
  .story-body {
    display: grid;
    grid-template-columns: minmax(0, 400px) minmax(0, 1fr);
    gap: clamp(48px, 5vw, 80px);
    align-items: start;
    max-width: 1020px;
    margin: 40px auto 0;
    text-align: left;
  }
  .photo-frame { width: 100%; margin: 4px 0 0; }
  .story-lead { max-width: 46ch; margin: 0 0 28px; }
  .milestones { max-width: none; margin: 0; padding-left: 28px; }
  .story-divider { margin-top: 56px; }

  .rsvp-section { padding-inline: clamp(56px, 6vw, 96px); }
  .rsvp-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 430px);
    gap: clamp(44px, 5vw, 76px);
    align-items: center;
    max-width: 1000px;
    margin: 0 auto;
    text-align: left;
  }
  .rsvp-copy h2 { margin: 14px 0 16px; }
  .rsvp-intro { font-size: 16.5px; }
  .rsvp-layout form { margin: 0; max-width: none; }
  .rsvp-section .guest-seat-note { margin-top: 22px; max-width: 360px; }

  .gift-intro { max-width: 520px; }
  .gift-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
    align-items: start;
    max-width: 560px;
    margin: 38px auto 0;
    text-align: left;
  }
  .gift-card { max-width: none; margin: 0; }
  .gift-details div { grid-template-columns: 108px 1fr; }

  .wishes-layout {
    display: grid;
    grid-template-columns: minmax(0, 430px) minmax(0, 1fr);
    gap: clamp(44px, 5vw, 76px);
    align-items: start;
    max-width: 1020px;
    margin: 0 auto;
    text-align: left;
  }
  .wishes-copy .divider-img { margin: 14px 0 16px; }
  .wishes-intro { max-width: none; }
  .wish-form { margin-top: 28px; }
  .wishes-feed { padding: 6px 0 0 48px; border-left: 1px solid #dccbb4; min-height: 320px; }
  .wishes-empty { margin: 0; max-width: 34ch; text-align: left; }
  .wish-list { margin-top: 0; max-width: none; }

  .closing { padding: 132px clamp(56px, 6vw, 96px) 152px; background-size: cover; }
  .closing h2 { font-size: 44px; }
  .footer-names { font-size: 29px; }
}

@media (min-width: 1300px) {
  .music-toggle { right: calc((100vw - 1240px) / 2 + 14px); }
}

@media (max-height:660px) {
  .cover { padding-top: 26px; padding-bottom: 22px; }
  .cover-copy { margin-top: 0; }
  .envelope-hit { margin: 22px auto 6px; }
  .cover-open-btn { padding: 12px 24px; }
  .hint { margin-top: 2px; }
  .hero-copy { padding-top: 130px; padding-bottom: 36px; }
  .hero h2 { font-size: 35px; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after {animation-duration:.01ms!important;transition-duration:.01ms!important; scroll-behavior:auto!important}
  .motion-ready [data-reveal] { opacity:1!important; transform:none!important; }
  .cover.is-departing .cover-inner { transform:none!important; }
}

/* Mobile decoration uses independent layers so it cannot stretch over content. */
@media (max-width: 959px) {
  .hero { min-height: 100vh; min-height: 100svh; background: #382321; }
  .hero-image-wrap { height: 100%; }
  .hero-image-fade { background: linear-gradient(180deg, transparent 25%, #38232155 48%, #382321 100%); }
  .hero-copy { background: linear-gradient(180deg, transparent, #382321aa 45%, #382321); padding-bottom: max(42px, env(safe-area-inset-bottom)); }
  .paper-section { position: relative; padding: 64px 32px; background: var(--cream); }
  #details { border-bottom: 1px solid #c4a16a80; }
  #details .section-head, .rsvp-copy { position: relative; padding: 18px 0 22px; }
  #details .section-head::before, #details .section-head::after,
  .rsvp-copy::before, .rsvp-copy::after {
    content: ""; position: absolute; inset: auto;
    top: 0; width: 30px; height: 30px; z-index: auto;
    background: url('assets/svg/corner-ornament.svg') center/contain no-repeat;
    pointer-events: none;
  }
  #details .section-head::before, .rsvp-copy::before { left: -16px; }
  #details .section-head::after, .rsvp-copy::after { right: -16px; transform: scaleX(-1); }
  .rsvp-copy { isolation: auto; margin-bottom: 30px; border-bottom: 1px solid #c4a16a70; }
  .detail-list { margin-top: 16px; }
  .story-section { padding-bottom: 64px; }
  .rsvp-section { background: linear-gradient(#f3e6d5, var(--cream) 96px); }
  .gift-section { background: linear-gradient(var(--cream), #f3e6d5 96px); }
  .wishes-section { border: 0; background: linear-gradient(#f3e6d5, #fbf5ea 96px); padding-bottom: 48px; }
  .closing {
    padding: 88px 30px 72px;
    background:
      url('assets/svg/blossom-branch-left.svg') left 24px/130px auto no-repeat,
      linear-gradient(#fbf5ea, #f3e6d5 160px);
  }
}
/* Keep the rule and every marker on one axis while revealing the group. */
.milestones::before { background: #c4a16a80; }
.milestones li::before { left: -24.5px; }
@media (min-width: 960px) {
  .milestones li::before { left: -27.5px; }
}

/* A shared center coordinate avoids half-pixel offsets between marker and rule. */
.milestones { --timeline-center: 5.5px; --timeline-indent: 25px; }
.milestones::before { left: var(--timeline-center); transform: translateX(-50%); }
.milestones li::before { left: calc(var(--timeline-center) - var(--timeline-indent)); transform: translateX(-50%); }
.hero-names span, .hero-names em { display: block; }
.hero h2.hero-names em { font-size: .55em; line-height: 1.15; margin: 4px 0; }
.detail-icon { width: 32px; height: 38px; }
.detail-icon svg { width: 30px; height: 32px; stroke-width: 1.35; }
.gallery-section { position: relative; padding: 64px 24px; text-align: center; background: #f3e6d5; }
.photo-gallery { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 16px; align-items: start; max-width: 920px; margin: 32px auto 0; }
.photo-gallery figure { margin: 0; padding: 6px; background: #fff9ee; box-shadow: 0 8px 24px #51362b12; border: 1px solid #c4a16a50; }
.photo-gallery img { display: block; width: 100%; height: 100%; aspect-ratio: 3/4; object-fit: cover; object-position: center 20%; }
.photo-gallery .gallery-wide { grid-column: 1/10; grid-row: 1; }
.photo-gallery .gallery-second { grid-column: 8/-1; grid-row: 1; margin-top: clamp(64px, 24vw, 140px); z-index: 1; transform: rotate(3deg); }
.photo-gallery .gallery-offset { grid-column: 2/10; grid-row: 2; margin-top: 12px; transform: rotate(-2deg); }
.photo-gallery .gallery-offset img { aspect-ratio: 4/3; object-position: center 26%; }
@media (min-width: 960px) {
  .milestones { --timeline-indent: 28px; }
  .photo-gallery { gap: 20px; max-width: 940px; }
  .photo-gallery .gallery-wide { grid-column: 1/7; grid-row: 1; }
  .photo-gallery .gallery-second { grid-column: 8/-1; grid-row: 1; margin-top: 60px; }
  .photo-gallery .gallery-offset { grid-column: 2/10; grid-row: 2; margin-top: 40px; }
}
@media (max-width: 959px) {
  #details { background: url('assets/svg/blossom-branch-left.svg') left 16px/85px auto no-repeat, var(--cream); }
  #details .section-head { padding-top: 32px; }
  #details .section-head::before { display: none; }
  .gallery-section::before { content: ""; display: block; position: absolute; right: 0; top: 4px; width: 90px; height: 95px; background: url('assets/svg/blossom-branch-right.svg') right top/contain no-repeat; pointer-events: none; }
  .gallery-section .section-head { padding-top: 32px; }
  .gift-section { background: url('assets/svg/blossom-branch-right.svg') right 18px/80px auto no-repeat, linear-gradient(var(--cream), #f3e6d5 96px); }
  .gift-section .section-head { padding-top: 22px; }
}

/* One clean envelope fold and a centered, font-independent seal. */
.envelope-flap { top: 6.2%; height: 58%; }
.wax-seal { left: 42.5%; top: 47%; }
.envelope-hit { min-height: 0; margin-bottom: 24px; }

/* Portraits punctuate the paper sections, with captions kept on dark overlays. */
.portrait-interlude { position: relative; min-height: 560px; height: 82svh; max-height: 900px; overflow: hidden; background: #382321; display: flex; align-items: flex-end; text-align: center; }
.portrait-interlude > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 16%; }
.portrait-interlude::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, #28191600 35%, #28191655 60%, #281916ed); }
.portrait-caption { position: relative; z-index: 1; width: 100%; padding: 44px 28px; }
.portrait-caption .section-intro { color: #e1bd83; font-size: 9px; }
.portrait-caption h2 { color: #fff7ec; font-size: clamp(34px, 6vw, 54px); line-height: 1.2; margin: 20px 0; }
.portrait-caption .divider-img { margin-bottom: 0; }
.closing.closing-photo { position: relative; isolation: isolate; display: flex; align-items: flex-end; justify-content: center; min-height: 720px; min-height: 90svh; padding: 64px 30px; overflow: hidden; background: #382321; }
.closing-portrait { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 55% 14%; }
.closing-photo::before { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(180deg, #28191608 10%, #28191666 40%, #281916ef 85%); }
.closing-copy { width: 100%; max-width: 580px; margin-inline: auto; }
.closing-photo h2 { color: #fff7ec; font-size: clamp(48px, 8vw, 72px); margin: 24px 0 20px; }
.closing-photo p { color: #fff1df; }
.closing-photo .footer-names { color: #e1bd83; margin-top: 32px; }
.closing-photo .footer-date { color: #e9d7bd; }
.closing-photo .closing-seal { background-color: #e1bd83; }
@media (min-width: 960px) {
  .portrait-interlude { height: 760px; }
  .portrait-interlude > img { object-position: 50% 16%; }
  .closing.closing-photo { min-height: 800px; }
  .closing-portrait { object-position: 55% 14%; }
}
@media (max-width: 359px) {
  .portrait-interlude { min-height: 480px; }
  .portrait-caption { padding-inline: 22px; }
}

.location-button { gap: 9px; background: #eddec4; border-color: #b99566; box-shadow: 0 2px 0 #b9956638; transition: background .18s ease, box-shadow .18s ease; }
.location-button svg { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.location-button:hover { background: #e5cfac; box-shadow: 0 3px 8px #51362b18; }
.location-button:focus-visible { outline: 2px solid var(--burgundy); outline-offset: 4px; }
.location-button:active { background: #dcc29b; box-shadow: none; }

/* Contained photo movement keeps the text and section edges steady. */
.hero-image-wrap { overflow:hidden; }
.hero-image, .portrait-interlude > img, .closing-portrait {
  position:absolute;
  left:0;
  top:0;
  bottom:auto;
  height:100%;
}
.closing.closing-photo { min-height:100svh; }
@media (prefers-reduced-motion:reduce) {
  .hero-image, .portrait-interlude > img, .closing-portrait { top:0; height:100%; transform:none!important; }
}

/* Keep opening controls above the invitation throughout its entrance. */
.cover { z-index:45; }
.envelope-hit, .cover-open-btn { touch-action:manipulation; }
.envelope-hit .envelope, .envelope-hit .envelope * { pointer-events:none; }

.gift-tabs button { display:flex; align-items:center; justify-content:center; gap:8px; }
.gift-tab-icon { width:18px; height:18px; flex:none; }
.gift-tab-flag { height:12px; border-radius:2px; box-shadow:0 0 0 1px #00000018; }
.gift-tab-globe { fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }

/* One circular motif connects the navigation and closing seal. */
.head-seal.seal-mark { width:32px; height:32px; }
.seal-mark {
  -webkit-mask-image:url('assets/svg/double-happiness.svg?v=emblem-5');
  mask-image:url('assets/svg/double-happiness.svg?v=emblem-5');
}
.closing-photo .closing-seal {
  position:relative;
  display:block;
  width:104px;
  height:104px;
  margin:0 auto 18px;
  border:0;
  border-radius:50%;
  background:#58202a;
  -webkit-mask:none;
  mask:none;
  box-shadow:0 5px 24px #160c0b40;
}
.closing-photo .closing-seal::after {
  content:"";
  position:absolute;
  inset:4px;
  background:#e1bd83;
  -webkit-mask:url('assets/svg/double-happiness.svg?v=emblem-5') center/contain no-repeat;
  mask:url('assets/svg/double-happiness.svg?v=emblem-5') center/contain no-repeat;
}
.closing-photo::before { background:linear-gradient(180deg, #28191608 10%, #28191666 35%, #281916f5 70%); }
@media (min-width:960px) {
  .closing-photo .closing-seal { width:132px; height:132px; margin-bottom:24px; }
}

/* Desktop closing: portrait and a framed dedication share the width. */
@media (min-width:960px) {
  .closing.closing-photo {
    display:grid;
    grid-template-columns:1.05fr 1fr;
    align-items:center;
    min-height:0;
    padding:76px 64px;
    gap:40px;
  }
  .closing-photo::before {
    background:linear-gradient(90deg, #28191608 15%, #28191644 38%, #281916e8 60%, #281916fa 100%);
  }
  .closing-photo::after {
    content:"";
    position:absolute;
    inset:24px;
    border:1px solid #d9b47b55;
    pointer-events:none;
    z-index:-1;
  }
  .closing-portrait { width:78%; object-position:65% 0; }
  .closing-photo .closing-copy {
    position:relative;
    grid-column:2;
    max-width:500px;
    margin:0;
    padding:36px 16px 28px;
    border-block:1px solid #d9b47b66;
  }
  .closing-copy::after {
    content:"";
    position:absolute;
    width:145px;
    height:155px;
    top:-66px;
    right:-44px;
    background:url('assets/svg/blossom-branch-right.svg') center/contain no-repeat;
    opacity:.7;
    pointer-events:none;
  }
  .closing-photo .closing-seal { width:112px; height:112px; margin-bottom:24px; }
  .closing-photo h2 { font-size:clamp(64px,6vw,84px); line-height:1.05; margin:24px 0; }
  .closing-photo p { max-width:32ch; margin-inline:auto; font-size:15px; line-height:1.8; }
  .closing-photo .footer-names { margin-top:28px; font-size:32px; }
  .closing-photo .footer-date { font-size:10px; letter-spacing:.18em; }
  .closing-copy .divider-img { margin-bottom:0; }
}

.envelope-flap::after { content:""; position:absolute; left:2%; top:5%; width:31%; height:48%; background:url('assets/blossoms/branch-left.webp') left top/contain no-repeat; clip-path:inset(0 0 0 5.4%); pointer-events:none; }
.closing-blossom { display:none; }
@media(max-width:959px) {
  #details { background-image:url('assets/blossoms/corner-top-right.webp'); background-position:right -10px top -18px; background-size:95px auto; }
  .story-section { background:url('assets/blossoms/side-left.webp') left -14px top -20px/100px auto no-repeat,linear-gradient(#fbf5ea,#f3e6d5 160px); }
  .gallery-section::before { top:auto; right:auto; bottom:0; left:0; width:74px; height:74px; background-image:url('assets/blossoms/corner-bottom-left.webp'); background-position:left bottom; }
  .gift-section { background-image:url('assets/blossoms/branch-right.webp'),linear-gradient(var(--cream),#f3e6d5 96px); background-position:right -6px top -12px,0 0; }
}

/* Mobile: textured paper and decorative grounds between the photo sections. */
@media(max-width:959px) {
  #details { background-image:url('assets/blossoms/corner-top-right.webp'),url('assets/svg/silk-grain.svg'); background-position:right -10px top -18px,0 0; background-size:95px auto,auto; background-repeat:no-repeat,repeat; background-color:#f7f1e6; }
  .story-section { background:url('assets/blossoms/side-left.webp') left -14px top -20px/100px auto no-repeat,url('assets/svg/silk-grain.svg') repeat,#f3e6d5; }
  .gallery-section { background:#45232c url('assets/svg/cloud-pattern.svg') repeat; border-block:1px solid #b9956680; }
  .gallery-section h2 { color:#fff4e4; }
  .gallery-section .section-intro { color:#d9b47b; }
  .photo-gallery figure { border:5px solid #fff4e4; box-shadow:0 10px 24px #190f1940; }
  .rsvp-section { background:#f7f1e6 url('assets/svg/silk-grain.svg') repeat; }
  .gift-section { background:url('assets/blossoms/branch-right.webp') right -6px top -12px/80px auto no-repeat,url('assets/svg/silk-grain.svg') repeat,#f3e6d5; }
  .gift-card { background:#45232c url('assets/svg/wave-pattern.svg') repeat; color:#fff4e4; border:1px solid #b99566; padding:26px 22px; box-shadow:0 8px 20px #51362b18; }
  .gift-card .gift-bank, .gift-card .gift-number { color:#fff4e4; }
  .gift-card .gift-tag, .gift-card .gift-owner, .gift-card .gift-note, .gift-card .gift-details dd { color:#ecd8bd; }
  .gift-card .gift-details dt { color:#d9b47b; }
  .gift-card .gift-copy { background:#edd6b1; color:#612b33; border-color:#d9b47b; }
  .wishes-section { background:#fbf5ea url('assets/svg/silk-grain.svg') repeat; }
  .wishes-feed { border-top:1px solid #b9956655; }
}

.guest-name-display { margin:6px 0 22px; color:var(--ink); font-size:20px; line-height:1.5; text-align:left; }
.invitation-status { min-height:4.8em; width:min(100%,34ch); margin:12px auto; font-size:14px; line-height:1.6; color:var(--ink); text-align:center; }
.invitation-status.is-error { color:var(--burgundy); }
.invitation-retry { border:1px solid var(--gold); border-radius:24px; padding:10px 22px; background:var(--cream); color:var(--burgundy); }
.cover-open-btn:disabled { opacity:.45; cursor:default; }
.envelope-hit:disabled { cursor:default; }

@media(max-width:959px) {
  .rsvp-section::before, .rsvp-section::after {
    content:""; display:block; position:absolute; inset:auto; bottom:26px;
    width:30px; height:30px; border:0;
    background:url('assets/svg/corner-ornament.svg') center/contain no-repeat;
    pointer-events:none;
  }
  .rsvp-section::before { left:16px; transform:scaleY(-1); }
  .rsvp-section::after { right:16px; transform:scale(-1); }
}

@media(max-width:959px) {
  #details .section-head::before, #details .section-head::after { display:none; }
  #details::before, #details::after {
    content:""; display:block; position:absolute; inset:auto; left:16px; right:16px;
    width:auto; height:30px; border:0; pointer-events:none;
    background:url('assets/svg/corner-ornament.svg') left center/30px 30px no-repeat;
  }
  #details::before { top:26px; }
  #details::after { bottom:26px; transform:scaleY(-1); }
  #details .section-head { position:static; }
  #details .section-head::before, #details .section-head::after {
    content:""; display:block; position:absolute; inset:auto; right:16px;
    width:30px; height:30px; border:0;
    background:url('assets/svg/corner-ornament.svg') center/contain no-repeat;
    pointer-events:none;
  }
  #details .section-head::before { top:26px; left:auto; transform:scaleX(-1); }
  #details .section-head::after { bottom:26px; top:auto; transform:scale(-1); }
}

/* Museum paintings blend into the paper, with no image edges behind controls. */
.painting-backdrop { display:block; position:absolute; pointer-events:none; mix-blend-mode:multiply; background-repeat:no-repeat; background-size:cover; z-index:0; }
.painting-landscape { background-image:url('assets/ink-wash/mountains.webp'); }
.painting-plum { background-image:url('assets/ink-wash/plum.webp'); }
.painting-peonies { background-image:url('assets/ink-wash/peonies.webp'); }
#details > :not(.painting-backdrop), .rsvp-section > :not(.painting-backdrop), .gift-section > :not(.painting-backdrop) { position:relative; z-index:1; }
@media(max-width:959px) {
  #details, .rsvp-section, .gift-section { overflow:hidden; }
  #details { background-image:url('assets/svg/silk-grain.svg'); background-size:auto; background-repeat:repeat; }
  .painting-landscape { inset:auto -90px 0; height:420px; opacity:.32; background-position:center bottom; mask-image:linear-gradient(transparent,#000 40%); }
  .painting-plum { top:0; left:-110px; right:-60px; height:340px; opacity:.28; background-position:center top; mask-image:linear-gradient(#000 30%,transparent); }
  .gift-section { background-image:url('assets/svg/silk-grain.svg'); background-size:auto; background-repeat:repeat; }
  .painting-peonies { top:0; right:-65px; width:270px; height:390px; opacity:.26; mask-image:linear-gradient(90deg,transparent,#000 40%); }
  #details .section-head { position:static; }
}
@media(max-width:959px) {
  .painting-peonies { mask-image:linear-gradient(90deg,transparent,#000 40%),linear-gradient(#000 65%,transparent); mask-composite:intersect; }
}

/* Alpha artwork has no paper rectangle or fan silhouette. */
.painting-backdrop { mix-blend-mode:multiply; }
@media(max-width:959px) {
  .painting-landscape { left:-90px; right:-90px; height:440px; opacity:.6; background-size:cover; mask-image:none; }
  .painting-plum { left:-32px; right:0; top:0; height:290px; opacity:.3; background-size:100% auto; background-position:left top; mask-image:none; }
  .painting-peonies { width:280px; right:-45px; height:430px; opacity:.35; background-position:right bottom; background-size:contain; mask-image:linear-gradient(#000 75%,transparent); }
}
@media(max-width:959px) {
  .painting-plum { width:230px; right:auto; height:155px; left:-25px; opacity:.32; }
}
@media(max-width:959px) {
  .painting-rsvp-side { display:none; }
}

.painting-story, .painting-wishes { display:none; }
@media(max-width:959px) {
  .story-section, .wishes-section, .rsvp-section { position:relative; isolation:isolate; overflow:hidden; }
  .story-section { background:#f3e6d5 url('assets/svg/silk-grain.svg') repeat; }
  .story-section > :not(.painting-backdrop), .wishes-section > :not(.painting-backdrop) { position:relative; z-index:1; }
  .painting-story { display:block; top:0; right:-70px; bottom:0; width:320px; opacity:.42; background:url('assets/ink-wash/blossom-side.webp') right center/auto 100% no-repeat; }
  .rsvp-section .painting-plum { top:0; left:-30px; width:260px; height:230px; opacity:.5; background:url('assets/ink-wash/blossom-corner.webp') left top/contain no-repeat; }
  .rsvp-section .painting-rsvp-side { display:block; inset:auto -120px -30px; width:auto; height:430px; opacity:.6; background:url('assets/ink-wash/panorama.webp') center bottom/auto 100% no-repeat; }
  .rsvp-section .field { background-color:#fff9f0e8; }
  .painting-wishes { display:block; inset:auto -60px -30px auto; width:440px; height:500px; opacity:.52; background:url('assets/ink-wash/garden.webp') right bottom/contain no-repeat; }
  .wishes-section .field { background-color:#fff9f0e8; }
  .wish-item { background:#fffaf3ed; }
}

/* Prepare only the currently visible photographs for compositor movement. */
.photo-in-view .hero-image, .photo-in-view.portrait-interlude > img, .photo-in-view .closing-portrait { will-change:transform; }
@media(max-width:959px) {
  .lang-switch--floating, .music-toggle, .compact-head { -webkit-backdrop-filter:none; backdrop-filter:none; }
  .lang-switch--floating, .music-toggle { background:#fff9f0; }
  .painting-backdrop { mix-blend-mode:normal; }
}

body { text-wrap:pretty; }
@media(max-width:959px) {
  .painting-story { top:-80px; bottom:-80px; }
  .photo-in-view .painting-story { will-change:transform; }
}

.cover-open-hint { width:min(100%,540px); text-align:center; margin:0; color:#775b49; font-size:14px; font-style:italic; line-height:1.6; }

/* The invitation card nearly fills its envelope and rises before verification gates entry. */
.letter-peek { left:4%; top:10%; width:92%; height:82%; }
.letter-peek .peek-name { font-size:clamp(16px,3.6vw,24px); }
.letter-peek small { font-size:clamp(8px,1.6vw,11px); }
.letter-peek { transition:transform 900ms cubic-bezier(.18,.65,.15,1),height 900ms cubic-bezier(.18,.65,.15,1); }
.envelope.is-opening .letter-peek { height:118%; transform:translateY(-54%); transition-delay:640ms; }
.envelope > .letter-peek { background-size:100% auto; background-position:center top; }

/* The saved wish remains next to its editor and the public guestbook. */
.saved-wish { padding:16px 0; }
.saved-wish .wish-text { white-space:pre-wrap; overflow-wrap:anywhere; margin:0 0 16px; }
.wishes-edit-hint { line-height:1.65; }
#savedWish[hidden], #wishFields[hidden], #cancelWish[hidden] { display:none !important; }

.details-actions { display:flex; justify-content:center; align-items:flex-start; flex-wrap:wrap; gap:10px; }
.details-actions > .location-button { padding:13px 17px; font-size:13px; gap:8px; }
.calendar-dialog { width:min(360px, calc(100vw - 40px)); max-height:calc(100dvh - 48px); padding:22px; border:1px solid #b99566; border-radius:16px; background:#fffaf0; color:var(--ink); box-shadow:0 20px 70px #28191655; }
.calendar-dialog::backdrop { background:#28191680; }
.calendar-dialog-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.calendar-dialog h2 { margin:0; font-size:25px; }
.calendar-close { flex:none; width:40px; height:40px; padding:0; background:none; border:1px solid #d8c5ac; border-radius:50%; color:var(--burgundy); font:24px/1 Georgia,serif; }
.calendar-dialog > p { margin:12px 0 18px; font-size:12px; color:#6b524a; line-height:1.5; }
.calendar-options { display:grid; gap:8px; }
.calendar-options button, .calendar-options a { display:block; width:100%; border:1px solid #d8c5ac; border-radius:8px; background:transparent; padding:14px; color:var(--burgundy); font:inherit; text-align:left; }
.calendar-options button:hover, .calendar-options button:focus-visible, .calendar-options a:hover, .calendar-options a:focus-visible { background:#eddec4; }
@media (min-width:960px) { .details-actions { justify-content:flex-start; } }
@media (max-width:380px) { .details-actions > .location-button { width:100%; } }

.calendar-options a { text-decoration:none; }
.calendar-provider { margin:20px 0 9px; font-size:13px; color:var(--burgundy); }

/* Nested gift choices share the same panel and keep account values copyable. */
#gift[hidden], .gift-tabs button[hidden], .head-nav a[hidden] { display:none !important; }
.gift-method-tabs { display:flex; gap:18px; margin:0 0 22px; border-bottom:1px solid #b9956666; }
.gift-method-tabs button { border:0; border-bottom:2px solid transparent; background:none; color:inherit; padding:9px 2px 12px; font:inherit; opacity:.65; }
.gift-method-tabs button[aria-selected="true"] { border-bottom-color:var(--gold); opacity:1; }
.gift-method-tabs button:focus-visible { outline:2px solid var(--gold); outline-offset:3px; }
.gift-network { margin:0 0 18px; }
.gift-details dd { display:flex; align-items:flex-start; gap:10px; justify-content:space-between; min-width:0; }
.gift-details dd > span { min-width:0; overflow-wrap:anywhere; white-space:pre-wrap; }
.gift-copy-inline { flex:none; margin:0; padding:5px 9px; font-size:11px; line-height:1.4; }
.gift-open-link { display:inline-block; margin-top:18px; text-decoration:none; }
.gift-card .gift-bank { overflow-wrap:anywhere; }
@media (min-width:960px) {
  .gift-section .gift-method-tabs { color:#ecd8bd; }
  .gift-section .gift-card .form-label { color:#ecd8bd; }
  .gift-section .gift-copy-inline { font-size:12px; }
}

.gift-tabs[hidden] { display:none !important; }

.gift-section .gift-details dd .gift-copy-inline { margin:0; padding:4px 8px; min-height:0; font-size:11px; line-height:1.3; border-radius:6px; align-self:center; }
.gift-section .gift-details dd { align-items:center; }
.gift-section .gift-details dd .gift-copy-inline { display:inline-flex; align-items:center; gap:5px; background:#ffe8ba; border-color:#d5af6b; color:#59222d; opacity:1; }
.gift-copy-inline svg { width:15px; height:15px; flex:none; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.gift-section .gift-details dd .gift-copy-inline:hover { background:#fff3d9; }

.gift-section .gift-details dd .gift-copy-inline { width:30px; height:30px; padding:6px; justify-content:center; border-radius:7px; }
.gift-copy-inline svg { width:16px; height:16px; stroke-width:1.6; }
.gift-copy-inline .copy-check { display:none; }
.gift-copy-inline[data-copy-state="copied"] .copy-shape { display:none; }
.gift-copy-inline[data-copy-state="copied"] .copy-check { display:block; }
.gift-copy-inline[data-copy-state="failed"] { outline:2px solid var(--rose); }
