:root {
  --blue-dark: #1a1f21;
  --blue-mid: #3e495c;
  --blue-light: #485f72;
  --green-dark: #1b1f15;
  --green-mid: #3c3c24;
  --green-light: #9c9d65;
  --cream-bg: #f9f8f6;
  --white: #ffffff;
  --error: #b73a3a;
  --max-capacity: 200;
  --muted: #586572;
  --border: #cdd6df;
  --soft-blue: #eaf0f5;
  --soft-green: #eeeee6;
  --warning: #775519;
  --warning-bg: #fbf1da;
  --success: #3d5936;
  --error-bg: #faf0ef;
  --overlay: #1a1f2166;
  --hero-gradient: linear-gradient(180deg, #1a1f212a, #26384970 40%, #1a1f2180);
  --hero-rule: #ffffff88;
  --registry-art-bg: #e5e6dc;
  --invitation-copy: #e2eaf2;
  --shadow: 0 16px 60px #1b1f150a;
  --font-body: 'Inter', sans-serif;
  --font-heading: 'Playfair Display', Georgia, serif;
  --radius: 3px;
  --content-width: 1160px;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 32px; }
body { margin: 0; background: var(--cream-bg); color: var(--blue-dark); font-family: var(--font-body); font-size: 16px; line-height: 1.75; -webkit-font-smoothing: antialiased; }
[hidden] { display: none !important; }
h1,h2,h3,p { margin: 0; }
h1,h2,h3 { font-family: var(--font-heading); font-weight: 400; line-height: 1.18; }
h1 { font-size: clamp(42px, 5vw, 66px); letter-spacing: -.035em; }
h2 { font-size: clamp(32px, 3.5vw, 48px); letter-spacing: -.025em; }
h3 { font-size: 24px; }
a { color: inherit; text-underline-offset: 5px; }
button,input,select { font: inherit; }
button,a,input,select { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
button:disabled { cursor: wait; opacity: .55; }
a[aria-disabled="true"] { cursor: default; color: var(--muted); }
:focus-visible { outline: 3px solid var(--blue-light); outline-offset: 4px; }
::selection { color: var(--white); background: var(--blue-light); }
.skip-link { position: absolute; left: 16px; top: -100px; z-index: 100; padding: 12px 20px; color: var(--white); background: var(--blue-dark); }
.skip-link:focus { top: 10px; }
.site-header { position: relative; z-index: 10; height: 94px; max-width: 1440px; margin: auto; padding: 0 5.5%; display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.wordmark { font-family: var(--font-heading); font-size: 28px; letter-spacing: -.06em; text-decoration: none; white-space: nowrap; }
.site-header nav { display: flex; align-items: center; gap: 34px; }
.site-header nav a { min-height: 48px; display: inline-flex; align-items: center; font-size: 16px; font-weight: 500; text-decoration: none; padding: 12px 0; }
.site-header nav a:hover { color: var(--blue-mid); text-decoration: underline; }
.site-header nav .nav-rsvp { border-bottom: 0; }
.icon { display: inline-block; width: 1.125rem; height: 1.125rem; flex-shrink: 0; vertical-align: -.15em; }
.text-link .icon { margin-left: .35em; }
.nav-rsvp .icon { margin-left: 16px; }
.eyebrow { text-transform: uppercase; font-size: 14px; font-weight: 600; letter-spacing: .22em; line-height: 1.7; }
.muted { color: var(--muted); }
.button { min-height: 48px; padding: 13px 25px; border: 1px solid transparent; border-radius: var(--radius); display: inline-flex; align-items: center; justify-content: center; gap: 32px; font-family: var(--font-body); font-size: 16px; font-weight: 600; line-height: 1.5; text-decoration: none; transition: background .18s, transform .18s; }
.button:hover:not(:disabled) { transform: translateY(-1px); }
.button-dark { background: var(--blue-mid); color: var(--white); }
.button-dark:hover:not(:disabled) { background: var(--blue-dark); }
.button-cream { background: var(--cream-bg); color: var(--blue-dark); }
.button-cream:hover { background: var(--white); }
.button-outline { border-color: var(--border); color: var(--blue-dark); background: transparent; }
.button-outline:hover { background: var(--soft-blue); }
.text-link { display: inline-block; border: 0; border-bottom: 1px solid currentColor; padding: 8px 0; background: transparent; color: var(--blue-mid); font-size: 14px; font-weight: 500; text-decoration: none; }
.hero { position: relative; min-height: 690px; height: min(780px, calc(100svh - 94px)); margin: 0 22px 22px; overflow: hidden; color: var(--white); background: var(--blue-mid); isolation: isolate; }
.hero picture,.hero picture img,.hero-shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero picture img { object-fit: cover; }
.hero-shade { background: var(--hero-gradient); }
.hero-content { position: relative; height: 100%; min-height: inherit; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 50px 20px 100px; }
.hero h1 { font-size: clamp(68px, 9vw, 126px); letter-spacing: -.06em; margin-top: 22px; }
.hero-script { font-family: var(--font-heading); font-style: italic; font-size: clamp(22px, 2.6vw, 34px); margin-top: 10px; }
.hero-rule { width: 48px; height: 1px; background: var(--hero-rule); margin: 28px 0 23px; }
.hero-date { text-transform: uppercase; letter-spacing: .14em; font-size: 14px; }
.hero-location { font-size: 14px; margin-top: 6px; opacity: .88; }
.hero .button { margin-top: 30px; }
.hero-scroll { min-height: 44px; position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 20px; font-size: 14px; letter-spacing: .06em; text-decoration: none; white-space: nowrap; }
.section-wrap { width: min(var(--content-width), 88%); margin: 0 auto; }
.intro { padding: 20px 0; }
.intro h2 { margin: 20px 0 0; max-width: 550px; }
.flourish { display: block; color: var(--blue-light); font-size: 32px; margin: 22px 0 14px; }
.body-large { color: var(--muted); font-size: 17px; line-height: 2; }
.celebration { padding: 76px 0; background: var(--soft-blue); }
.section-heading { display: flex; justify-content: space-between; gap: 24px; align-items: flex-end; }
.section-heading h2 { margin-top: 12px; }
.section-heading > p { font-size: 16px; }
.detail-note { color: var(--muted); margin-top: 25px; max-width: 720px; font-size: 14px; }
.schedule-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%, 260px),1fr)); margin-top: 38px; }
.schedule-card { padding: 12px 30px 12px 0; }
.schedule-card + .schedule-card { padding-left: 35px; border-left: 1px solid var(--border); }
.schedule-card h3 { font-size: 24px; margin: 16px 0 9px; }
.schedule-card p:not(.eyebrow) { font-size: 14px; }
.schedule-card .event-description { margin-top: 15px; max-width: 245px; }
.placeholder-note { margin-top: 38px; font-size: 14px; color: var(--muted); }
.registry-section { display: grid; grid-template-columns: 1fr 1fr; gap: 10%; align-items: center; padding: 100px 0; }
.registry-copy h2 { margin-top: 18px; }
.registry-copy > p:not(.eyebrow) { margin-top: 24px; color: var(--muted); }
.registry-copy .text-link { margin-top: 20px; }
.rsvp-invitation { background: var(--blue-mid); color: var(--cream-bg); text-align: center; padding: 68px 0; }
.rsvp-invitation h2 { margin-top: 22px; }
.rsvp-invitation p:not(.eyebrow) { max-width: 470px; margin: 25px auto; color: var(--invitation-copy); font-size: 14px; }
.rsvp-invitation small { display: block; margin-top: 20px; font-size: 14px; letter-spacing: .04em; }
.site-footer { padding: 48px 6% 32px; text-align: center; }
.footer-monogram { font-family: var(--font-heading); font-size: 30px; letter-spacing: -.07em; text-decoration: none; }
.site-footer p { font-size: 14px; color: var(--muted); margin: 10px 0 22px; }
.quiet-link { font-size: 14px; color: var(--muted); }
@media (min-width:1600px) { .hero { max-width: 1536px; margin-inline: auto; } }
@media (max-width:767px) {
 .site-header { position: relative; z-index: 10; height: 76px; padding: 0 6%; gap: 12px; }
 .site-header nav { gap: 18px; }
 .site-header nav a { min-height: 48px; display: inline-flex; align-items: center; font-size: 16px; }

 .nav-rsvp .icon { margin-left: 8px; }
 .hero { margin: 0 12px 12px; height: 740px; min-height: 640px; max-height: 940px; }
 .hero h1 { font-size: clamp(59px, 13vw, 90px); }
 .hero-content { padding-bottom: 110px; }
 .hero .eyebrow { font-size: 14px; }
 .hero-date { font-size: 14px; }
 .intro { padding: 0; }
 .intro h2 { max-width: none; }
 .body-large { font-size: 16px; }
 .section-heading { display: block; }
 .section-heading > p { margin-top: 20px; }
 .celebration { padding: 58px 0; }
 .schedule-grid { grid-template-columns: 1fr; margin-top: 24px; }
 .schedule-card, .schedule-card + .schedule-card { padding: 24px 0; border-left: 0; }
 .schedule-card + .schedule-card { border-top: 1px solid var(--border); }
 .schedule-card .event-description { max-width: none; }
 .placeholder-note { margin-top: 12px; }
 .registry-section { grid-template-columns: 1fr; padding: 65px 0; gap: 38px; }

 .registry-copy { padding: 0 5%; }
 .rsvp-invitation { padding: 62px 0; }
}

