/* The couple is already introduced in the hero. Keep the navigation focused
   on page sections and usable on narrow screens after removing the old name
   or monogram from its leading edge. */
body > nav {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(14px, 2.4vw, 36px) !important;
  overflow-x: auto;
  scrollbar-width: none;
}

body > nav::-webkit-scrollbar,
body > nav > .menu::-webkit-scrollbar,
body > nav > .links::-webkit-scrollbar {
  display: none;
}

body > nav > .menu,
body > nav > .links {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(14px, 2.4vw, 36px) !important;
  width: auto !important;
  /* overflow-x: auto makes this a scroll container in both directions, so it clips at its own box:
     with links set 9px/1 that cut the accents off capitals ("UROCZYSTOŚĆ"). Vertical padding gives
     the letters room; the equal negative margin keeps the bar's height. */
  margin: -.45em 0 !important;
  padding: .45em 0 !important;
  overflow-x: auto;
  scrollbar-width: none;
}

body > nav > .menu a,
body > nav > .links a {
  display: inline-flex !important;
  flex: 0 0 auto;
  margin: 0 !important;
  white-space: nowrap;
}

body > nav > a {
  display: inline-flex !important;
  flex: 0 0 auto;
  white-space: nowrap;
}

body > nav > .nav-date {
  position: absolute;
  right: clamp(20px, 4vw, 60px);
}

@media (max-width: 850px) {
  body > nav {
    min-height: 54px;
    height: auto !important;
    justify-content: flex-start !important;
    padding: 0 16px !important;
  }

  body > nav > .menu,
  body > nav > .links {
    justify-content: flex-start !important;
    width: 100% !important;
  }

  body > nav > .nav-date {
    display: none !important;
  }
}

/* A generated site is viewed as the finished composition, not as a full-bleed
   editing canvas. Give it a little distance on larger screens while preserving
   the original responsive/mobile sizes and every design's internal proportions. */
html:has(> body[data-generated-site]) {
  background: #e8e5de;
}

@media (min-width: 1024px) and (max-width: 1279px) {
  body[data-generated-site] {
    width: 100vw !important;
    margin-right: auto !important;
    margin-left: auto !important;
    zoom: .9;
    box-shadow: 0 0 48px rgba(45, 42, 36, .08);
  }
}

@media (min-width: 1280px) {
  body[data-generated-site] {
    width: 100vw !important;
    margin-right: auto !important;
    margin-left: auto !important;
    zoom: .84;
    box-shadow: 0 0 64px rgba(45, 42, 36, .1);
  }
}

#generated-status{grid-column:1/-1;flex-basis:100%;width:fit-content;max-width:100%;margin:16px 0 0;padding:10px 16px;border-radius:6px;font-family:inherit;font-size:15px;line-height:1.5;letter-spacing:0;text-transform:none}#generated-status:empty{display:none}#generated-status[data-state=success]{background:#e8f5eb;color:#185b30}#generated-status[data-state=error]{background:#ffeded;color:#8d1420}#generated-rsvp button:disabled{opacity:.6;cursor:wait}
.generated-guest-gallery{margin:22px 0 30px;text-align:center}.generated-guest-gallery a{display:inline-block;padding:10px 22px;border:1px solid currentColor;border-radius:999px;color:inherit;font-size:14px;letter-spacing:.06em;text-decoration:none}
.hero-art{position:relative;container-type:inline-size;line-height:0}.hero-art>img{display:block;width:100%;height:auto}.hero-names{position:absolute;inset:0;margin:0;pointer-events:none;line-height:1}.hero-names span{position:absolute;transform:translate(-50%,-50%);white-space:nowrap}
.gate .addr a{border-bottom:1px solid var(--sky-2)}.gate .venue-note{margin-top:10px;font-style:italic}
#gallery .gallery-grid{display:flex;flex-wrap:wrap;justify-content:center}#gallery .gframe{width:calc((100% - 48px) / 3)}@media (max-width:860px){#gallery .gframe{width:100%}}
.stay-intro{max-width:620px;margin:-24px auto 48px;text-align:center;color:var(--ink-s)}@media (min-width:861px){.hotels[data-count="1"]{grid-template-columns:1fr;max-width:340px}.hotels[data-count="2"]{grid-template-columns:repeat(2,1fr);max-width:680px}}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.rf .row>.rsvp-field:only-child{grid-column:1/-1}