@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500&display=swap");

:root {
  --text-label-font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --text-label-font-weight: 500;
  --dress-code-swatch-size: 42px;
  --dress-code-swatch-gap: 10px;
  --dress-code-color-1: #0b0b0b;
  --dress-code-color-2: #382728;
  --dress-code-color-3: #786463;
  --dress-code-color-4: #ac8286;
  --dress-code-color-5: #d3b6bb;
  --dress-code-color-6: #dcd2d1;
  --dress-code-color-7: #c5d0cc;
  --dress-code-color-8: #aebea4;
  --dress-code-color-9: #666e51;
  --dress-code-color-10: #435e4e;
  --bg: #f3f1f4;
  --bg-soft: #f7f5f8;
  --surface: #fcfbfd;
  --surface-soft: #f7f5f8;
  --text: #3c383d;
  --text-soft: #6f6971;
  --title: #2d2a2f;
  --line: rgba(156, 149, 158, 0.14);
  --accent: #6f6971;
  --accent-strong: #4c4650;
  --accent-hover: #8b848e;
  --accent-soft: #f2eef3;
  --shadow: 0 10px 28px rgba(73, 66, 76, 0.08);
  --shadow-soft: 0 6px 18px rgba(73, 66, 76, 0.05);
  --radius-xl: 32px;
  --radius-lg: 24px;
  --radius-md: 18px;
  --radius-sm: 14px;
  --container: 1180px;
  --header-height: 88px;
  --transition: 0.22s ease;
    --hero-lace-strip: url("data:image/png;base64,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");
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  background: #f3f1f4;
}