/* Photo slots use real, replaceable files with intrinsic dimensions to prevent layout shift. */
.story-section > .intro { grid-column: 1; grid-row: 1; }
.story-section { display: grid; grid-template-columns: 1.1fr 1fr; gap: 8%; align-items: center; padding: 96px 0 25px; }
.story-photo img,.registry-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.story-photo { grid-column: 2; grid-row: 1; aspect-ratio: 4 / 3; overflow: hidden; background: var(--soft-blue); }
.registry-photo { aspect-ratio: 4 / 5; overflow: hidden; background: var(--soft-blue); }
.registry-section { padding-top: 80px; }
.registry-copy > p:not(.eyebrow),.rsvp-invitation p:not(.eyebrow),.detail-note,.schedule-card p:not(.eyebrow) { font-size: 16px; }
.rsvp-invitation p:not(.eyebrow) { max-width: 620px; }
.text-link { min-height: 44px; font-size: 16px; }
.quiet-link { display: inline-flex; min-height: 44px; align-items: center; font-size: 14px; }
.site-footer p { font-size: 14px; }
.schedule-date { font-size: 16px; font-weight: 500; color: var(--blue-mid); }
.schedule-gate { display: flex; align-items: flex-end; gap: 16px; margin-top: 30px; max-width: 700px; }
.schedule-code-field { display: flex; flex: 1; flex-direction: column; gap: 8px; min-width: 0; }
.schedule-code-field label { font-size: 16px; font-weight: 500; }
.schedule-code-field input { width: 100%; min-height: 52px; padding: 12px 16px; font-size: 16px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--white); color: var(--blue-dark); }
.schedule-gate .button { min-height: 52px; }
.schedule-notice { margin-top: 20px; font-size: 16px; color: var(--blue-mid); }
.schedule-notice[data-kind="error"] { color: var(--error); }
.schedule-unlocked-heading { margin-top: 32px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.schedule-unlocked-heading h3 { font-size: 26px; }
.nav-toggle { display: none; align-items: center; justify-content: center; gap: 12px; min-width: 48px; min-height: 48px; padding: 10px; border: 1px solid var(--border); border-radius: var(--radius); background: transparent; color: var(--blue-mid); font-size: 16px; }
.future-navigation { display: none; }
.dashboard-header > nav { display: none; }
@media (max-width: 767px) {
 .site-header { height: auto; min-height: 80px; flex-wrap: wrap; padding-block: 12px; }
 .site-header[data-navigation-ready] .nav-toggle { display: inline-flex; }
 .site-header nav,.dashboard-header > nav { width: 100%; flex-direction: column; align-items: stretch; gap: 0; padding: 12px 0; }
 /* Hide before module loading; JavaScript only enables the toggle and open state. */
 .site-header nav { display: flex; visibility: hidden; opacity: 0; transform: translateY(-8px); pointer-events: none; transition: opacity 180ms ease, transform 180ms cubic-bezier(.2,.7,.3,1), visibility 0s linear 180ms; position: absolute; top: 100%; left: 0; right: 0; padding: 16px 6% 24px; background: var(--cream-bg); border-bottom: 1px solid var(--border); box-shadow: var(--shadow); }
 .site-header.menu-open nav { visibility: visible; opacity: 1; transform: translateY(0); pointer-events: auto; transition-delay: 0s; }
 .site-header nav a { min-height: 48px; padding: 12px 0; font-size: 16px; }
 .site-header nav .nav-rsvp { justify-content: space-between; margin-top: 0; margin-bottom: 8px; }
 .future-navigation { display: flex; flex-direction: column; border-top: 1px solid var(--border); margin-top: 12px; padding-top: 16px; }
 .future-navigation .eyebrow { font-size: 12px; margin-bottom: 8px; }
 .future-navigation > span { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 0; font-size: 16px; color: var(--muted); }
 .future-navigation small { font-size: 12px; }
 .story-photo,.story-section > .intro { grid-column: auto; grid-row: auto; }
 .story-section { grid-template-columns: 1fr; gap: 32px; padding: 64px 0 0; }
 .registry-section { padding-top: 64px; }
 .registry-copy { padding: 0; }
 .schedule-gate { flex-direction: column; align-items: stretch; }
 .schedule-unlocked-heading { align-items: flex-start; flex-direction: column; gap: 8px; }
 .hero-location { max-width: 250px; }
 .hero .eyebrow { font-size: 12px; }
 .hero-date { font-size: 14px; }
 .hero-scroll { font-size: 14px; }
 .body-large { font-size: 16px; }
 .dashboard-header .admin-header-right { margin-left: auto; }
 .dashboard-header .admin-header-right .eyebrow { display: none; }
 .dashboard-header .nav-toggle { padding-inline: 10px; }
}
/* Shared by unlocked schedules and tier-specific RSVP event blocks. */
.event-location { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 4px 22px; margin-top: 14px; }
.event-location .event-arrival { flex-basis: 100%; margin: 0 0 4px; font-size: 14px; font-weight: 500; color: var(--blue-mid); }
/* Keep the vendor dropdown in the page's stacking/viewport context, with no clipping frame. */
.event-directions-embed { position: relative; min-width: 0; max-width: 100%; flex: 0 1 auto; overflow: visible; }
.event-directions-embed:hover,.event-directions-embed:focus-within { z-index: 30; }
.event-directions-embed > a { display: inline-flex; align-items: center; min-height: 44px; }
.event-directions-embed > a[hidden] { display: none; }
.event-directions-embed .widget-status { max-width: 260px; margin: 4px 0; font-size: 14px; color: var(--muted); }
.event-address { font-size: 14px; color: var(--muted); }
.event-address summary { min-height: 44px; padding: 9px 0; cursor: pointer; }
.event-address address { font-style: normal; line-height: 1.7; padding: 4px 0 8px; overflow-wrap: anywhere; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *,*::before,*::after { animation: none !important; transition: none !important; } }