:root {
  --ivory: #f8f4ee;
  --ivory-deep: #eee7df;
  --blush: #f4eeec;
  --blue: #a9b6bf;
  --blue-deep: #8899a5;
  --blue-ink: #6f7f89;
  --taupe: #7c7774;
  --taupe-soft: #9b9590;
  --line: #c9c0b7;
  --white: #fffdf9;
  --sage: #adb8aa;
  --script: "Parisienne", cursive;
  --serif: "Cormorant Garamond", Georgia, serif;
  --display: "Italiana", Georgia, serif;
  --ease: cubic-bezier(.22,.61,.36,1);
  --paper-shadow: 0 18px 26px rgba(87,83,79,.15), 0 3px 8px rgba(87,83,79,.12);
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; overflow-x: hidden; }
body { margin: 0; min-width: 320px; overflow-x: hidden; background: var(--blush); color: var(--taupe); font-family: var(--serif); font-size: 17px; line-height: 1.55; -webkit-font-smoothing: antialiased; }
body.is-locked { overflow: hidden; }
img { display: block; max-width: 100%; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }
.paper-grain { position: fixed; inset: 0; z-index: 9999; pointer-events: none; opacity: .22; mix-blend-mode: multiply; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3' seed='8'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.13'/%3E%3C/svg%3E"); }

.paper-card { position: relative; background: linear-gradient(135deg, rgba(255,255,255,.72), transparent 28%), var(--ivory); box-shadow: var(--paper-shadow); }
.paper-card::after { content: ""; position: absolute; inset: 5px; z-index: 6; pointer-events: none; background: url("assets/lace-frame.webp") center / 100% 100% no-repeat; opacity: .68; }
.kicker { margin: 0 0 10px; font-family: var(--display); font-size: .68rem; letter-spacing: .32em; text-transform: uppercase; }
.light { color: rgba(255,253,249,.92); }
.script-title, .script-heading { margin: 0; color: var(--taupe); font-family: var(--script); font-size: clamp(2.55rem, 12vw, 4rem); font-weight: 400; line-height: 1.04; }
.light-script { color: var(--white); text-shadow: 0 1px 1px rgba(90,103,111,.12); }
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

/* Search gate */
.gate, .cover { position: fixed; inset: 0; min-height: 100svh; z-index: 1000; display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle at 50% 36%, #fbf7f3 0, var(--blush) 64%, #ebe3df 100%); transition: opacity .75s var(--ease), visibility .75s; }
.gate.is-leaving, .cover.is-leaving { opacity: 0; visibility: hidden; pointer-events: none; }
.gate-scene { position: relative; width: min(100%, 480px); min-height: 100svh; display: grid; place-items: center; padding: 34px 22px 92px; }
.gate-card { z-index: 4; width: min(100%, 350px); padding: 48px 30px 32px; text-align: center; }
.gate-card::before { content: ""; position: absolute; inset: 14px; border: 1px solid rgba(155,145,137,.24); pointer-events: none; }
.gate-card h1 { margin: 4px auto 13px; max-width: 13ch; color: var(--taupe); font-family: var(--display); font-size: clamp(1.22rem, 6vw, 1.62rem); font-weight: 400; letter-spacing: .12em; line-height: 1.42; text-transform: uppercase; }
.gate-copy { max-width: 28ch; margin: 0 auto 24px; color: var(--taupe-soft); font-size: .98rem; font-style: italic; line-height: 1.45; }
.search-field { position: relative; z-index: 6; text-align: left; }
.search-field label { display: block; margin-bottom: 6px; font-family: var(--display); font-size: .64rem; letter-spacing: .2em; text-transform: uppercase; }
.search-line { display: flex; align-items: center; border-bottom: 1px solid var(--line); }
.search-line:focus-within { border-color: var(--blue-ink); }
.search-line input { width: 100%; min-height: 48px; border: 0; outline: 0; background: transparent; color: var(--taupe); font-family: var(--serif); font-size: 1.05rem; }
.search-line input::placeholder { color: #aaa29d; font-style: italic; }
.search-line svg { width: 21px; height: 21px; fill: none; stroke: var(--taupe); stroke-width: 1.2; }
.suggestions { position: absolute; top: 100%; right: 0; left: 0; z-index: 8; display: none; max-height: 190px; overflow-y: auto; border: 1px solid rgba(165,153,143,.35); background: rgba(250,247,241,.98); box-shadow: 0 12px 25px rgba(80,75,70,.12); }
.suggestions.show { display: block; }
.suggestion, .search-empty { display: block; width: 100%; padding: 12px 14px; border: 0; border-bottom: 1px solid rgba(165,153,143,.2); background: transparent; text-align: left; }
.suggestion { cursor: pointer; }
.suggestion:hover, .suggestion:focus-visible { background: #efe9e2; outline: 0; }
.suggestion span { display: block; color: var(--taupe); font-size: 1rem; }
.suggestion small { display: block; color: var(--taupe-soft); font-family: var(--display); font-size: .57rem; letter-spacing: .14em; text-transform: uppercase; }
.search-empty { color: var(--taupe-soft); font-size: .91rem; font-style: italic; }
.gate-hint { margin: 22px 0 0; font-family: var(--display); font-size: .58rem; letter-spacing: .18em; text-transform: uppercase; }
.gate-result { margin-top: 20px; padding-top: 17px; border-top: 1px solid var(--line); }
.gate-result strong { display: block; font-family: var(--script); font-size: 1.95rem; font-weight: 400; line-height: 1.15; }
.gate-result p { margin: 4px 0 13px; font-size: .94rem; }
.editorial-button { min-height: 44px; padding: 10px 22px; border: 1px solid var(--line); border-radius: 999px; background: transparent; font-family: var(--display); font-size: .62rem; letter-spacing: .17em; text-transform: uppercase; cursor: pointer; transition: background .25s, color .25s, transform .25s; }
.editorial-button:hover, .editorial-button:focus-visible { background: var(--blue); color: var(--white); transform: translateY(-1px); outline: 0; }
.gate-envelope { position: absolute; z-index: 2; bottom: 22px; left: 50%; width: min(104vw, 452px); max-width: none; transform: translateX(-50%); filter: drop-shadow(0 18px 18px rgba(81,89,94,.16)); }
.gate-flower { position: absolute; z-index: 5; pointer-events: none; filter: saturate(.55) drop-shadow(0 12px 14px rgba(78,83,78,.14)); }
.gate-flower-left { bottom: -25px; left: -100px; width: 240px; transform: rotate(16deg); opacity: .68; }
.gate-flower-right { top: -48px; right: -96px; width: 250px; transform: rotate(-25deg); opacity: .48; }
.pearl-art { pointer-events: none; filter: drop-shadow(0 6px 7px rgba(83,79,75,.16)); }
.gate-pearls { position: absolute; z-index: 5; right: -88px; bottom: -15px; width: 310px; max-width: none; transform: rotate(76deg); opacity: .84; }

/* Opening cover */
.cover { z-index: 900; opacity: 0; visibility: hidden; background: radial-gradient(circle at 50% 42%, #d4dde2, var(--blue) 70%); }
.cover.is-active { opacity: 1; visibility: visible; }
.cover.is-active.is-leaving { opacity: 0; visibility: hidden; pointer-events: none; }
.cover-kicker { position: absolute; top: max(32px, env(safe-area-inset-top)); margin: 0; color: rgba(255,255,255,.9); font-family: var(--display); font-size: .66rem; letter-spacing: .28em; text-transform: uppercase; }
.opening-envelope { position: relative; width: min(90vw, 390px); height: 470px; border: 0; background: transparent; cursor: pointer; perspective: 1000px; }
.env-art { position: absolute; left: 50%; max-width: none; pointer-events: none; filter: drop-shadow(0 22px 20px rgba(74,84,90,.22)); transition: opacity .55s var(--ease), transform .9s var(--ease); }
.env-art-closed { z-index: 6; bottom: 48px; width: 108%; transform: translateX(-50%); }
.env-art-open { z-index: 3; top: -5px; width: 98%; opacity: 0; transform: translateX(-50%) translateY(22px) scale(.94); }
.opening-card { position: absolute; z-index: 4; bottom: 72px; left: 18%; width: 64%; height: 300px; display: flex; flex-direction: column; align-items: center; justify-content: center; opacity: 0; transform: translateY(88px) scale(.92); transition: transform 1s var(--ease) .28s, opacity .45s var(--ease) .2s; }
.opening-card-small { font-family: var(--script); font-size: 2.55rem; line-height: .95; }
.opening-card-amp { margin: 2px; font-family: var(--script); font-size: 1.7rem; }
.opening-card-date { margin-top: 17px; font-family: var(--display); font-size: .66rem; letter-spacing: .25em; }
.env-photo { position: absolute; z-index: 5; top: 74px; left: 22%; width: 56%; height: 195px; overflow: hidden; border: 7px solid var(--ivory); background: var(--ivory); box-shadow: 0 7px 14px rgba(64,66,67,.2); opacity: 0; transform: translateY(92px) rotate(-2deg); transition: transform 1s var(--ease) .38s, opacity .55s var(--ease) .3s; }
.env-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 28%; }
.seal-heart { display: block; width: 82px; height: auto; filter: drop-shadow(0 4px 4px rgba(80,76,72,.2)); }
.opening-envelope > .seal-heart { position: absolute; z-index: 8; bottom: 133px; left: calc(50% - 41px); transition: opacity .35s, transform .55s var(--ease); }
.cover-bouquet { position: absolute; z-index: 7; right: -23px; bottom: 10px; width: 190px; pointer-events: none; filter: saturate(.55) drop-shadow(0 14px 13px rgba(62,68,65,.16)); }
.cover-hint { position: absolute; bottom: max(24px, env(safe-area-inset-bottom)); display: flex; flex-direction: column; align-items: center; gap: 7px; margin: 0; color: rgba(255,255,255,.92); font-family: var(--display); font-size: .61rem; letter-spacing: .23em; text-transform: uppercase; }
.cover-hint span { width: 5px; height: 5px; border-radius: 50%; background: currentColor; animation: pulse 1.8s ease-in-out infinite; }
@keyframes pulse { 50% { transform: scale(1.8); opacity: .35; } }
.opening-envelope.opening > .seal-heart { opacity: 0; transform: translateY(12px) scale(.78); }
.opening-envelope.opening .env-art-closed { opacity: 0; transform: translateX(-50%) translateY(18px) scale(.92); }
.opening-envelope.opening .env-art-open { opacity: 1; transform: translateX(-50%) translateY(0) scale(1); }
.opening-envelope.opening .opening-card { opacity: 1; transform: translateY(-80px) scale(1); }
.opening-envelope.opening .env-photo { opacity: 1; transform: translateY(-62px) rotate(-2deg); }

.music-control { position: fixed; right: 16px; bottom: 18px; z-index: 100; width: 46px; height: 46px; display: none; place-items: center; border: 1px solid rgba(122,116,112,.35); border-radius: 50%; background: rgba(248,244,238,.9); backdrop-filter: blur(8px); box-shadow: 0 7px 17px rgba(73,70,68,.11); cursor: pointer; }
.music-control.is-visible { display: grid; }
.music-control svg { width: 19px; height: 19px; fill: none; stroke: var(--taupe); stroke-width: 1.25; stroke-linecap: round; stroke-linejoin: round; }
.music-control .music-off { display: none; }
.music-control.is-paused .music-on { display: none; }
.music-control.is-paused .music-off { display: block; }

/* Main editorial story */
.invitation { visibility: hidden; opacity: 0; transition: opacity 1s var(--ease); }
.invitation.is-active { visibility: visible; opacity: 1; }
.cream-section, .blue-section { position: relative; text-align: center; }
.cream-section { background: var(--blush); }
.blue-section { background: var(--blue); color: var(--white); }
.hero { min-height: 1220px; padding: 48px 20px 170px; }
.hero::before, .countdown-section::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 10% 18%, rgba(255,255,255,.45), transparent 28%), radial-gradient(circle at 85% 70%, rgba(235,220,220,.35), transparent 32%); }
.hero-scene { position: relative; z-index: 2; width: min(100%, 430px); height: 520px; margin: 0 auto; }
.hero-envelope { position: absolute; top: 24px; left: 1%; width: 96%; height: 440px; filter: drop-shadow(0 20px 19px rgba(74,78,81,.17)); }
.hero-envelope-art { position: absolute; z-index: 2; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.hero-photo { position: absolute; z-index: 3; top: 40px; left: 22%; width: 56%; height: 235px; border: 8px solid var(--ivory); background: var(--ivory); box-shadow: 0 5px 11px rgba(76,73,70,.15); transform: rotate(-1deg); }
.hero-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 28%; }
.hero-seal { position: absolute; z-index: 5; top: 242px; left: calc(50% - 41px); }
.hero-floral { position: absolute; z-index: 6; top: 24px; right: -65px; width: 225px; filter: saturate(.65) drop-shadow(0 13px 12px rgba(70,75,72,.15)); }
.hero-pearls { position: absolute; z-index: 7; top: 260px; left: -62px; width: 310px; max-width: none; transform: rotate(16deg); opacity: .9; }
.name-card { z-index: 4; width: min(calc(100% - 26px), 340px); min-height: 460px; margin: -2px auto 0; padding: 72px 34px 50px; }
.lace-card { border: 8px solid transparent; }
.lace-card::before { content: ""; position: absolute; inset: -8px; z-index: -1; background: var(--ivory); box-shadow: 0 8px 8px rgba(82,77,72,.08); }
.names-script { margin: 0; font-family: var(--script); font-size: clamp(3.45rem, 17vw, 4.75rem); line-height: .92; }
.name-amp { display: block; margin: 3px 0; font-family: var(--script); font-size: 2.2rem; line-height: 1; }
.main-date { margin: 24px 0 26px; font-family: var(--display); font-size: .88rem; letter-spacing: .28em; }
.romantic-copy { max-width: 25ch; margin: 0 auto; font-size: 1.04rem; line-height: 1.5; }

.portrait-section { margin-top: -94px; padding: 124px 22px 80px; }
.portrait-section::before, .venue-section::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .17; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.6' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.14'/%3E%3C/svg%3E"); }
.oval-frame { position: relative; z-index: 2; width: min(78vw, 310px); aspect-ratio: .72; margin: 0 auto 72px; padding: 20px; border: 2px solid rgba(238,244,246,.6); border-radius: 50% / 44%; box-shadow: inset 0 0 0 6px rgba(238,244,246,.15), inset 0 0 0 10px rgba(126,145,157,.19), 0 16px 26px rgba(72,85,94,.16); }
.oval-frame::before, .oval-frame::after { content: ""; position: absolute; inset: 9px; border: 1px solid rgba(244,247,248,.65); border-radius: inherit; pointer-events: none; }
.oval-frame::after { inset: 15px; border-style: dotted; border-width: 3px; opacity: .78; }
.oval-frame img { width: 100%; height: 100%; border-radius: 50% / 44%; object-fit: cover; object-position: 44% center; }
.blue-copy { position: relative; z-index: 2; max-width: 460px; margin: 0 auto; }
.blue-copy h2 { margin: 0; font-family: var(--display); font-size: clamp(1rem, 4.5vw, 1.28rem); font-weight: 400; letter-spacing: .08em; line-height: 1.65; text-transform: uppercase; }
.flourish { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 19px auto 28px; }
.flourish span { width: 54px; height: 1px; background: currentColor; opacity: .45; }
.flourish b { font-size: 1.2rem; font-weight: 400; }
.parents-list { display: grid; gap: 29px; }
.parents-list h3 { margin: 0 0 5px; font-family: var(--script); font-size: 2.25rem; font-weight: 400; line-height: 1.05; }
.parents-list p { margin: 0; font-size: 1.08rem; line-height: 1.5; }
.sponsors { position: relative; z-index: 2; max-width: 760px; margin: 80px auto 0; }
.sponsor-list { display: grid; gap: 26px; margin-top: 26px; }
.sponsor-list > div { display: flex; align-items: center; justify-content: center; gap: 15px; }
.sponsor-list img { width: 56px; height: 56px; object-fit: contain; filter: invert(1); opacity: .72; }
.sponsor-list p { width: 185px; margin: 0; text-align: left; font-size: .98rem; line-height: 1.38; }
.sponsor-list strong { display: block; margin-bottom: 3px; font-family: var(--script); font-size: 1.55rem; font-weight: 400; }

.venue-section { margin-top: -1px; min-height: 1040px; padding: 75px 24px 150px; }
.section-heading { position: relative; z-index: 3; max-width: 540px; margin: 0 auto 34px; }
.section-heading h2:not(.script-heading), .dress-section .section-heading h2 { margin: 8px 0 6px; font-family: var(--display); font-size: 1.12rem; font-weight: 400; letter-spacing: .2em; text-transform: uppercase; }
.section-heading p:last-child { margin: 7px 0 0; }
.venue-stack { position: relative; z-index: 3; display: grid; gap: 38px; width: min(100%, 390px); margin: 0 auto; }
.venue-card { min-height: 260px; padding: 48px 28px 36px; color: var(--taupe); }
.venue-card h3 { margin: 0 0 7px; font-family: var(--script); font-size: 2.7rem; font-weight: 400; line-height: 1; }
.venue-card p { margin: 2px 0; }
.venue-time { font-family: var(--display); font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; }
.venue-note { color: var(--taupe-soft); font-style: italic; }
.paper-button { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; margin-top: 18px; padding: 7px 22px; border: 1px solid rgba(156,146,138,.42); border-radius: 999px; font-family: var(--display); font-size: .6rem; letter-spacing: .16em; text-transform: uppercase; transition: background .25s, color .25s; }
.paper-button:hover, .paper-button:focus-visible { background: var(--blue); color: var(--white); outline: 0; }
.corner-ornament { position: absolute; inset: 15px; border: 1px solid rgba(171,160,151,.25); }
.corner-ornament::before, .corner-ornament::after { content: "✦"; position: absolute; color: #b5aaa1; font-size: .65rem; }
.corner-ornament::before { top: -6px; left: -4px; }
.corner-ornament::after { right: -4px; bottom: -6px; }
.calla-decoration { position: absolute; z-index: 4; right: -50px; bottom: -30px; width: 210px; color: #eef0e9; filter: drop-shadow(0 12px 9px rgba(62,72,68,.14)); transform: rotate(-7deg); }
.calla-decoration path { stroke-width: 2.2; }
.calla-decoration .calla-fill { fill: rgba(251,248,241,.94); }

.dress-section { padding: 102px 24px 70px; }
.dress-section .section-heading { margin-bottom: 14px; }
.dress-section .section-heading p:last-child { font-size: 1rem; }
.palette { display: flex; justify-content: center; gap: 8px; margin: 24px auto 15px; }
.palette span { width: 25px; height: 25px; border: 2px solid rgba(255,255,255,.62); border-radius: 50%; background: var(--swatch); box-shadow: 0 2px 4px rgba(78,75,72,.1); }
.reserved-note { margin: 14px auto 0; font-style: italic; }
.reserved-note span { display: inline-block; width: 13px; height: 13px; margin-right: 5px; border: 1px solid #bcb3ad; border-radius: 50%; background: #fff; vertical-align: -1px; }
.program-scene { position: relative; width: min(100%, 390px); min-height: 720px; margin: 90px auto 0; }
.program-envelope { position: absolute; top: -34px; left: -8%; width: 116%; max-width: none; filter: drop-shadow(0 18px 18px rgba(81,89,94,.16)); }
.program-card { position: absolute; z-index: 3; top: 170px; left: 7%; width: 86%; min-height: 530px; padding: 60px 32px 44px; }
.program-seal { position: absolute; top: -40px; left: calc(50% - 41px); z-index: 7; }
.timeline { position: relative; margin: 27px 0 0; padding: 0; list-style: none; text-align: left; }
.timeline::before { content: ""; position: absolute; top: 24px; bottom: 25px; left: 54px; width: 1px; background: rgba(141,132,125,.4); }
.timeline li { position: relative; display: grid; grid-template-columns: 44px 1fr; align-items: center; gap: 22px; min-height: 94px; }
.timeline li::before { content: ""; position: absolute; left: 50px; width: 8px; height: 8px; border-radius: 50%; background: var(--ivory); box-shadow: inset 0 0 0 1px var(--taupe-soft); }
.timeline img { width: 42px; height: 42px; object-fit: contain; opacity: .72; }
.timeline span { font-size: .95rem; line-height: 1.25; }
.timeline b { display: block; font-family: var(--display); font-size: .62rem; font-weight: 400; letter-spacing: .12em; text-transform: uppercase; }

.countdown-section { padding: 75px 24px 115px; }
.countdown-inner, .gift-editorial { position: relative; z-index: 2; max-width: 520px; margin: 0 auto; }
.countdown { display: flex; align-items: flex-start; justify-content: center; margin-top: 20px; }
.countdown div { min-width: 57px; }
.countdown b { display: block; font-family: var(--display); font-size: clamp(1.35rem, 7vw, 2.25rem); font-weight: 400; line-height: 1.1; }
.countdown span { display: block; margin-top: 7px; font-family: var(--display); font-size: .48rem; letter-spacing: .13em; text-transform: uppercase; }
.countdown i { padding: 0 3px; font-family: var(--display); font-size: 1.6rem; font-style: normal; line-height: 1; }
.gift-editorial { margin-top: 108px; }
.gift-editorial > p { max-width: 32ch; margin: 16px auto 26px; }
.gift-links { width: min(100%, 390px); margin: 0 auto; border-top: 1px solid var(--line); }
.gift-links a { display: flex; min-height: 70px; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); transition: padding .25s; }
.gift-links a:hover, .gift-links a:focus-visible { padding: 0 8px; outline: 0; }
.gift-links span { font-family: var(--display); font-size: .75rem; letter-spacing: .13em; text-transform: uppercase; }
.gift-links small { color: var(--taupe-soft); font-style: italic; }
.envelope-gift { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 45px; }
.envelope-gift svg { width: 55px; fill: none; stroke: var(--taupe-soft); stroke-width: 1; }
.envelope-gift h3 { margin: 0; font-family: var(--script); font-size: 2rem; font-weight: 400; }
.envelope-gift p { margin: 0; font-size: .9rem; font-style: italic; }

.rsvp-section { padding: 35px 20px 125px; }
.rsvp-scene { position: relative; width: min(100%, 430px); min-height: 760px; margin: 0 auto; }
.rsvp-envelope { position: absolute; z-index: 1; bottom: -36px; left: -2%; width: 104%; max-width: none; filter: drop-shadow(0 18px 18px rgba(81,89,94,.16)); }
.rsvp-card { position: absolute; z-index: 2; top: 34px; left: 8%; width: 84%; min-height: 540px; padding: 58px 30px 42px; }
.rsvp-card h2 { margin: 10px 0 14px; font-family: var(--display); font-size: clamp(1.15rem, 5vw, 1.55rem); font-weight: 400; letter-spacing: .14em; line-height: 1.35; text-transform: uppercase; }
.rsvp-copy { max-width: 27ch; margin: 0 auto; }
.ticket-search { margin-top: 25px; }
.rsvp-card .gate-hint { margin-top: 18px; }
.rsvp-card .access-summary { margin-top: 18px; padding-top: 17px; border-top: 1px solid var(--line); }
.rsvp-seal { position: absolute; z-index: 5; bottom: 132px; left: calc(50% - 41px); }
.rsvp-floral { position: absolute; z-index: 4; right: -69px; bottom: -20px; width: 230px; filter: saturate(.6) drop-shadow(0 14px 13px rgba(67,72,69,.16)); }
.access-summary { margin-top: 23px; }
.access-summary strong { display: block; font-family: var(--script); font-size: 1.8rem; font-weight: 400; line-height: 1.1; }
.access-summary p { margin: 5px 0 15px; }
.tickets { position: relative; z-index: 5; display: grid; gap: 22px; width: min(100%, 780px); margin: 48px auto 0; }
.ticket-preview { position: relative; min-height: 430px; padding: 42px 28px 32px; border: 1px solid rgba(159,149,140,.42); background: var(--ivory); box-shadow: var(--paper-shadow); }
.ticket-preview::before { content: ""; position: absolute; inset: 5px; pointer-events: none; background: url("assets/lace-frame.webp") center / 100% 100% no-repeat; opacity: .62; }
.ticket-preview .ticket-label { font-family: var(--display); font-size: .58rem; letter-spacing: .22em; text-transform: uppercase; }
.ticket-preview h3 { margin: 9px 0 4px; font-family: var(--script); font-size: 2.1rem; font-weight: 400; }
.ticket-preview .ticket-family { margin: 0; }
.ticket-preview img { width: 150px; height: 150px; margin: 18px auto; padding: 9px; background: #fff; }
.ticket-preview .ticket-folio { margin: 0; font-family: var(--display); font-size: .66rem; letter-spacing: .16em; }
.ticket-preview .ticket-number { margin: 5px 0 17px; font-size: .9rem; }
.ticket-download { min-height: 44px; padding: 8px 18px; border: 1px solid var(--line); border-radius: 999px; background: transparent; font-family: var(--display); font-size: .57rem; letter-spacing: .14em; text-transform: uppercase; cursor: pointer; }
.ticket-download:hover, .ticket-download:focus-visible { background: var(--blue); color: #fff; outline: 0; }
.download-all { display: block; width: fit-content; margin: 0 auto 32px; }
.download-message { grid-column: 1/-1; margin: 0; font-style: italic; text-align: center; }

footer { padding: 80px 22px max(90px, calc(env(safe-area-inset-bottom) + 65px)); background: #9eacb7; color: var(--white); text-align: center; }
.footer-monogram { font-family: var(--script); font-size: 3.4rem; line-height: 1; }
.footer-monogram span { font-size: .7em; }
footer p { margin: 17px 0 6px; font-family: var(--display); font-size: .65rem; letter-spacing: .3em; }
footer small { font-style: italic; }

@media (min-width: 600px) {
  .gate-card { padding-right: 44px; padding-left: 44px; }
  .hero { min-height: 1270px; }
  .hero-scene { height: 570px; }
  .hero-envelope { left: 4%; width: 92%; height: 380px; }
  .hero-photo { height: 280px; }
  .hero-floral { right: -95px; width: 290px; }
  .name-card { width: 390px; }
  .parents-list { grid-template-columns: 1fr 1fr; gap: 42px; }
  .sponsor-list { grid-template-columns: 1fr 1fr; }
  .venue-stack { width: 430px; }
  .tickets { grid-template-columns: 1fr 1fr; }
}

@media (min-width: 900px) {
  .gate-scene { width: 650px; }
  .gate-card { width: 390px; }
  .hero { min-height: 1120px; padding-top: 75px; }
  .hero-scene { height: 590px; }
  .hero-envelope { left: -3%; width: 106%; height: 410px; }
  .name-card { margin-top: -60px; }
  .portrait-section { padding-top: 150px; }
  .venue-section { min-height: 760px; padding-bottom: 100px; }
  .venue-stack { grid-template-columns: 1fr 1fr; width: min(100%, 820px); gap: 42px; }
  .calla-decoration { right: 3%; width: 250px; }
  .program-scene { width: 430px; }
  .rsvp-scene { width: 470px; }
}

@media (min-width: 1200px) {
  .invitation { width: min(100%, 1180px); margin: 0 auto; box-shadow: 0 0 60px rgba(77,73,70,.11); }
  body { background: #ded9d4; }
  .hero-floral { right: -135px; }
}

@media (max-width: 370px) {
  .gate-scene { padding-right: 16px; padding-left: 16px; }
  .gate-card { padding-right: 23px; padding-left: 23px; }
  .opening-envelope { width: 96vw; transform: scale(.9); }
  .hero { padding-right: 13px; padding-left: 13px; }
  .hero-floral { right: -88px; width: 210px; }
  .countdown div { min-width: 51px; }
  .countdown i { padding: 0; }
  .program-card { left: 4%; width: 92%; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}