body {
  margin: 0;
  min-width: 320px;
  font-family: var(--text-label-font-family);
  font-weight: var(--text-label-font-weight);
  color: var(--text);
  background: #f3f1f4;
  line-height: 1.6;
  overflow-x: hidden;
  --block-gap: clamp(22px, 3.4vw, 36px);
  --content-gap: clamp(22px, 2.6vw, 32px);
  --lace-outset: 54px;
  --lace-block-gap: calc(var(--block-gap) + var(--lace-outset));
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

.page-bg {
  position: fixed;
  inset: 0;
  z-index: 0;
  background-color: #f3f1f4;
  background-image:
    radial-gradient(circle at 12% 18%, rgba(255, 255, 255, 0.72) 0 0.8px, transparent 1.7px),
    radial-gradient(circle at 72% 28%, rgba(232, 228, 234, 0.82) 0 0.8px, transparent 1.8px),
    radial-gradient(circle at 28% 78%, rgba(236, 232, 238, 0.72) 0 0.7px, transparent 1.7px),
    radial-gradient(circle at 80% 74%, rgba(255, 255, 255, 0.55) 0 0.9px, transparent 1.9px),
    repeating-linear-gradient(
      32deg,
      rgba(229, 225, 231, 0.22) 0,
      rgba(229, 225, 231, 0.22) 1px,
      transparent 1px,
      transparent 6px
    ),
    repeating-linear-gradient(
      122deg,
      rgba(255, 255, 255, 0.16) 0,
      rgba(255, 255, 255, 0.16) 1px,
      transparent 1px,
      transparent 8px
    ),
    linear-gradient(180deg, #f4f2f5 0%, #f1eff3 100%);
  background-size: 64px 64px, 88px 88px, 96px 96px, 118px 118px, 100% 100%, 100% 100%, 100% 100%;
  pointer-events: none;
}

.site-header,
main,
.to-top {
  position: relative;
  z-index: 1;
}

img {
  max-width: 100%;
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  cursor: pointer;
  border: 0;
  background: transparent;
  -webkit-tap-highlight-color: transparent;
}

.container {
  width: min(calc(100% - 40px), var(--container));
  margin: 0 auto;
}

.section {
  position: relative;
  padding: 0;
  margin: 0 0 var(--block-gap);
  scroll-margin-top: calc(var(--header-height) + var(--block-gap));
}

.section-heading {
  max-width: 720px;
  margin-bottom: var(--content-gap);
}

.section-heading.center {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.section-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  color: var(--accent-strong);
  font-size: 13px;
  font-weight: var(--text-label-font-weight);
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.section-kicker::before {
  content: "";
  width: 32px;
  height: 1px;
  background: #054627;
}

.section-heading h2,
.final-card h2,
.rsvp-info h2 {
  margin: 0;
  color: var(--title);
  font-family: "Forum", serif;
  font-size: clamp(2.35rem, 4.8vw, 4rem);
  line-height: 1.02;
  font-weight: 400;
  letter-spacing: -0.02em;
}

.section-heading p,
.location-text,
.rsvp-info p,
.final-card p {
  color: var(--text-soft);
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 30;
  background: rgba(243, 241, 244, 0.94);
  border-bottom: 1px solid rgba(181, 174, 183, 0.18);
  backdrop-filter: blur(10px);
}

.header-inner {
  min-height: var(--header-height);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.brand {
  font-family: "Forum", serif;
  font-size: 2rem;
  font-weight: 400;
  letter-spacing: 0.06em;
  color: var(--title);
}

.site-nav {
  display: flex;
  align-items: center;
  gap: 28px;
}

.site-nav a {
  position: relative;
  color: var(--text-soft);
  font-size: 0.96rem;
  font-weight: var(--text-label-font-weight);
  transition: color var(--transition);
}

.site-nav a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -7px;
  width: 100%;
  height: 1px;
  transform: scaleX(0);
  transform-origin: center;
  background: var(--accent-strong);
  transition: transform var(--transition);
}

.site-nav a:hover,
.site-nav a:focus-visible {
  color: var(--accent-hover);
}

.site-nav a:hover::after,
.site-nav a:focus-visible::after {
  background: var(--accent-hover);
  transform: scaleX(1);
}

.nav-toggle {
  display: none;
  position: relative;
  width: 52px;
  height: 52px;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: var(--shadow-soft);
}

.nav-toggle span {
  position: absolute;
  width: 20px;
  height: 1.5px;
  border-radius: 999px;
  background: var(--title);
  transition: transform var(--transition), opacity var(--transition);
}

.nav-toggle span:first-child {
  transform: translateY(-4px);
}

.nav-toggle span:last-child {
  transform: translateY(4px);
}

.nav-toggle.active span:first-child {
  transform: rotate(45deg);
}

.nav-toggle.active span:last-child {
  transform: rotate(-45deg);
}

.hero {
  margin: var(--lace-block-gap) 0 var(--lace-block-gap);
  padding-top: 0;
  padding-bottom: 0;
  min-height: auto;
  display: flex;
  align-items: flex-start;
}

.hero-card,
.countdown-box,
.location-card,
.map-card,
.final-card,
.rsvp-wrap,
.invitation-card,
.note-card,
.detail-card,
.extra-card,
.timeline-card {
  background: var(--surface);
  border: 1px solid rgba(181, 174, 183, 0.16);
  box-shadow: 0 10px 26px rgba(73, 66, 76, 0.045);
}

.hero-card {
  position: relative;
  isolation: isolate;
  overflow: visible;
  padding: 58px;
  border-radius: 40px;
  max-width: 920px;
  margin: 0 auto;
}

.hero-card > *,
.final-card > * {
  position: relative;
  z-index: 2;
}

.hero-card::before {
  content: "";
  position: absolute;
  inset: -54px;
  z-index: 1;
  pointer-events: none;
  background:
    url("./assets/lace-top.png") top left / 260px 86px repeat-x,
    url("./assets/lace-right.png") top right / 86px 260px repeat-y,
    url("./assets/lace-bottom.png") bottom left / 260px 86px repeat-x,
    url("./assets/lace-left.png") top left / 86px 260px repeat-y;
  filter: drop-shadow(0 10px 18px rgba(98, 71, 57, 0.1));
}

.hero-card::after {
  content: "";
  position: absolute;
  inset: -8px;
  z-index: 1;
  pointer-events: none;
  border: 1px solid rgba(255, 255, 255, 0.85);
  border-radius: 46px;
}

.hero-overline {
  margin: 0 0 18px;
  color: var(--accent-strong);
  font-size: 0.82rem;
  font-weight: var(--text-label-font-weight);
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.hero h1 {
  margin: 0;
  font-family: "Forum", serif;
  font-size: clamp(3.4rem, 8vw, 6.6rem);
  line-height: 0.96;
  color: var(--title);
  font-weight: 400;
  letter-spacing: -0.03em;
}

.hero h1 span {
  color: var(--accent-strong);
  font-style: italic;
}

.hero-quote {
  max-width: 620px;
  margin: 26px 0 0;
  color: var(--text-soft);
  font-size: clamp(1.08rem, 2.4vw, 1.28rem);
  font-family: var(--text-label-font-family);
  font-weight: var(--text-label-font-weight);
  line-height: 1.55;
  letter-spacing: 0.02em;
}

.hero-meta {
  margin-top: 38px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.hero-meta-item {
  padding: 22px 24px;
  border-radius: 22px;
  background: #f8f6f9;
  border: 1px solid rgba(181, 174, 183, 0.14);
  align-items: center;
  justify-content: center;
  text-align: center;
}

.hero-meta-item span,
.detail-label,
.location-meta span {
  display: block;
  margin-bottom: 8px;
  color: var(--accent-strong);
  font-size: 14px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700 !important;
}

.hero-meta-item strong,
.location-meta strong {
  color: var(--title);
  font-size: 18px;
  font-weight: var(--text-label-font-weight);
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 34px;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  padding: 0 26px;
  border-radius: 999px;
  transition: background var(--transition), color var(--transition), border-color var(--transition);
  font-weight: var(--text-label-font-weight);
  text-align: center;
}

.btn-primary {
  color: #ffffff;
  background: var(--accent-strong);
  box-shadow: 0 8px 18px rgba(184, 148, 117, 0.2);
}

.btn-primary:hover,
.btn-primary:focus-visible {
  background: var(--accent-hover);
}

.btn-secondary {
  color: var(--title);
  background: #ffffff;
  border: 1px solid rgba(127, 104, 91, 0.12);
}

.btn-secondary:hover,
.btn-secondary:focus-visible {
  background: var(--accent-soft);
}

.invitation-grid,
.location-layout,
.rsvp-wrap {
  display: grid;
  grid-template-columns: 1.3fr 0.9fr;
  gap: 24px;
  font-family: var(--text-label-font-family);
  font-weight: var(--text-label-font-weight);
}

.invitation-card,
.note-card,
.location-card,
.map-card {
  border-radius: var(--radius-xl);
  padding: 34px;
}

.invitation-card p,
.note-card p,
.detail-card p,
.extra-card p,
.timeline-card p,
.location-card p,
.map-content p {
  margin: 0;
  color: var(--text-soft);
}

.invitation-card p + p,
.note-card p + p {
  margin-top: 16px;
}

.note-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.note-icon {
  width: 60px;
  height: 60px;
  display: grid;
  place-items: center;
  margin-bottom: 18px;
  border-radius: 50%;
  background: #ac8286;
  color: #ffffff;
  font-size: 1.5rem;
}

.note-card h3,
.detail-card h3,
.extra-card h3,
.timeline-card h3,
.map-content h3 {
  margin: 0 0 12px;
  font-family: "Forum", serif;
  color: var(--title);
  font-size: 1.9rem;
  line-height: 1.08;
  font-weight: 400;
}

.details-grid,
.extras-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.detail-card,
.extra-card {
  border-radius: 28px;
  padding: 28px;
}

.detail-location-image {
  width: 100%;
  max-width: 350px;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  margin: 0 0 16px;
  border-radius: 20px;
  box-shadow: 0 8px 18px rgba(73, 66, 76, 0.08);
}

.dress-code-palette {
  display: grid;
  grid-template-columns: repeat(10, minmax(0, 1fr));
  gap: clamp(4px, 1vw, var(--dress-code-swatch-gap));
  width: 100%;
  max-width: calc(var(--dress-code-swatch-size) * 10 + var(--dress-code-swatch-gap) * 9);
  margin: 2px 0 18px;
}

.dress-code-swatch {
  position: relative;
  isolation: isolate;
  width: 100%;
  min-width: 0;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--dress-code-color-1);
  cursor: pointer;
  box-shadow:
    inset 0 0 0 1px rgba(45, 42, 47, 0.08),
    0 4px 10px rgba(73, 66, 76, 0.06);
  transition:
    transform 0.28s ease,
    box-shadow 0.28s ease,
    filter 0.28s ease;
}

.dress-code-swatch::after {
  content: "";
  position: absolute;
  inset: -6px;
  z-index: -1;
  border-radius: inherit;
  border: 1px solid rgba(76, 70, 80, 0.22);
  opacity: 0;
  transform: scale(0.82);
  transition:
    opacity 0.28s ease,
    transform 0.28s ease;
}

.dress-code-swatch:hover {
  transform: translateY(-7px) scale(1.08);
  filter: saturate(1.08);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.28),
    0 14px 24px rgba(73, 66, 76, 0.14);
}

.dress-code-swatch:hover::after {
  opacity: 1;
  transform: scale(1);
}

.dress-code-swatch:active {
  transform: translateY(-2px) scale(1.04);
}

.dress-code-swatch--1 {
  background: var(--dress-code-color-1);
}

.dress-code-swatch--2 {
  background: var(--dress-code-color-2);
}

.dress-code-swatch--3 {
  background: var(--dress-code-color-3);
}

.dress-code-swatch--4 {
  background: var(--dress-code-color-4);
}

.dress-code-swatch--5 {
  background: var(--dress-code-color-5);
}

.dress-code-swatch--6 {
  background: var(--dress-code-color-6);
}

.dress-code-swatch--7 {
  background: var(--dress-code-color-7);
}

.dress-code-swatch--8 {
  background: var(--dress-code-color-8);
}

.dress-code-swatch--9 {
  background: var(--dress-code-color-9);
}

.dress-code-swatch--10 {
  background: var(--dress-code-color-10);
}

.countdown-box {
  position: relative;
  overflow: hidden;
  border-radius: 40px;
  padding: 54px 32px;
  text-align: center;
}


.timer {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  max-width: 880px;
  margin: 0 auto;
}

.timer-item {
  padding: 28px 16px;
  border-radius: 28px;
  background: #f8f6f9;
  border: 1px solid rgba(181, 174, 183, 0.14);
}

.timer-value {
  display: block;
  color: #054627;;
  font-family: var(--text-label-font-family);
  font-size: clamp(2.2rem, 4.4vw, 3.5rem);
  line-height: 1;
  font-weight: 500;
  letter-spacing: -0.05em;
}

.timer-label {
  display: inline-block;
  margin-top: 10px;
  color: var(--text-soft);
  font-size: 0.96rem;
}

.timeline {
  --timeline-time-size: 72px;
  --timeline-time-background: #ac8286;
  --timeline-time-color: #ffffff;
  --timeline-time-gap: 22px;

  position: relative;
  display: grid;
  gap: 22px;
}

.timeline::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(var(--timeline-time-size) / 2);
  width: 1px;
  background: rgba(184, 148, 117, 0.28);
}

.timeline-item {
  position: relative;
  display: grid;
  grid-template-columns: var(--timeline-time-size) minmax(0, 1fr);
  gap: var(--timeline-time-gap);
  align-items: center;
}

.timeline-time {
  position: relative;
  z-index: 1;
  align-self: center;
  justify-self: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--timeline-time-size);
  height: var(--timeline-time-size);
  padding: 0;
  text-align: center;
  border-radius: 50%;
  background: var(--timeline-time-background);
  color: var(--timeline-time-color);
  font-family: var(--text-label-font-family);
  font-size: 1.08rem;
  line-height: 1;
  font-weight: var(--text-label-font-weight);
  letter-spacing: 0.02em;
  box-shadow: 0 12px 26px rgba(172, 130, 134, 0.24), inset 0 0 0 1px rgba(255, 255, 255, 0.36);
}

.timeline-card {
  position: relative;
  border-radius: 28px;
  padding: 28px 30px;
}

.location-layout {
  align-items: stretch;
}

.location-card,
.map-card {
  min-height: 100%;
}

.location-meta {
  display: grid;
  gap: 18px;
  margin: 28px 0 30px;
}

.map-card {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
  min-height: 460px;
  background: #fcfbfd;
}

.map-badge {
  position: absolute;
  top: 26px;
  right: 26px;
  z-index: 2;
  padding: 10px 16px;
  border-radius: 999px;
  background: #ffffff;
  border: 1px solid rgba(127, 104, 91, 0.1);
  color: var(--accent-strong);
  font-size: 0.8rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.map-shape {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

.map-shape-1 {
  top: 8%;
  left: 10%;
  width: 220px;
  height: 220px;
  background: rgba(200, 169, 141, 0.16);
}

.map-shape-2 {
  right: 6%;
  bottom: 6%;
  width: 260px;
  height: 260px;
  background: rgba(255, 255, 255, 0.7);
}

.map-pin {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 64px;
  height: 64px;
  border-radius: 50% 50% 50% 0;
  background: var(--accent-strong);
  transform: translate(-50%, -50%) rotate(-45deg);
  transform-origin: center;
  box-shadow: 0 10px 22px rgba(184, 148, 117, 0.22);
}

.map-pin span {
  position: absolute;
  inset: 18px;
  border-radius: 50%;
  background: #ffffff;
}

.map-content {
  position: relative;
  z-index: 1;
  width: calc(100% - 44px);
  margin: 22px;
  padding: 26px;
  border-radius: 24px;
  background: #ffffff;
  border: 1px solid rgba(181, 174, 183, 0.14);
}

.rsvp-wrap {
  grid-template-columns: 1.3fr 0.9fr;
  gap: 24px;
  border-radius: 40px;
  padding: 34px;
}

.rsvp-note {
  margin-top: 22px;
  padding: 16px 18px;
  border-radius: 18px;
  background: #f7f5f8;
  color: var(--text-soft);
}

.rsvp-form {
  display: grid;
  gap: 16px;
}

.form-group {
  display: grid;
  gap: 10px;
}

.form-group label {
  color: var(--title);
  font-weight: var(--text-label-font-weight);
}

.form-group input,
.form-group select,
.form-group textarea {
  width: 100%;
  padding: 17px 18px;
  border-radius: 18px;
  border: 1px solid rgba(181, 174, 183, 0.18);
  background: #fbfafc;
  color: var(--text);
  outline: none;
  transition: border-color 0.16s ease, box-shadow 0.16s ease;
}

.form-group input::placeholder,
.form-group textarea::placeholder {
  color: #9b8f88;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  border-color: rgba(184, 148, 117, 0.45);
  box-shadow: 0 0 0 3px rgba(200, 169, 141, 0.12);
}

.form-submit {
  width: 100%;
  margin-top: 8px;
}

.form-status {
  min-height: 28px;
  margin-top: 6px;
  font-size: 0.96rem;
  font-weight: var(--text-label-font-weight);
}

.form-status.success {
  color: #6f8a5a;
}

.form-status.error {
  color: #b86767;
}

.final {
  margin-top: var(--lace-block-gap);
  margin-bottom: var(--lace-block-gap);
  padding-bottom: 0;
}

.final-card {
  position: relative;
  isolation: isolate;
  overflow: visible;
  border-radius: 40px;
  padding: 56px;
  text-align: center;
}

.final-card::before {
  content: "";
  position: absolute;
  inset: -54px;
  z-index: 1;
  pointer-events: none;
  background:
    url("./assets/lace-top.png") top left / 260px 86px repeat-x,
    url("./assets/lace-right.png") top right / 86px 260px repeat-y,
    url("./assets/lace-bottom.png") bottom left / 260px 86px repeat-x,
    url("./assets/lace-left.png") top left / 86px 260px repeat-y;
  filter: drop-shadow(0 10px 18px rgba(98, 71, 57, 0.1));
}

.final-card::after {
  content: "";
  position: absolute;
  inset: -8px;
  z-index: 1;
  pointer-events: none;
  border: 1px solid rgba(255, 255, 255, 0.85);
  border-radius: 46px;
}

.final-card p {
  max-width: 760px;
  margin: 22px auto 0;
  font-size: 1.05rem;
}

.final-sign {
  margin-top: 28px;
  display: grid;
  gap: 6px;
}

.final-sign span {
  color: var(--text-soft);
}

.final-sign strong {
  font-family: "Forum", serif;
  color: var(--title);
  font-size: 2rem;
  font-weight: 400;
}

.to-top {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 20;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #ffffff;
  border: 1px solid rgba(127, 104, 91, 0.12);
  box-shadow: var(--shadow-soft);
  color: var(--title);
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);
  transition: opacity var(--transition), visibility var(--transition), transform var(--transition);
}

.to-top:hover,
.to-top:focus-visible {
  color: #ffffff;
  background: var(--accent-hover);
  border-color: var(--accent-hover);
}

.to-top.visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.reveal {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.32s ease, transform 0.32s ease;
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 1080px) {
  .hero-card,
  .final-card,
  .countdown-box,
  .rsvp-wrap {
    padding: 42px;
  }

  .details-grid,
  .extras-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .invitation-grid,
  .location-layout,
  .rsvp-wrap {
    grid-template-columns: 1fr;
  }

  .map-card {
    min-height: 360px;
  }
}

@media (max-width: 860px) {
  :root {
    --header-height: 78px;
  }

  .container {
    width: min(calc(100% - 28px), var(--container));
  }

  .nav-toggle {
    display: inline-flex;
  }

  .site-nav {
    position: absolute;
    top: calc(100% + 12px);
    left: 14px;
    right: 14px;
    padding: 18px;
    border-radius: 24px;
    background: #ffffff;
    border: 1px solid rgba(127, 104, 91, 0.1);
    box-shadow: var(--shadow);
    display: grid;
    gap: 12px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: opacity var(--transition), visibility var(--transition), transform var(--transition);
  }

  .site-nav.open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }

  .hero {
    padding-top: 0;
    padding-bottom: 0;
  }

  .hero-meta,
  .timer {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .timeline {
    --timeline-time-size: 62px;
    --timeline-time-gap: 14px;
  }

  .timeline::before {
    left: calc(var(--timeline-time-size) / 2);
  }

  .timeline-item {
    grid-template-columns: var(--timeline-time-size) minmax(0, 1fr);
    gap: var(--timeline-time-gap);
    padding-left: 0;
    align-items: center;
  }

  .timeline-time {
    font-size: 0.98rem;
  }

  .timeline-card::before {
    left: -30px;
    top: 26px;
    transform: none;
  }
}

@media (max-width: 640px) {
  body {
    --lace-outset: 36px;
  }

  .hero-card,
  .invitation-card,
  .note-card,
  .detail-card,
  .extra-card,
  .timeline-card,
  .location-card,
  .map-card,
  .countdown-box,
  .final-card,
  .rsvp-wrap {
    padding: 24px;
    border-radius: 26px;
  }

  .hero-card::before,
  .final-card::before {
    inset: -36px;
    background:
      url("./assets/lace-top.png") top left / 190px 63px repeat-x,
      url("./assets/lace-right.png") top right / 63px 190px repeat-y,
      url("./assets/lace-bottom.png") bottom left / 190px 63px repeat-x,
      url("./assets/lace-left.png") top left / 63px 190px repeat-y;
  }

  .hero-card::after,
  .final-card::after {
    inset: -5px;
    border-radius: 31px;
  }

  .hero-meta,
  .timer,
  .details-grid,
  .extras-grid {
    grid-template-columns: 1fr;
  }

  .hero-actions {
    flex-direction: column;
  }

  .btn,
  .form-submit {
    width: 100%;
  }

  .map-card {
    min-height: 300px;
  }

  .map-badge {
    top: 18px;
    right: 18px;
  }

  .to-top {
    right: 16px;
    bottom: 16px;
  }

  .detail-location-image {
    max-width: 350px;
    border-radius: 18px;
  }

  .dress-code-swatch {
    box-shadow:
      inset 0 0 0 1px rgba(45, 42, 47, 0.08),
      0 3px 8px rgba(73, 66, 76, 0.06);
  }

  .dress-code-swatch:active {
    transform: scale(1.14);
    filter: saturate(1.1);
    box-shadow:
      inset 0 0 0 1px rgba(255, 255, 255, 0.28),
      0 10px 18px rgba(73, 66, 76, 0.14);
  }

  .dress-code-swatch:active::after {
    opacity: 1;
    transform: scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
  }

  .reveal {
    opacity: 1;
    transform: none;
  }
}

.map-embed-card {
  padding: 0;
  overflow: hidden;
  min-height: 460px;
  background: #fffaf5;
  display: block;
}

.map-iframe {
  display: block;
  width: 100%;
  min-height: 460px;
  height: 100%;
  border: 0;
}

@media (max-width: 1080px) {
  .map-embed-card {
    min-height: 360px;
  }

  .map-iframe {
    min-height: 360px;
  }
}

@media (max-width: 640px) {
  .map-embed-card {
    min-height: 300px;
  }

  .map-iframe {
    min-height: 300px;
  }
}

body {
  font-feature-settings: "kern";
}

input,
select,
textarea,
button {
  font-family: var(--text-label-font-family);
  font-weight: var(--text-label-font-weight);
}

.hero-overline,
.section-kicker,
.hero-meta-item span,
.detail-label,
.location-meta span,
.timer-label,
.map-badge {
  font-family: var(--text-label-font-family);
  font-weight: 700;
}

.drink-group {
  margin: 0;
  padding: 0;
  border: 0;
}

.drink-group legend {
  margin: 0;
  color: var(--title);
  font-weight: var(--text-label-font-weight);
}

.drink-checkboxes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.drink-checkbox {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 54px;
  padding: 0 16px;
  border-radius: 18px;
  border: 1px solid rgba(181, 174, 183, 0.18);
  background: #fbfafc;
  color: var(--text);
  cursor: pointer;
}

.drink-checkbox input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.drink-checkbox span {
  width: 100%;
  text-align: center;
  font-weight: var(--text-label-font-weight);
}

.drink-checkbox:has(input:checked) {
  border-color: var(--accent-hover);
  background: var(--accent-soft);
  color: var(--title);
}

@media (max-width: 640px) {
  .drink-checkboxes {
    grid-template-columns: 1fr;
  }
}


html:has(body.invitation-locked),
body.invitation-locked {
  width: 100%;
  height: 100%;
  overflow: hidden;
  overscroll-behavior: none;
}

body.invitation-locked {
  position: fixed;
  inset: 0;
  touch-action: none;
}

body.invitation-locked .site-header,
body.invitation-locked main,
body.invitation-locked .to-top {
  visibility: hidden;
  pointer-events: none;
  user-select: none;
}

.envelope-gate {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-items: center;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  padding: 0;
  overflow: hidden;
  overscroll-behavior: contain;
  touch-action: none;
  isolation: isolate;
  background-color: #f3f1f4;
  background-image:
    radial-gradient(circle at 12% 18%, rgba(255, 255, 255, 0.72) 0 0.8px, transparent 1.7px),
    radial-gradient(circle at 72% 28%, rgba(232, 228, 234, 0.82) 0 0.8px, transparent 1.8px),
    radial-gradient(circle at 28% 78%, rgba(236, 232, 238, 0.72) 0 0.7px, transparent 1.7px),
    radial-gradient(circle at 80% 74%, rgba(255, 255, 255, 0.55) 0 0.9px, transparent 1.9px),
    repeating-linear-gradient(
      32deg,
      rgba(229, 225, 231, 0.22) 0,
      rgba(229, 225, 231, 0.22) 1px,
      transparent 1px,
      transparent 6px
    ),
    repeating-linear-gradient(
      122deg,
      rgba(255, 255, 255, 0.16) 0,
      rgba(255, 255, 255, 0.16) 1px,
      transparent 1px,
      transparent 8px
    ),
    linear-gradient(180deg, #f4f2f5 0%, #f1eff3 100%);
  background-size: 64px 64px, 88px 88px, 96px 96px, 118px 118px, 100% 100%, 100% 100%, 100% 100%;
  transition: opacity 0.62s ease, visibility 0.62s ease;
}

.envelope-gate::before,
.envelope-gate::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 0;
  pointer-events: none;
}

.envelope-gate::before {
  background-image:
    repeating-linear-gradient(
      18deg,
      rgba(236, 233, 238, 0.14) 0,
      rgba(236, 233, 238, 0.14) 1px,
      transparent 1px,
      transparent 9px
    ),
    repeating-linear-gradient(
      104deg,
      rgba(255, 255, 255, 0.1) 0,
      rgba(255, 255, 255, 0.1) 1px,
      transparent 1px,
      transparent 10px
    );
  background-size: 100% 100%, 100% 100%;
  opacity: 0.42;
}

.envelope-gate::after {
  background:
    radial-gradient(circle at 50% 16%, rgba(255, 255, 255, 0.34), transparent 36%),
    radial-gradient(circle at 50% 88%, rgba(230, 226, 232, 0.22), transparent 48%);
  opacity: 0.5;
}

.envelope-gate.opening {
  opacity: 0;
  visibility: hidden;
}

.envelope-gate.hidden {
  display: none;
}

.envelope-gate__content {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
}

.envelope-button {
  display: block;
  width: 100%;
  height: 100%;
  color: #3f342f;
  outline: none;
}

.envelope-button__scene {
  position: relative;
  display: block;
  width: 100%;
  height: 100dvh;
  min-height: 100vh;
  transform: translateY(0);
  transition: transform 0.32s ease;
}

.envelope-button:hover .envelope-button__scene,
.envelope-button:focus-visible .envelope-button__scene {
  transform: scale(1.01);
}

.envelope-photo-frame {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #f4f1ed;
  box-shadow: 0 26px 44px rgba(112, 102, 95, 0.14);
  transition: transform 0.5s ease, opacity 0.5s ease, filter 0.5s ease;
}

.envelope-photo-frame::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.04) 30%, rgba(255, 255, 255, 0.14));
  pointer-events: none;
  z-index: 1;
}

.envelope-photo {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

.envelope-photo-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: clamp(56px, 8vh, 88px) 24px clamp(72px, 16vh, 146px);
}

.envelope-photo-overlay__top {
  display: grid;
  justify-items: center;
  gap: clamp(26px, 4.2vh, 40px);
}

.envelope-gate__overline,
.envelope-gate__date,
.envelope-gate__title {
  margin: 0;
  font-family: var(--text-label-font-family);
  color: rgba(82, 72, 66, 0.72);
  text-align: center;
}

.envelope-gate__overline {
  font-size: clamp(0.92rem, 1.3vw, 1.1rem);
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.envelope-gate__date {
  font-size: clamp(1rem, 1.5vw, 1.2rem);
  letter-spacing: 0.08em;
}

.envelope-gate__title {
  font-size: clamp(2.4rem, 4vw, 4.25rem);
  line-height: 1;
  font-weight: 400;
  letter-spacing: 0.02em;
}

.envelope-button__text {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 0;
  color: rgba(104, 93, 87, 0.78);
  font-family: var(--text-label-font-family);
  font-size: clamp(0.88rem, 1.2vw, 1rem);
  letter-spacing: 0.08em;
}

.envelope-button.opened .envelope-photo-frame {
  opacity: 0;
  filter: blur(4px);
  transform: scale(1.02);
}

@media (max-width: 820px) {
  .envelope-gate {
    padding: 0;
  }

  .envelope-photo-overlay {
    padding: clamp(34px, 7vh, 54px) 18px clamp(56px, 14vh, 104px);
  }

  .envelope-photo-overlay__top {
    gap: clamp(18px, 3.8vh, 28px);
  }

  .envelope-gate__overline {
    font-size: 0.76rem;
    letter-spacing: 0.18em;
  }

  .envelope-gate__date {
    font-size: 0.9rem;
  }

  .envelope-gate__title {
    font-size: clamp(1.9rem, 8vw, 3rem);
  }

  .envelope-button__text {
    font-size: 0.82rem;
    letter-spacing: 0.06em;
  }
}

.wedding-calendar {
  padding: 0;
}

.wedding-calendar-card {
  max-width: 760px;
  margin: 0 auto;
  padding: 56px clamp(24px, 6vw, 72px) 62px;
  text-align: center;
  background: rgba(252, 251, 253, 0.92);
  border: 1px solid rgba(181, 174, 183, 0.16);
  border-radius: 40px;
  box-shadow: 0 10px 26px rgba(73, 66, 76, 0.045);
}

.wedding-calendar-title {
  margin: 0 0 34px;
  color: var(--title);
  font-family: "Forum", serif;
  font-size: clamp(3rem, 7vw, 4.8rem);
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.02em;
}

.wedding-calendar-weekdays,
.wedding-calendar-days {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.wedding-calendar-weekdays {
  margin-bottom: 28px;
}

.wedding-calendar-weekdays span {
  color: rgba(111, 105, 113, 0.72);
  font-family: var(--text-label-font-family);
  font-size: clamp(0.8rem, 2.2vw, 1rem);
  font-weight: var(--text-label-font-weight);
  letter-spacing: 0.12em;
  text-transform: lowercase;
}

.wedding-calendar-days {
  row-gap: 18px;
}

.wedding-calendar-day {
  position: relative;
  min-height: 54px;
  display: grid;
  place-items: center;
  color: var(--text);
  font-family: "Forum", serif;
  font-size: clamp(1.55rem, 4vw, 2.15rem);
  line-height: 1;
}

.wedding-calendar-day--active {
  color: var(--title);
}

.wedding-calendar-day--active::before {
  content: "♡";
  position: absolute;
  left: 50%;
  top: 63%;
  z-index: 0;
  color: #054627;
  font-family: "Forum", serif;
  font-size: clamp(4.3rem, 9vw, 5.7rem);
  font-weight: 400;
  line-height: 1;
  transform: translate(-50%, -50%);
  transform-origin: center;
  animation: calendar-heartbeat 1.35s ease-in-out infinite;
}

@keyframes calendar-heartbeat {
  0%,
  100% {
    transform: translate(-50%, -50%) scale(1);
  }

  14% {
    transform: translate(-50%, -50%) scale(1.16);
  }

  28% {
    transform: translate(-50%, -50%) scale(0.96);
  }

  42% {
    transform: translate(-50%, -50%) scale(1.12);
  }

  70% {
    transform: translate(-50%, -50%) scale(1);
  }
}

.wedding-calendar-day--active time {
  position: relative;
  z-index: 1;
  font: inherit;
}

@media (max-width: 860px) {
  .wedding-calendar {
    padding: 0;
  }

  .wedding-calendar-card {
    border-radius: 32px;
  }
}

@media (max-width: 640px) {
  .wedding-calendar {
    padding: 0;
  }

  .wedding-calendar-card {
    padding: 38px 18px 44px;
    border-radius: 26px;
  }

  .wedding-calendar-title {
    margin-bottom: 28px;
  }

  .wedding-calendar-weekdays {
    margin-bottom: 20px;
  }

  .wedding-calendar-days {
    row-gap: 12px;
  }

  .wedding-calendar-day {
    min-height: 44px;
  }

  .wedding-calendar-day--active::before {
    font-size: 4rem;
  }
}

.hero-instax {
  width: min(78vw, 320px);
  margin: 0 auto var(--block-gap);
}

.hero-instax-photo {
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

.hero-instax-photo img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center bottom;
  filter: saturate(0.9) contrast(0.96);
}

@media (min-width: 768px) {
  .hero-instax {
    width: 320px;
  }
}

.hero-image {
  display: flex;
  justify-content: center;
  margin: 0 auto var(--block-gap);
}

.hero-image-photo {
  width: min(72vw, 320px);
  aspect-ratio: 1 / 1.25;
  overflow: hidden;
  background: #f7f7f7;
}

.hero-image-photo img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.hero-initials {
  margin: 0 0 var(--block-gap);
  text-align: center;
  font-family: "Great Vibes", "Forum", cursive;
  font-size: 36px;
  font-style: italic;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.18em;
  color: #3f3f3f;
}

@media (max-width: 480px) {
  .hero-image-photo {
    width: min(76vw, 280px);
  }

  .hero-initials {
    margin: 0 0 var(--block-gap);
    font-size: 32px;
  }
}