:root {
  --paper: #e7d4ad;
  --ink: #292824;
  --wine: #75080e;
  --wine-bright: #a70b14;
  --hover: #000000;
  --white: #ffffff;
  --display: Didot, "Bodoni 72", "Bodoni MT", Baskerville, Georgia, serif;
  --body: Avenir, "Avenir Next", "Helvetica Neue", Arial, sans-serif;
}

* {
  box-sizing: border-box;
}

html {
  width: 100%;
  min-height: 100%;
  margin: 0;
  padding: 0;
  overflow-x: clip;
  background: var(--paper);
  overscroll-behavior: none;
}

body {
  width: 100%;
  min-height: 100%;
  margin: 0;
  padding: 0;
  overflow-x: clip;
  color: var(--ink);
  background: var(--paper);
  font-family: var(--body);
  overscroll-behavior: none;
}

main {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: clip;
}

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

.hero {
  position: relative;
  isolation: isolate;
  display: block;
  width: 100%;
  min-height: 0;
  margin: 0;
  padding: 0;
  aspect-ratio: 1440 / 890;
  overflow: hidden;
  background: var(--paper);
}

.hero__media {
  position: absolute;
  inset: 0;
  z-index: -2;
}

.hero__background {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.mobile-tagline {
  display: none;
}

.hero__content {
  position: absolute;
  top: 19.1%;
  left: 9.375%;
  width: 41.67%;
  text-shadow: 0.5rem 0.5rem 1.55rem rgb(74 55 32 / 0.16);
}

.names {
  margin: 0;
  color: var(--wine);
  font-family: var(--display);
  font-size: clamp(5.8rem, min(10.78vw, 17.45vh), 9.71rem);
  font-weight: 400;
  letter-spacing: -0.09em;
  line-height: 1;
}

.names__first,
.names__second {
  display: block;
  white-space: nowrap;
}

.names__first {
  display: flex;
  align-items: baseline;
  gap: 0.24em;
}

.names__first i {
  font-weight: 400;
}

.names__second {
  margin-top: 0;
  margin-left: 0.43em;
  color: var(--wine-bright);
}

.intro {
  max-width: 37.5rem;
  margin: 56px 0 0;
  color: rgb(0 0 0 / 0.7);
  font-size: clamp(1.12rem, min(1.95vw, 3.15vh), 1.75rem);
  line-height: 1;
}

.rsvp-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 56px;
  padding: 12px 28px;
  border: 0;
  border-radius: 1.5625rem;
  color: var(--white);
  background: var(--wine);
  box-shadow: 0.5rem 0.5rem 1.55rem rgb(74 55 32 / 0.12);
  font-size: clamp(1.1rem, min(1.95vw, 3.15vh), 1.75rem);
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  transition:
    background-color 220ms ease,
    color 220ms ease,
    transform 140ms ease;
}

.rsvp-button__label {
  display: block;
}

.rsvp-button:hover {
  color: var(--hover);
  background: var(--white);
}

.rsvp-button:active {
  transform: translateY(1px) scale(0.98);
}

.rsvp-button:focus-visible {
  outline: 3px solid var(--hover);
  outline-offset: 4px;
}

.artwork {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}

.artwork img {
  position: absolute;
  display: block;
  max-width: none;
}

.artwork__curve-text {
  top: 16.97%;
  left: 66.18%;
  width: 21.21%;
  transform: rotate(-3.64deg);
}

@keyframes hero-photo-arrival {
  0% {
    opacity: 0.72;
    transform: scale(1.045);
  }

  68% {
    opacity: 1;
    transform: scale(1.008);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes hero-type-arrival {
  0% {
    opacity: 0;
    transform: translate3d(0, 30px, 0) rotate(-1deg) scale(0.985);
  }

  72% {
    opacity: 1;
    transform: translate3d(0, -2px, 0) rotate(0.15deg) scale(1.004);
  }

  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0) rotate(0) scale(1);
  }
}

@keyframes hero-copy-arrival {
  0% {
    opacity: 0;
    transform: translate3d(0, 16px, 0);
  }

  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes hero-button-arrival {
  0% {
    opacity: 0;
    transform: translate3d(0, 14px, 0) scale(0.96);
  }

  70% {
    opacity: 1;
    transform: translate3d(0, -1px, 0) scale(1.015);
  }

  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes hero-tagline-arrival {
  0% {
    opacity: 0;
    transform: translate3d(0, -12px, 0) rotate(-6deg) scale(0.96);
  }

  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0) rotate(-3.64deg) scale(1);
  }
}

@media (prefers-reduced-motion: no-preference) {
  .hero__background {
    animation: hero-photo-arrival 1600ms cubic-bezier(0.16, 1, 0.3, 1) backwards;
  }

  .names__first,
  .names__second {
    transform-origin: left center;
  }

  .names__first {
    animation: hero-type-arrival 860ms cubic-bezier(0.16, 1, 0.3, 1) 220ms backwards;
  }

  .names__second {
    animation: hero-type-arrival 960ms cubic-bezier(0.16, 1, 0.3, 1) 360ms backwards;
  }

  .hero .intro {
    animation: hero-copy-arrival 720ms cubic-bezier(0.16, 1, 0.3, 1) 620ms backwards;
  }

  .hero .rsvp-button {
    animation: hero-button-arrival 720ms cubic-bezier(0.16, 1, 0.3, 1) 800ms backwards;
  }

  .artwork__curve-text,
  .mobile-tagline {
    animation: hero-tagline-arrival 900ms cubic-bezier(0.16, 1, 0.3, 1) 500ms backwards;
  }
}

.artwork__left-mark {
  top: 32.8%;
  left: 61.33%;
  width: 7.45%;
}

.artwork__right-mark {
  top: 25.17%;
  left: 86.7%;
  width: 4.53%;
}

.artwork__lower-left {
  top: 84.63%;
  left: 72.77%;
  width: 12.88%;
}

.artwork__lower-right {
  top: 78.38%;
  left: 88.84%;
  width: 12.24%;
}

.artwork__speck {
  top: 91.84%;
  left: 96.8%;
  width: 0.8%;
}

.love-story {
  position: relative;
  isolation: isolate;
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  aspect-ratio: 1440 / 890;
  overflow: hidden;
  background: #e3d3bb;
}

.love-story__mobile-reference,
.story-reader__flip-card,
.story-reader__mobile-frame,
.story-reader__mobile-photo {
  display: none;
}

.love-story__background {
  position: absolute;
  inset: 0;
  z-index: -1;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.love-story__overview {
  position: absolute;
  inset: 0;
  opacity: 1;
  visibility: visible;
  transition:
    opacity 240ms ease,
    visibility 240ms ease;
}

.love-story__title,
.love-story__intro {
  position: absolute;
  margin: 0;
  text-shadow: 0.556vw 0.556vw 1.736vw rgb(48 55 10 / 0.25);
}

.love-story__title {
  top: 9.663%;
  left: 9.375%;
  color: rgb(255 255 255 / 0.7);
  font-family: var(--display);
  font-size: 10.781vw;
  font-weight: 400;
  letter-spacing: -0.09em;
  line-height: 1;
}

.love-story__intro {
  top: 32.472%;
  left: 14.236%;
  width: 44.583%;
  color: rgb(0 0 0 / 0.7);
  font-family: var(--body);
  font-size: 1.944vw;
  font-weight: 400;
  line-height: 1;
}

.love-story__photos {
  position: absolute;
  inset: 0;
}

.love-story__photo {
  --rotation: 0deg;
  --hover-rotation: 0deg;
  padding: 0;
  border: 0;
  position: absolute;
  z-index: 2;
  margin: 0;
  color: inherit;
  background: transparent;
  cursor: pointer;
  touch-action: manipulation;
  filter: drop-shadow(0 0.278vw 0.278vw rgb(76 56 33 / 0.24));
  opacity: 1;
  backface-visibility: hidden;
  transform-origin: center;
  transform: translate3d(0, 0, 0) rotate(var(--rotation)) scale(1);
  transition:
    filter 260ms ease,
    opacity 220ms ease,
    transform 320ms cubic-bezier(0.2, 0.8, 0.2, 1);
  appearance: none;
}

.love-story__photo:focus-visible {
  z-index: 4;
  outline: 0.2vw solid rgb(255 255 255 / 0.95);
  outline-offset: 0.35vw;
  border-radius: 1.75vw;
  filter:
    drop-shadow(0 0.45vw 0.38vw rgb(56 64 1 / 0.24))
    drop-shadow(0 1.4vw 1.25vw rgb(104 76 45 / 0.26));
  transform: translate3d(0, -0.75vw, 0) rotate(var(--hover-rotation)) scale(1.065);
}

.love-story__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: filter 260ms ease;
}

.love-story__click-cue {
  position: absolute;
  top: 32px;
  left: 50%;
  z-index: 3;
  display: block;
  width: 42.686%;
  color: #ffffff;
  font-family: "Figma Hand", "Bradley Hand", "Segoe Print", cursive;
  font-size: 1.944vw;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1;
  text-align: center;
  text-shadow:
    0 0.12em 0.15em rgb(20 18 15 / 0.38),
    0 0.32em 0.72em rgb(48 55 10 / 0.24);
  pointer-events: none;
  transform: translate3d(-50%, 0, 0) rotate(-1deg);
  transform-origin: center bottom;
  transition:
    opacity 180ms ease,
    transform 240ms cubic-bezier(0.16, 1, 0.3, 1);
}

.love-story__photo--one {
  --rotation: 8.93deg;
  --hover-rotation: 3.2deg;
  --invite-rotation: 5deg;
  top: 56.318%;
  left: 22.734%;
  width: 17.082%;
  aspect-ratio: 245.984 / 307.48;
}

.love-story__photo--two {
  --rotation: -2.81deg;
  --hover-rotation: -1deg;
  --invite-rotation: -0.75deg;
  top: 45.176%;
  left: 38.278%;
  width: 23.589%;
  aspect-ratio: 339.682 / 424.603;
}

.love-story__photo--three {
  --rotation: -5.3deg;
  --hover-rotation: -1.8deg;
  --invite-rotation: -2.5deg;
  top: 55.617%;
  left: 60.627%;
  width: 17.544%;
  aspect-ratio: 252.629 / 315.787;
}

@keyframes love-story-card-invite {
  0%,
  100% {
    transform: translate3d(0, 0, 0) rotate(var(--rotation)) scale(1);
  }

  42% {
    transform: translate3d(0, calc(-1 * var(--invite-lift, 10px)), 0)
      rotate(var(--invite-rotation)) scale(1.045);
  }

  72% {
    transform: translate3d(0, -2px, 0) rotate(var(--rotation)) scale(1.012);
  }
}

@keyframes love-story-click-cue-invite {
  0%,
  22%,
  100% {
    opacity: 0.94;
    transform: translate3d(-50%, 0, 0) rotate(-1deg) scale(1);
  }

  6% {
    opacity: 1;
    transform: translate3d(-50%, -0.22em, 0) rotate(1.2deg) scale(1.065);
  }

  11% {
    opacity: 0.98;
    transform: translate3d(-50%, 0.05em, 0) rotate(-0.6deg) scale(0.99);
  }

  16% {
    opacity: 1;
    transform: translate3d(-50%, -0.1em, 0) rotate(0.35deg) scale(1.025);
  }
}

@media (prefers-reduced-motion: no-preference) {
  .love-story__overview.is-inviting .love-story__photo {
    animation: love-story-card-invite 920ms cubic-bezier(0.16, 1, 0.3, 1) both;
  }

  .love-story__overview.is-inviting .love-story__photo--two {
    animation-delay: 150ms;
  }

  .love-story__overview.is-inviting .love-story__photo--three {
    animation-delay: 300ms;
  }

  .love-story__overview.is-inviting .love-story__click-cue {
    animation: love-story-click-cue-invite 4.8s cubic-bezier(0.16, 1, 0.3, 1) 720ms infinite;
  }

  .love-story__overview.is-inviting .love-story__photo:hover,
  .love-story__overview.is-inviting .love-story__photo:focus-visible,
  .love-story__overview.is-inviting .love-story__photo:active,
  body.story-popup-open .love-story__overview.is-inviting .love-story__photo {
    animation: none;
  }

  body.story-popup-open .love-story__click-cue {
    animation: none;
  }
}

@media (hover: hover) and (pointer: fine) and (min-width: 768px) {
  .love-story__photo {
    will-change: transform, filter;
  }

  .love-story__photo:hover {
    z-index: 4;
    filter:
      drop-shadow(0 0.45vw 0.38vw rgb(56 64 1 / 0.24))
      drop-shadow(0 1.4vw 1.25vw rgb(104 76 45 / 0.26));
    transform: translate3d(0, -1.1vw, 0) rotate(var(--hover-rotation)) scale(1.08);
  }

  .love-story__photo:hover img {
    filter: saturate(1.04) contrast(1.03) brightness(1.02);
  }

  .love-story__photo:active {
    transform: translate3d(0, -0.45vw, 0) rotate(var(--hover-rotation)) scale(1.045);
    transition-duration: 90ms;
  }

  .love-story__photo--two:is(:hover, :focus-visible) .love-story__click-cue {
    animation: none;
    opacity: 0;
    transform: translate3d(-50%, -0.22em, 0) rotate(-1deg) scale(0.98);
  }

  @supports selector(.love-story__photos:has(.love-story__photo:hover)) {
    .love-story__photos:has(.love-story__photo:is(:hover, :focus-visible))
      .love-story__click-cue {
      animation: none;
      opacity: 0;
      transform: translate3d(-50%, -0.22em, 0) rotate(-1deg) scale(0.98);
    }

    .love-story__photos:has(.love-story__photo:hover) .love-story__photo:not(:hover) {
      filter: drop-shadow(0 0.2vw 0.2vw rgb(76 56 33 / 0.16));
      opacity: 0.76;
      transform: translate3d(0, 0, 0) rotate(var(--rotation)) scale(0.97);
    }

    .love-story__photos:has(.love-story__photo:hover) .love-story__photo:not(:hover) img {
      filter: saturate(0.72) brightness(0.93);
    }
  }
}

html.story-popup-open,
body.story-popup-open {
  overflow: hidden;
  overscroll-behavior: none;
}

body.story-popup-open {
  position: fixed;
  right: 0;
  left: 0;
  width: 100%;
}

.story-reader {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  padding: 32px 32px 88px;
  background: rgb(22 19 13 / 0.62);
  backdrop-filter: blur(4px);
  opacity: 0;
  outline: none;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 140ms ease-out,
    visibility 0s linear 140ms;
  overscroll-behavior: contain;
}

.story-reader__popup {
  --story-reader-scale: 0.975;
  position: relative;
  container-type: inline-size;
  width: min(1183px, calc(100vw - 64px), calc((100vh - 120px) * 1.957));
  aspect-ratio: 4730 / 2417;
  transform: scale(var(--story-reader-scale));
  transition: transform 170ms cubic-bezier(0.16, 1, 0.3, 1);
}

.story-reader__panel {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: fill;
}

.story-reader__title {
  position: absolute;
  top: 12.25%;
  left: 6.34%;
  z-index: 1;
  margin: 0;
  color: rgb(227 211 187 / 0.88);
  font-family: var(--display);
  font-size: 13.1cqw;
  font-weight: 400;
  letter-spacing: -0.07em;
  line-height: 1;
  white-space: nowrap;
  text-shadow: 0.556vw 0.556vw 1.736vw rgb(48 55 10 / 0.22);
}

.story-reader__title-accent {
  color: #c50d17;
}

.story-reader__copy {
  position: absolute;
  top: 44.3%;
  left: 6.34%;
  z-index: 1;
  width: 54.2%;
  color: rgb(227 211 187 / 0.58);
  font-family: var(--body);
  font-size: 2.37cqw;
  font-weight: 400;
  line-height: 1.04;
  text-shadow: 0.556vw 0.556vw 1.736vw rgb(65 54 33 / 0.2);
}

.story-reader__copy p {
  margin: 0;
}

.story-reader__copy p + p {
  margin-top: 1.05em;
}

.story-reader__photo {
  position: absolute;
  top: 10.75%;
  left: 65.5%;
  z-index: 1;
  display: block;
  width: 30.43%;
  height: auto;
  aspect-ratio: 1493 / 1872;
  object-fit: contain;
  filter: drop-shadow(0 0.278vw 0.278vw rgb(65 54 33 / 0.2));
}

.story-reader__controls {
  position: absolute;
  top: calc(100% + 12px);
  left: 40.65%;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1.35fr 1fr;
  align-items: center;
  width: 18.7%;
  height: clamp(42px, 4.7cqw, 54px);
  padding: 0 0.6cqw;
  border: 1px solid rgb(227 211 187 / 0.34);
  border-radius: 999px;
  background: rgb(77 73 45 / 0.9);
  box-shadow: 0 8px 24px rgb(32 37 9 / 0.2);
}

.story-reader__controls button {
  min-width: 0;
  height: 100%;
  padding: 0;
  border: 0;
  color: rgb(255 255 255 / 0.92);
  background: transparent;
  font-family: var(--body);
  font-size: 1.52cqw;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  border-radius: 999px;
  touch-action: manipulation;
  transition:
    background-color 120ms ease-out,
    color 120ms ease-out,
    transform 120ms cubic-bezier(0.16, 1, 0.3, 1);
}

.story-reader__controls button:focus-visible {
  color: #ffffff;
  background: rgb(227 211 187 / 0.14);
  transform: translateY(-1px) scale(1.04);
}

.story-reader__controls button:focus-visible {
  outline: 0.12vw solid #ffffff;
  outline-offset: -0.15vw;
  border-radius: 999px;
}

.story-reader__controls button:disabled {
  opacity: 0.28;
  cursor: default;
}

.story-reader__controls button:active:not(:disabled) {
  background: rgb(227 211 187 / 0.22);
  transform: scale(0.92);
  transition-duration: 70ms;
}

@media (hover: hover) and (pointer: fine) {
  .story-reader__controls button:hover:not(:disabled):not(:active) {
    color: #ffffff;
    background: rgb(227 211 187 / 0.14);
    transform: translateY(-1px) scale(1.04);
  }
}

.story-reader__close {
  white-space: nowrap;
}

.story-reader__close.is-label {
  font-size: 1.34cqw;
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

.story-reader.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition:
    opacity 140ms ease-out,
    visibility 0s;
}

.story-reader.is-open .story-reader__popup {
  --story-reader-scale: 1;
  transform: scale(var(--story-reader-scale));
}

@media (max-width: 960px) {
  .hero__content {
    left: 7%;
    width: 48%;
  }

  .names {
    letter-spacing: -0.075em;
  }

}

@media (max-width: 767px) {
  .love-story {
    display: block;
    aspect-ratio: 390 / 631;
    min-height: 0;
    background: #e3d3bb;
  }

  .love-story__mobile-reference {
    position: absolute;
    inset: 0;
    z-index: -1;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .love-story__background {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }

  .love-story__title {
    top: 8.8%;
    left: 8.2%;
    color: rgb(255 255 255 / 0.72);
    font-size: 19vw;
    letter-spacing: -0.075em;
    text-shadow: 2px 4px 12px rgb(48 55 10 / 0.24);
  }

  .love-story__intro {
    top: 25.2%;
    left: 11.5%;
    width: 77%;
    color: rgb(0 0 0 / 0.7);
    font-size: 3.2vw;
    line-height: 1.08;
    text-align: center;
    text-shadow: 2px 4px 12px rgb(74 55 32 / 0.16);
  }

  .love-story__photo {
    --rotation: 0deg;
    z-index: 2;
    filter: none;
    aspect-ratio: 1493 / 1872;
    height: auto;
    transform: rotate(var(--rotation));
    -webkit-tap-highlight-color: transparent;
  }

  .love-story__photo::after {
    content: "";
    position: absolute;
    inset: 3%;
    border: 1px solid transparent;
    border-radius: 22px;
    background: transparent;
    box-shadow: none;
    opacity: 0;
    pointer-events: none;
    transform: scale(0.96);
    transition:
      background-color 100ms ease-out,
      border-color 100ms ease-out,
      box-shadow 100ms ease-out,
      opacity 100ms ease-out,
      transform 100ms cubic-bezier(0.16, 1, 0.3, 1);
  }

  .love-story__photo:focus-visible {
    filter: none;
    transform: scale(1.015);
  }

  .love-story__photo:focus-visible {
    outline: 2px solid rgb(255 255 255 / 0.95);
    outline-offset: 3px;
    border-radius: 22px;
  }

  .love-story__photo img {
    opacity: 1;
  }

  .love-story__photo:focus-visible::after,
  .love-story__photo:active::after {
    border-color: rgb(255 255 255 / 0.8);
    background: rgb(227 211 187 / 0.14);
    box-shadow:
      inset 0 0 0 1px rgb(56 64 1 / 0.16),
      0 8px 18px rgb(76 56 33 / 0.18);
    opacity: 1;
    transform: scale(0.98);
  }

  .love-story__photo:active {
    transform: scale(0.985);
    transition-duration: 70ms;
  }

  .love-story__photo--one {
    --rotation: -7deg;
    --invite-rotation: -3deg;
    --invite-lift: 8px;
    top: 49.1%;
    left: -7.2%;
    width: 35.5%;
  }

  .love-story__photo--two {
    --rotation: -1.6deg;
    --invite-rotation: -0.4deg;
    --invite-lift: 10px;
    top: 39.4%;
    left: 21.5%;
    width: 55.4%;
  }

  .love-story__photo--three {
    --rotation: 6deg;
    --invite-rotation: 2deg;
    --invite-lift: 8px;
    top: 49.2%;
    left: 72.4%;
    width: 35%;
  }

  .love-story__click-cue {
    top: 32px;
    width: 47%;
    font-size: 4.62vw;
    text-shadow:
      0 1px 2px rgb(20 18 15 / 0.4),
      0 4px 10px rgb(48 55 10 / 0.26);
  }

  .story-reader {
    perspective: 900px;
    padding: 0;
    background: rgb(22 19 13 / 0.68);
    backdrop-filter: blur(5px);
    transition:
      opacity 110ms ease-out,
      visibility 0s linear 110ms;
  }

  .story-reader.is-open {
    transition:
      opacity 110ms ease-out,
      visibility 0s;
  }

  .story-reader__popup {
    --story-reader-scale: 0.985;
    width: min(279px, calc(100vw - 40px), calc((100svh - 40px) * 279 / 348));
    aspect-ratio: 279 / 348;
    overflow: visible;
    background: transparent;
    border-radius: 0;
    filter: none;
    touch-action: none;
    transform: scale(var(--story-reader-scale));
    cursor: grab;
    transition: transform 140ms cubic-bezier(0.16, 1, 0.3, 1);
  }

  .story-reader__flip-card {
    --story-flip-angle: 0deg;
    --story-flip-lift: 0px;
    --story-flip-scale: 1;
    --story-flip-z: 0deg;
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 0;
    display: block;
    border-radius: 30px;
    box-shadow: 0 12px 24px rgb(32 37 9 / 0.3);
    transform:
      translateZ(var(--story-flip-lift))
      rotateZ(var(--story-flip-z))
      rotateY(var(--story-flip-angle))
      scale(var(--story-flip-scale));
    transform-style: preserve-3d;
    transform-origin: center;
    will-change: transform;
    transition: none;
  }

  .story-reader__flip-card.is-pointer-down,
  .story-reader__flip-card.is-dragging {
    cursor: grabbing;
    animation: none;
  }

  .story-reader__flip-card.is-intro-spinning,
  .story-reader__flip-card.is-settling {
    animation: none;
  }

  .story-reader__flip-card.is-flip-reset {
    transition: none;
  }

  .story-reader__mobile-frame {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 143.9cqw;
    height: auto;
    max-width: none;
    object-fit: fill;
    transform: translate(-21.94cqw, -63.22cqw);
    clip-path: inset(27.15% 15.25% 19.28% 15.25% round 6%);
    backface-visibility: hidden;
    pointer-events: none;
    user-select: none;
    -webkit-user-drag: none;
  }

  .story-reader__mobile-photo {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 30px;
    transform: rotateY(180deg);
    backface-visibility: hidden;
    pointer-events: none;
    user-select: none;
    -webkit-user-drag: none;
  }

  .story-reader__panel,
  .story-reader__photo {
    display: none;
  }

  .story-reader__title,
  .story-reader__copy {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }

  .story-reader__controls {
    top: 81.9%;
    left: 31.05%;
    width: 37.85%;
    height: 13.15%;
    padding: 0;
    grid-template-columns: repeat(3, 1fr);
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .story-reader__controls .story-reader__arrow,
  .story-reader__controls .story-reader__close,
  .story-reader__controls .story-reader__close.is-label {
    color: transparent;
    font-size: 0;
    text-shadow: none;
  }

  .story-reader__controls .story-reader__arrow:focus-visible,
  .story-reader__controls .story-reader__close:focus-visible {
    color: transparent;
    outline: 2px solid #ffffff;
    outline-offset: -4px;
  }

  .story-reader__controls button:active:not(:disabled) {
    background: rgb(227 211 187 / 0.2);
    transform: scale(0.86);
  }

  .story-reader__popup.is-photo-side .story-reader__controls {
    display: none;
  }

  @keyframes story-flip-invite {
    0%,
    4%,
    22%,
    100% {
      transform: translateZ(0) rotateY(0) scale(1);
    }

    9% {
      transform: translateZ(12px) rotateY(-9deg) scale(0.99);
    }

    14% {
      transform: translateZ(18px) rotateY(7deg) scale(0.985);
    }

    18% {
      transform: translateZ(7px) rotateY(-2.5deg) scale(0.996);
    }
  }

  @media (prefers-reduced-motion: no-preference) {
    .story-reader.is-open[data-phase="interactive"]
      .story-reader__popup:not(.is-photo-side)
      .story-reader__flip-card:not(.is-pointer-down):not(.is-dragging):not(.is-settling):not(.is-flip-reset) {
      animation: story-flip-invite 5.2s cubic-bezier(0.2, 0.72, 0.22, 1) 1.1s infinite;
    }
  }

  .hero {
    min-height: 0;
    aspect-ratio: 390 / 844;
    background: #c7a47c;
  }

  .hero__background {
    inset: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
  }

  .mobile-tagline {
    position: absolute;
    top: 8.47%;
    left: 22%;
    z-index: 1;
    display: block;
    width: 47.52%;
    height: auto;
    transform: rotate(-3.64deg);
    transform-origin: center;
    pointer-events: none;
  }

  .hero__content {
    top: 57.16%;
    right: auto;
    bottom: auto;
    left: 7.44%;
    width: 85.38%;
    padding: 0;
    text-align: center;
    text-shadow: 8px 8px 25px rgb(74 55 32 / 0.25);
  }

  .names {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    color: #77080e;
    font-size: clamp(61px, 19.55vw, 76.24px);
    letter-spacing: -0.09em;
    line-height: 1;
    text-align: left;
  }

  .names__first {
    gap: 0.31em;
  }

  .names__second {
    margin-top: 0;
    margin-left: 0.63em;
  }

  .intro {
    width: 226px;
    max-width: 68%;
    margin: 24px auto 0;
    font-size: 14px;
    line-height: 1;
  }

  .rsvp-button {
    margin-top: 24px;
    padding: 12px 28px;
    border-radius: 25px;
    font-size: 14px;
  }

  .artwork {
    display: none;
  }
}

@media (max-width: 420px), (max-height: 700px) and (max-width: 767px) {
  .names {
    font-size: clamp(58px, 19.55vw, 76.24px);
  }

  .intro {
    font-size: clamp(12px, 3.59vw, 14px);
  }
}

@media (hover: hover) and (pointer: fine) and (max-width: 767px) {
  .love-story__photo:hover:not(:active) {
    transform: scale(1.015);
  }

  .love-story__photo:hover:not(:active)::after {
    border-color: rgb(255 255 255 / 0.72);
    background: rgb(227 211 187 / 0.1);
    box-shadow: 0 8px 18px rgb(76 56 33 / 0.16);
    opacity: 1;
    transform: scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .rsvp-button,
  .love-story__overview,
  .love-story__photo,
  .story-reader {
    transition: none;
  }

  .love-story__photo img {
    transition: none;
  }

  .love-story__click-cue {
    animation: none;
  }

  .love-story__photo::after,
  .story-reader__flip-card,
  .story-reader__controls button {
    transition: none;
  }

  .love-story__photo:hover,
  .love-story__photo:focus-visible,
  .love-story__photo:active {
    transform: rotate(var(--rotation)) scale(1.025);
  }

  .love-story__photos:has(.love-story__photo:hover) .love-story__photo:not(:hover) {
    transform: rotate(var(--rotation)) scale(1);
  }
}

.event-details {
  position: relative;
  isolation: isolate;
  width: 100%;
  margin: 0;
  aspect-ratio: 5760 / 8456;
  overflow: hidden;
  background:
    url("Event Detail/Web Optimized/event-paper-texture-1440.webp") center top / 100% auto repeat-y,
    #d9d3b8;
}

.event-details__venue-media,
.event-details__paper-media {
  position: absolute;
  inset-inline: 0;
  display: block;
  width: 100%;
}

.event-details__venue-media {
  top: 14.78%;
  z-index: 0;
  height: 33.02%;
  overflow: hidden;
}

.event-details__venue-image {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center 48%;
}

.event-details__paper-media {
  inset-block: 0;
  z-index: 1;
  height: 100%;
  pointer-events: none;
}

.event-details__paper {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: contain;
}

.event-details__title,
.event-details__venue-copy,
.event-details__date-rail {
  position: absolute;
  z-index: 2;
}

.event-details__title {
  top: 3.9%;
  left: 9.375%;
  margin: 0;
  color: var(--wine);
  font-family: var(--display);
  font-size: 10.78vw;
  font-weight: 400;
  letter-spacing: -0.09em;
  line-height: 1;
  text-shadow: 0.556vw 0.556vw 1.736vw rgb(74 55 32 / 0.14);
}

.event-details__venue-copy {
  top: 54.4%;
  left: 9.375%;
  width: 56%;
  color: rgb(41 40 36 / 0.82);
}

.event-details__venue-copy h3 {
  margin: 0;
  color: var(--wine);
  font-family: var(--display);
  font-size: 7.15vw;
  font-weight: 400;
  letter-spacing: -0.065em;
  line-height: 0.96;
  text-shadow: 0.42vw 0.42vw 1.35vw rgb(74 55 32 / 0.12);
}

.event-details__time {
  margin: 2.15vw 0 0;
  font-family: var(--display);
  font-size: clamp(18px, 2.5vw, 36px);
  font-style: italic;
  line-height: 1.1;
}

.event-details__venue-copy address {
  max-width: 47vw;
  margin-top: 1.55vw;
  font-family: var(--body);
  font-size: clamp(13px, 1.55vw, 22px);
  font-style: normal;
  line-height: 1.38;
}

.event-details__map-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(36px, 3.45vw, 50px);
  margin-top: 2vw;
  padding: clamp(10px, 0.75vw, 11px) clamp(18px, 1.8vw, 26px);
  border: 1px solid rgb(117 8 14 / 0.28);
  border-radius: 999px;
  color: #ffffff;
  background: var(--wine);
  box-shadow: 0.42vw 0.42vw 1.2vw rgb(74 55 32 / 0.12);
  font-family: var(--body);
  font-size: clamp(12px, 1.25vw, 18px);
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  transition:
    color 180ms ease,
    background-color 180ms ease,
    transform 120ms ease;
}

.event-details__map-link:hover {
  color: var(--ink);
  background: #ffffff;
}

.event-details__map-link:active {
  transform: translateY(1px) scale(0.98);
}

.event-details__map-link:focus-visible {
  outline: 3px solid var(--ink);
  outline-offset: 4px;
}

.event-details__date-rail {
  top: 53.9%;
  left: 79.05%;
  width: 15.1%;
  color: var(--wine);
  text-align: center;
}

.event-details__date-rail p {
  margin: 0 0 1.8vw;
  color: rgb(41 40 36 / 0.72);
  font-family: var(--body);
  font-size: clamp(10px, 1.2vw, 17px);
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1;
}

.event-details__date-rail time {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: var(--display);
  font-size: 6.45vw;
  font-weight: 400;
  letter-spacing: -0.065em;
  line-height: 0.78;
  text-shadow: 0.42vw 0.42vw 1.35vw rgb(74 55 32 / 0.1);
}

.event-details__date-rail time span + span {
  margin-top: 1.5vw;
}

.event-details__date-rail .event-details__year {
  margin-top: 2.1vw;
  font-size: 4vw;
  letter-spacing: -0.045em;
}

@media (max-width: 767px) {
  .event-details {
    min-height: 760px;
    aspect-ratio: auto;
    overflow: hidden;
    background-size: auto 300px;
  }

  .event-details::after {
    content: "";
    position: absolute;
    top: 268px;
    bottom: 0;
    left: 74.52%;
    z-index: 1;
    width: 4px;
    background: var(--wine);
    box-shadow: 2px 0 8px rgb(74 55 32 / 0.14);
    pointer-events: none;
  }

  .event-details__venue-media {
    top: 88px;
    height: 194px;
  }

  .event-details__venue-image {
    object-position: center 50%;
  }

  .event-details__paper-media {
    inset-block: 0 auto;
    height: auto;
  }

  .event-details__paper {
    height: auto;
    object-fit: initial;
  }

  .event-details__title {
    top: 22px;
    left: 7.44%;
    font-size: clamp(47px, 14.4vw, 58px);
    letter-spacing: -0.075em;
    text-shadow: 4px 4px 14px rgb(74 55 32 / 0.14);
  }

  .event-details__venue-copy {
    top: 326px;
    left: 7.44%;
    width: 59.5%;
  }

  .event-details__venue-copy h3 {
    font-size: clamp(34px, 9.5vw, 39px);
    letter-spacing: -0.055em;
    line-height: 0.98;
    text-shadow: 3px 3px 12px rgb(74 55 32 / 0.1);
  }

  .event-details__time {
    margin-top: 22px;
    font-size: 18px;
    line-height: 1.1;
  }

  .event-details__venue-copy address {
    max-width: none;
    margin-top: 18px;
    font-size: 13px;
    line-height: 1.42;
  }

  .event-details__venue-copy address br {
    display: none;
  }

  .event-details__map-link {
    min-height: 38px;
    margin-top: 24px;
    padding: 11px 20px;
    font-size: 14px;
  }

  .event-details__date-rail {
    top: 326px;
    left: 78.1%;
    width: 18.5%;
  }

  .event-details__date-rail p {
    margin-bottom: 22px;
    font-size: 10px;
    letter-spacing: 0.02em;
  }

  .event-details__date-rail time {
    font-size: clamp(34px, 9.3vw, 38px);
    line-height: 0.8;
    text-shadow: 3px 3px 12px rgb(74 55 32 / 0.1);
  }

  .event-details__date-rail time span + span {
    margin-top: 18px;
  }

  .event-details__date-rail .event-details__year {
    margin-top: 24px;
    font-size: clamp(22px, 6vw, 25px);
  }
}

@media (max-width: 350px) {
  .event-details__venue-copy h3 {
    font-size: 31px;
  }

  .event-details__venue-copy address {
    font-size: 12px;
  }

  .event-details__date-rail {
    left: 78.4%;
    width: 18%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .event-details__map-link {
    transition: none;
  }
}

/* RSVP confirmation page */
.confirmation-page {
  min-height: 100%;
  background: #f8f1e7;
}

.rsvp-confirmation {
  position: relative;
  isolation: isolate;
  min-height: 100dvh;
  overflow: hidden;
  background: #dfe3e1;
}

.rsvp-confirmation__media {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
}

.rsvp-confirmation__photo {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center;
}

.rsvp-confirmation__photo--mobile {
  display: none;
}

.rsvp-confirmation__panel {
  position: relative;
  z-index: 1;
  width: min(836px, calc(100% - 64px));
  margin: clamp(54px, 12.39dvh, 86px) auto 0;
  padding: 31px 48px 35px;
  border: 0;
  border-radius: 26px;
  background: #f8f0e4;
  box-shadow: 9px 9px 8px rgb(24 24 22 / 0.42);
  translate: 18px 0;
}

.rsvp-confirmation__title {
  margin: 0;
  color: #8b080d;
  font-family: var(--display);
  font-size: 60px;
  font-weight: 400;
  letter-spacing: -0.075em;
  line-height: 0.96;
}

.rsvp-confirmation__message {
  max-width: 650px;
  margin: 22px 0 0;
  color: #4a4845;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.08;
}

.rsvp-confirmation__link {
  display: inline-flex;
  width: 232px;
  height: 42px;
  align-items: center;
  justify-content: center;
  margin-top: 22px;
  padding: 0 24px;
  border: 0;
  border-radius: 999px;
  color: #ffffff;
  background: #900008;
  font-size: 16px;
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  transition:
    color 180ms ease,
    background-color 180ms ease,
    transform 130ms ease;
}

.rsvp-confirmation__link:hover {
  color: #111111;
  background: #ffffff;
}

.rsvp-confirmation__link:active {
  transform: translateY(1px) scale(0.98);
}

.rsvp-confirmation__link:focus-visible {
  outline: 3px solid var(--wine);
  outline-offset: 4px;
}

.rsvp-confirmation__title:focus {
  outline: none;
}

@keyframes confirmation-panel-arrival {
  from {
    opacity: 0;
    transform: translate3d(0, 14px, 0) scale(0.99);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@media (prefers-reduced-motion: no-preference) {
  .rsvp-confirmation__panel {
    animation: confirmation-panel-arrival 560ms cubic-bezier(0.16, 1, 0.3, 1) 100ms backwards;
  }
}

@media (max-width: 767px) {
  .rsvp-confirmation__photo--desktop {
    display: none;
  }

  .rsvp-confirmation__photo--mobile {
    display: block;
  }

  .rsvp-confirmation__panel {
    width: min(374px, calc(100% - 16px));
    margin: clamp(84px, 15.15dvh, 106px) auto 0;
    padding: 29px 28px 28px;
    border-radius: 29px;
    text-align: center;
    box-shadow: 7px 8px 7px rgb(24 24 22 / 0.38);
    translate: none;
  }

  .rsvp-confirmation__title {
    font-size: clamp(36px, 9.75vw, 38px);
    line-height: 0.98;
  }

  .rsvp-confirmation__message {
    max-width: 290px;
    margin: 24px auto 0;
    font-size: 13px;
    line-height: 1.2;
  }

  .rsvp-confirmation__link {
    width: 202px;
    height: 38px;
    margin-top: 22px;
    padding: 0 18px;
    font-size: 15px;
    text-transform: capitalize;
  }
}

@media (prefers-reduced-transparency: reduce) {
  .rsvp-confirmation__panel {
    background: #f8f0e4;
  }
}

/* RSVP, FAQ, and Footer matched to the supplied 1440px desktop reference. */
.rsvp-section,
.faq-section,
.site-footer {
  container-type: inline-size;
  position: relative;
  isolation: isolate;
  width: 100%;
  min-height: 0;
  margin: 0;
  overflow: hidden;
}

.rsvp-section {
  height: 48.1944cqw;
  color: rgb(17 17 17 / 0.7);
  background: #d9d3b8;
}

.rsvp-section::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: url("RSVP Section/RSVP BG.png") top center / 100% auto no-repeat;
  opacity: 1;
  pointer-events: none;
}

.rsvp-section__red-line {
  position: absolute;
  top: 0;
  left: 74.7222cqw;
  z-index: 0;
  display: none;
  width: 1.1111cqw;
  height: 40cqw;
  background: url("Event Detail/event-red-line.png") center / 100% 100% no-repeat;
  pointer-events: none;
}

.rsvp-section__copy {
  position: absolute;
  top: 5.5556cqw;
  left: 9.375cqw;
  z-index: 2;
  width: 49.3056cqw;
}

.rsvp-section__deadline {
  margin: 0;
  color: rgb(17 17 17 / 0.72);
  font-family: var(--body);
  font-size: 1.9444cqw;
  font-weight: 400;
  line-height: 1;
}

.rsvp-section__deadline strong {
  font-weight: 800;
}

.rsvp-section__title {
  margin: 1.3889cqw 0 0;
  color: #85080d;
  font-family: var(--display);
  font-size: 6.5278cqw;
  font-weight: 400;
  letter-spacing: -0.085em;
  line-height: 0.88;
  text-shadow: 0.5556cqw 0.5556cqw 1.7361cqw rgb(0 0 0 / 0.2);
}

.rsvp-section__title span {
  display: block;
  white-space: nowrap;
}

.rsvp-section__body {
  width: 43.75cqw;
  margin-top: 1.25cqw;
  color: rgb(17 17 17 / 0.67);
  font-family: var(--body);
  font-size: 1.6667cqw;
  font-weight: 400;
  line-height: 1;
}

.rsvp-section__body p {
  margin: 0;
}

.rsvp-section__body p + p {
  margin-top: 2.3611cqw;
}

.rsvp-section__button,
.site-footer__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  min-width: 0;
  min-height: 0;
  padding: 12px 28px;
  border-radius: 25px;
  color: #ffffff;
  background: #99000a;
  font-family: var(--body);
  font-size: clamp(1.1rem, min(1.95vw, 3.15vh), 1.75rem);
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
  transition:
    color 160ms ease,
    background-color 160ms ease,
    transform 120ms ease;
}

.rsvp-section__button {
  margin-top: 2.6389cqw;
}

.rsvp-section__button:hover,
.site-footer__button:hover {
  color: #111111;
  background: #ffffff;
}

.rsvp-section__button:active,
.site-footer__button:active {
  transform: translateY(1px) scale(0.98);
}

.rsvp-section__button:focus-visible,
.site-footer__button:focus-visible {
  outline: 0.2083cqw solid #111111;
  outline-offset: 0.2778cqw;
}

.rsvp-section__portrait {
  position: absolute;
  top: 4.8611cqw;
  left: 55.2083cqw;
  z-index: 1;
  width: 26.7361cqw;
  height: 33.4201cqw;
  margin: 0;
  overflow: hidden;
  border-radius: 2.0833cqw;
  box-shadow: 0.5556cqw 0.5556cqw 1.0417cqw rgb(0 0 0 / 0.25);
  transform: rotate(8.6deg);
  transform-origin: center;
}

.rsvp-section__portrait img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center;
}

.faq-section {
  height: 68.3333cqw;
  color: #292824;
  background: #515f15 url("FAQ Section/FAQ BG.png") top center / 100% 100% no-repeat;
}

.site-footer__texture {
  position: absolute;
  top: -10%;
  left: -6%;
  z-index: -1;
  display: block;
  width: 112%;
  height: 120%;
  max-width: none;
  object-fit: cover;
  pointer-events: none;
}

.faq-section__title {
  position: absolute;
  top: 10.4167cqw;
  left: 9.375cqw;
  width: 25cqw;
  margin: 0;
  color: rgb(231 225 204 / 0.72);
  font-family: var(--display);
  font-size: 6.3889cqw;
  font-weight: 400;
  letter-spacing: -0.075em;
  line-height: 0.88;
  text-shadow: 0.5556cqw 0.5556cqw 1.7361cqw rgb(0 0 0 / 0.18);
}

.faq-section__title span {
  display: block;
  white-space: nowrap;
}

.faq-section__list {
  position: absolute;
  top: 9.7917cqw;
  left: 35.2778cqw;
  width: 48.4028cqw;
}

.faq-section__item {
  position: relative;
  box-sizing: border-box;
  min-height: 10.2778cqw;
  margin: 0;
  padding: 1.7361cqw 3.4722cqw 1.3194cqw;
  color: rgb(17 17 17 / 0.68);
  background: #f5ecdc;
  box-shadow: 0.5556cqw 0.5556cqw 0.6944cqw rgb(0 0 0 / 0.32);
  clip-path: polygon(0.9cqw 0, calc(100% - 0.9cqw) 0, 100% 0.9cqw, 100% calc(100% - 0.9cqw), calc(100% - 0.9cqw) 100%, 0.9cqw 100%, 0 calc(100% - 0.9cqw), 0 0.9cqw);
  transform: translateZ(0);
  transform-origin: center;
  transition:
    min-height 420ms cubic-bezier(0.16, 1, 0.3, 1),
    padding 420ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 320ms cubic-bezier(0.16, 1, 0.3, 1),
    background-color 280ms ease,
    box-shadow 320ms cubic-bezier(0.16, 1, 0.3, 1);
}

.faq-section__item + .faq-section__item {
  margin-top: 1.6204cqw;
}

.faq-section__item:nth-child(2),
.faq-section__item:nth-child(4) {
  left: 2.0833cqw;
}

.faq-section__item:nth-child(3) {
  left: 0.9722cqw;
}

.faq-section__item:nth-child(5) {
  left: 0.4861cqw;
}

.faq-section__item summary {
  position: relative;
  display: flex;
  min-height: 1.5278cqw;
  align-items: center;
  justify-content: space-between;
  gap: 1.3889cqw;
  margin: 0;
  color: rgb(117 8 14 / 0.7);
  font-family: var(--body);
  font-size: 1.6667cqw;
  font-weight: 800;
  line-height: 1;
  list-style: none;
  cursor: pointer;
}

.faq-section__item summary::-webkit-details-marker {
  display: none;
}

.faq-section__item summary::marker {
  content: "";
}

.faq-section__item summary i {
  flex: 0 0 1.9444cqw;
  width: 1.9444cqw;
  height: 1.9444cqw;
  border-radius: 50%;
  background: #9b0009;
  box-shadow: 0.2778cqw 0.2778cqw 0.5556cqw rgb(0 0 0 / 0.1);
  transition:
    transform 260ms cubic-bezier(0.16, 1, 0.3, 1),
    background-color 220ms ease,
    box-shadow 260ms ease;
}

.faq-section__item summary:focus-visible {
  outline: 0.2083cqw solid #75080e;
  outline-offset: 0.2778cqw;
}

.faq-section__answer {
  display: grid;
  grid-template-rows: 0fr;
  margin-top: 0;
  opacity: 0;
  transition:
    grid-template-rows 420ms cubic-bezier(0.16, 1, 0.3, 1),
    margin-top 420ms cubic-bezier(0.16, 1, 0.3, 1),
    opacity 220ms ease;
}

.faq-section__item[open] .faq-section__answer {
  grid-template-rows: 1fr;
  margin-top: 1.5278cqw;
  opacity: 1;
}

.faq-section__item p {
  min-height: 0;
  overflow: hidden;
  max-width: 36.1111cqw;
  margin: 0;
  font-family: var(--body);
  font-size: 1.25cqw;
  line-height: 1;
}

.faq-section__item:not([open]) {
  min-height: 5.5556cqw;
  padding-top: 1.8056cqw;
  padding-bottom: 1.8056cqw;
}

@media (hover: hover) and (pointer: fine) {
  .faq-section__item:hover {
    background: #f8f0e2;
    box-shadow: 0.6944cqw 0.8333cqw 1.1111cqw rgb(26 31 12 / 0.3);
    transform: translate3d(0, -0.2778cqw, 0) rotate(-0.08deg);
  }

  .faq-section__item:hover summary i {
    background: #a80812;
    box-shadow: 0.3472cqw 0.3472cqw 0.6944cqw rgb(0 0 0 / 0.13);
    transform: scale(1.08);
  }
}

.faq-section__item:active {
  transform: translate3d(0, -0.0694cqw, 0) scale(0.995);
}

.faq-section__item:active summary i {
  transform: scale(0.92);
}

.site-footer {
  height: 48.8889cqw;
  color: #292824;
  background: #515f15;
}

.site-footer__card {
  position: absolute;
  top: 0;
  left: 12.5cqw;
  z-index: 1;
  width: 75cqw;
  height: 40.4167cqw;
  overflow: hidden;
  border-radius: 1.3889cqw;
  box-shadow: 0.5556cqw 0.5556cqw 1.3889cqw rgb(0 0 0 / 0.28);
}

.site-footer__card > img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center;
}

.site-footer__message {
  position: absolute;
  top: 4.5833cqw;
  left: 0;
  width: 100%;
  text-align: center;
}

.site-footer__message h2 {
  margin: 0;
  color: #3f4d08;
  font-family: var(--display);
  font-size: 6.1111cqw;
  font-weight: 400;
  letter-spacing: -0.085em;
  line-height: 1;
  text-shadow: 0.5556cqw 0.5556cqw 1.7361cqw rgb(0 0 0 / 0.18);
  white-space: nowrap;
}

.site-footer__message p {
  margin: 2.0833cqw 0 0;
  color: rgb(17 17 17 / 0.67);
  font-family: var(--body);
  font-size: 1.9444cqw;
  line-height: 1;
}

.site-footer__button {
  margin-top: 2.4306cqw;
}

.site-footer__credits {
  position: absolute;
  right: 12.5cqw;
  bottom: 2.6389cqw;
  left: 12.5cqw;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: rgb(231 225 204 / 0.62);
  font-family: var(--display);
  font-size: 1.25cqw;
  line-height: 1;
}

.site-footer__credits p {
  margin: 0;
}

.site-footer__credits span {
  text-transform: none;
}

html.rsvp-dialog-open,
body.rsvp-dialog-open {
  overflow: hidden;
  overscroll-behavior: none;
}

body.rsvp-dialog-open {
  position: fixed;
  right: 0;
  left: 0;
  width: 100%;
}

.rsvp-dialog {
  container-type: inline-size;
  width: min(58.0556vw, 836px);
  max-width: calc(100vw - 64px);
  height: min(39.3056vw, 566px);
  max-height: calc(100dvh - 48px);
  margin: auto;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 26px;
  color: #474542;
  background: #f7eddf;
  box-shadow: 9px 9px 10px rgb(0 0 0 / 0.34);
  translate: 18px 22px;
}

.rsvp-dialog::backdrop {
  background: rgb(13 12 9 / 0.82);
}

.rsvp-dialog[open] {
  animation: rsvp-dialog-in 190ms cubic-bezier(0.2, 0.72, 0.24, 1) both;
}

.rsvp-dialog.is-declining {
  height: min(27.0833vw, 390px);
}

.rsvp-dialog[open]::backdrop {
  animation: rsvp-backdrop-in 160ms ease-out both;
}

.rsvp-dialog:focus-visible {
  outline: none;
}

.rsvp-dialog__form {
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  padding: 4.066cqw 5.742cqw 4.545cqw;
  overflow: hidden;
  font-family: var(--body);
}

.rsvp-dialog__form h2 {
  margin: 0;
  color: #85080d;
  font-family: var(--display);
  font-size: 4.3062cqw;
  font-weight: 400;
  letter-spacing: -0.07em;
  line-height: 1;
}

.rsvp-dialog__fields {
  display: grid;
  grid-template-columns: 31.0811% 1fr;
  gap: 15.2703%;
  min-height: 0;
  margin-top: 2.9904cqw;
  padding-right: 0.7177cqw;
  overflow-y: auto;
  scrollbar-gutter: stable;
}

.rsvp-dialog__identity {
  display: grid;
  align-content: start;
  gap: 2.8708cqw;
}

.rsvp-dialog__consent {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: start;
  gap: 1.0766cqw;
  color: #474542;
  font-size: 1.4354cqw;
  line-height: 1.3;
  cursor: pointer;
}

.rsvp-dialog__consent input {
  width: 1.6746cqw;
  height: 1.6746cqw;
  margin: 0.1196cqw 0 0;
  accent-color: #99000a;
}

.rsvp-dialog__consent small {
  display: block;
  margin-top: 0.4785cqw;
  color: rgb(71 69 66 / 0.7);
  font-size: 1.1962cqw;
}

.rsvp-dialog__consent input:focus-visible {
  outline: 2px solid #85080d;
  outline-offset: 2px;
}

.rsvp-dialog__attendance {
  display: grid;
  align-content: start;
}

.rsvp-dialog__field {
  display: grid;
  min-width: 0;
  margin: 0;
}

.rsvp-dialog__field > span,
.rsvp-dialog__joining legend,
.rsvp-dialog__guests legend {
  margin: 0;
  padding: 0;
  color: #474542;
  font-size: 2.1531cqw;
  font-weight: 800;
  line-height: 1.1;
}

.rsvp-dialog__field input,
.rsvp-dialog__field textarea,
.rsvp-dialog__field select {
  box-sizing: border-box;
  width: 100%;
  border: 0;
  border-bottom: 1px solid #b8b0a7;
  border-radius: 0;
  outline: none;
  color: #111111;
  background: transparent;
  font: inherit;
  font-size: 2.0335cqw;
  line-height: 1.2;
}

.rsvp-dialog__field input {
  height: 5.5024cqw;
  padding: 2.1531cqw 0 0.7177cqw;
}

.rsvp-dialog__field select {
  height: 5.5024cqw;
  padding: 1.3158cqw 2.8708cqw 0.7177cqw 0;
  cursor: pointer;
}

.rsvp-dialog__field > small {
  display: block;
  margin: 0.3589cqw 0 0;
  color: #474542;
  font-size: 1.4354cqw;
  font-weight: 400;
  line-height: 1.15;
}

.rsvp-dialog__limit-message {
  color: #85080d !important;
  font-weight: 700 !important;
}

.rsvp-dialog__limit-message[hidden] {
  display: none;
}

.rsvp-dialog__field input::placeholder,
.rsvp-dialog__field textarea::placeholder {
  color: rgb(71 69 66 / 0.38);
  opacity: 1;
}

.rsvp-dialog__field input:focus,
.rsvp-dialog__field textarea:focus,
.rsvp-dialog__field select:focus {
  border-bottom-color: #85080d;
  box-shadow: 0 1px 0 #85080d;
}

.rsvp-dialog__field input:user-invalid,
.rsvp-dialog__field textarea:user-invalid,
.rsvp-dialog__field select:user-invalid {
  border-bottom-color: #99000a;
}

.rsvp-dialog__joining,
.rsvp-dialog__guests {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.rsvp-dialog__radio-row {
  display: flex;
  gap: 1.0766cqw;
  margin-top: 1.1962cqw;
}

.rsvp-dialog__radio-row label {
  display: inline-flex;
  min-width: 0;
  height: 4.5455cqw;
  align-items: center;
  gap: 0.8373cqw;
  box-sizing: border-box;
  padding: 0 1.0766cqw;
  border: 1px solid #b8b0a7;
  border-radius: 999px;
  color: #111111;
  background: rgb(255 255 255 / 0.58);
  font-size: 2.0335cqw;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
}

.rsvp-dialog__radio-row input {
  width: 1.4354cqw;
  height: 1.4354cqw;
  margin: 0;
  accent-color: #99000a;
}

.rsvp-dialog__counts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.6746cqw;
  margin-top: 2.3923cqw;
}

.rsvp-dialog__counts input {
  padding-top: 1.6746cqw;
}

.rsvp-dialog__guests {
  margin-top: 2.7512cqw;
}

.rsvp-dialog__guests[hidden] {
  display: none;
}

.rsvp-dialog__attending-details[hidden] {
  display: none;
}

.rsvp-dialog__guests > p {
  margin: 0.3589cqw 0 0;
  color: #474542;
  font-size: 1.4354cqw;
  font-weight: 400;
  line-height: 1.15;
}

.rsvp-dialog__guest-list {
  display: grid;
  gap: 2.1531cqw;
  margin-top: 1.7943cqw;
}

.rsvp-dialog__guest-row {
  display: grid;
  gap: 0.8373cqw;
}

.rsvp-dialog__guest-row + .rsvp-dialog__guest-row {
  padding-top: 1.6746cqw;
  border-top: 1px solid rgb(71 69 66 / 0.2);
}

.rsvp-dialog__guest-row > p {
  margin: 0;
  color: #85080d;
  font-size: 1.555cqw;
  font-weight: 800;
  line-height: 1.1;
}

.rsvp-dialog__guest-row > div {
  display: grid;
  grid-template-columns: 1fr 1.035fr;
  gap: 1.6746cqw;
}

.rsvp-dialog__field textarea {
  height: 8.9713cqw;
  min-height: 0;
  padding: 0.9569cqw 0;
  resize: none;
}

.rsvp-dialog__actions {
  display: flex;
  align-items: center;
  gap: 2.3923cqw;
  margin-top: 3.11cqw;
}

.rsvp-dialog__submit {
  position: static;
  display: inline-flex;
  min-width: 20.0957cqw;
  min-height: 4.9043cqw;
  align-items: center;
  justify-content: center;
  padding: 1.1962cqw 2.6316cqw;
  border: 0;
  border-radius: 999px;
  color: #ffffff;
  background: #99000a;
  font-family: var(--body);
  font-size: 1.9139cqw;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
  transition:
    color 160ms ease,
    background-color 160ms ease,
    transform 120ms ease;
}

.rsvp-dialog__submit:hover {
  color: #111111;
  background: #ffffff;
}

.rsvp-dialog__submit:active {
  transform: translateY(1px) scale(0.98);
}

.rsvp-dialog__submit:disabled {
  cursor: wait;
  opacity: 0.64;
  transform: none;
}

.rsvp-dialog__submit:focus-visible,
.rsvp-dialog__radio-row input:focus-visible {
  outline: 2px solid #85080d;
  outline-offset: 3px;
}

.rsvp-dialog__status {
  position: static;
  flex: 1;
  max-width: 46cqw;
  margin: 0;
  color: #85080d;
  font-size: 1.4354cqw;
  font-weight: 700;
  text-align: right;
}

@keyframes rsvp-dialog-in {
  from {
    opacity: 0;
    transform: translateY(10px) scale(0.985);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes rsvp-backdrop-in {
  from { background: rgb(13 12 9 / 0); }
  to { background: rgb(13 12 9 / 0.82); }
}

@media (max-width: 767px) {
  .rsvp-section {
    height: 193.5897cqw;
  }

  .rsvp-section::before {
    background: url("RSVP Section/RSVP BG Mobile.png") top center / 100% auto no-repeat;
    opacity: 1;
  }

  .rsvp-section__red-line {
    display: none;
  }

  .rsvp-section__copy {
    top: 103.3333cqw;
    left: 7.6923cqw;
    width: 84.6154cqw;
    text-align: center;
  }

  .rsvp-section__deadline {
    font-size: 3.5897cqw;
  }

  .rsvp-section__title {
    margin-top: 4.1026cqw;
    font-size: 16.4103cqw;
    line-height: 0.8;
  }

  .rsvp-section__body {
    width: 76.9231cqw;
    margin-top: 7.1795cqw;
    margin-right: auto;
    margin-left: auto;
    font-size: 3.3333cqw;
    line-height: 1.12;
  }

  .rsvp-section__desktop-break {
    display: none;
  }

  .rsvp-section__body p + p {
    margin-top: 1.5385cqw;
  }

  .rsvp-section__button {
    margin-top: 6.1538cqw;
    padding: 12px 28px;
    border-radius: 25px;
    font-size: 14px;
  }

  .rsvp-section__portrait {
    top: 3.45cqw;
    left: 20.2564cqw;
    width: 60cqw;
    height: 75cqw;
    border-radius: 5.1282cqw;
    box-shadow: 2.0513cqw 2.0513cqw 4.1026cqw rgb(0 0 0 / 0.24);
    transform: rotate(7deg);
  }

  .faq-section {
    height: auto;
    min-height: 218.2051cqw;
    padding: 29.2308cqw 2.5641cqw 4.1026cqw;
    background-image: url("FAQ Section/FAQ BG mobile.png");
  }

  .site-footer__texture {
    top: -5%;
    left: -40%;
    width: 180%;
    height: 110%;
  }

  .faq-section__title {
    position: relative;
    top: auto;
    left: auto;
    width: calc(100% - 12.3077cqw);
    margin-left: 7.1795cqw;
    font-size: 15.3846cqw;
    line-height: 0.84;
  }

  .faq-section__title span {
    display: inline;
    white-space: normal;
  }

  .faq-section__list {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    margin-top: 7.6923cqw;
  }

  .faq-section__item {
    min-height: 26.7568cqw;
    padding: 3.0769cqw 6.1538cqw 2.5641cqw;
    box-shadow: 2.0513cqw 2.0513cqw 2.5641cqw rgb(0 0 0 / 0.28);
    clip-path: polygon(3.0769cqw 0, calc(100% - 3.0769cqw) 0, 100% 3.0769cqw, 100% calc(100% - 3.0769cqw), calc(100% - 3.0769cqw) 100%, 3.0769cqw 100%, 0 calc(100% - 3.0769cqw), 0 3.0769cqw);
  }

  .faq-section__item + .faq-section__item {
    margin-top: 5.1282cqw;
  }

  .faq-section__item:nth-child(n) {
    left: 0;
  }

  .faq-section__item summary {
    min-height: 4.1026cqw;
    gap: 4.1026cqw;
    font-size: 3.8462cqw;
    line-height: 1.15;
  }

  .faq-section__item summary i {
    flex-basis: 6.1538cqw;
    width: 6.1538cqw;
    height: 6.1538cqw;
    box-shadow: 1.0256cqw 1.0256cqw 2.0513cqw rgb(0 0 0 / 0.1);
  }

  .faq-section__item p {
    max-width: 78.9744cqw;
    font-size: 3.3333cqw;
    line-height: 1.15;
  }

  .faq-section__item[open] .faq-section__answer {
    margin-top: 1.5385cqw;
  }

  .faq-section__item:not([open]) {
    padding-top: 4.1026cqw;
    padding-bottom: 4.1026cqw;
  }

  .site-footer {
    height: 117.6923cqw;
  }

  .site-footer__card {
    top: 8.2051cqw;
    left: 2.5641cqw;
    width: 94.8718cqw;
    height: 94.8718cqw;
    border-radius: 5.1282cqw;
    box-shadow: 2.0513cqw 2.0513cqw 5.1282cqw rgb(0 0 0 / 0.26);
  }

  .site-footer__card > img {
    object-fit: contain;
    object-position: center bottom;
    background: #afadae;
  }

  .site-footer__message {
    top: 6.4103cqw;
  }

  .site-footer__message h2 {
    width: 61.5385cqw;
    margin-right: auto;
    margin-left: auto;
    font-size: 13.3333cqw;
    letter-spacing: -0.075em;
    line-height: 1;
    white-space: normal;
  }

  .site-footer__message p {
    margin-top: 7.6923cqw;
    font-size: 3.3333cqw;
  }

  .site-footer__button {
    margin-top: 5.641cqw;
    padding: 12px 28px;
    border-radius: 25px;
    font-size: 14px;
  }

  .site-footer__credits {
    right: 0;
    bottom: 2.5641cqw;
    left: 0;
    justify-content: center;
    font-size: 2.5641cqw;
  }

  .site-footer__credits p:first-child {
    display: none;
  }

  .site-footer__credits p:last-child {
    max-width: none;
    text-align: center;
  }

  .rsvp-dialog {
    width: calc(100vw - 24px);
    max-width: none;
    height: auto;
    max-height: calc(100dvh - 24px);
    overflow: hidden;
    border-radius: 18px;
    translate: 0 0;
  }

  .rsvp-dialog.is-declining {
    height: fit-content;
    min-height: 0;
  }

  .rsvp-dialog.is-declining .rsvp-dialog__form {
    min-height: 0;
  }

  .rsvp-dialog__form {
    height: auto;
    min-height: 100%;
    max-height: calc(100dvh - 24px);
    padding: 24px 22px 28px;
    overflow: hidden;
  }

  .rsvp-dialog__form h2 {
    font-size: clamp(30px, 9vw, 38px);
  }

  .rsvp-dialog__fields {
    grid-template-columns: 1fr;
    gap: 24px;
    margin-top: 24px;
    padding-right: 6px;
    overflow-y: auto;
  }

  .rsvp-dialog__identity {
    gap: 18px;
  }

  .rsvp-dialog__field > span,
  .rsvp-dialog__joining legend,
  .rsvp-dialog__guests legend {
    font-size: 16px;
  }

  .rsvp-dialog__field input,
  .rsvp-dialog__field textarea,
  .rsvp-dialog__field select {
    font-size: 16px;
  }

  .rsvp-dialog__field input {
    height: 44px;
    padding: 14px 0 6px;
  }

  .rsvp-dialog__field select {
    height: 44px;
    padding: 12px 30px 6px 0;
  }

  .rsvp-dialog__field > small {
    margin-top: 4px;
    font-size: 12px;
  }

  .rsvp-dialog__radio-row {
    display: grid;
    gap: 8px;
    margin-top: 10px;
  }

  .rsvp-dialog__radio-row label {
    width: fit-content;
    height: 38px;
    gap: 8px;
    padding: 0 12px;
    font-size: 15px;
  }

  .rsvp-dialog__radio-row input {
    width: 14px;
    height: 14px;
  }

  .rsvp-dialog__consent {
    gap: 10px;
    font-size: 12px;
  }

  .rsvp-dialog__consent input {
    width: 17px;
    height: 17px;
    margin-top: 1px;
  }

  .rsvp-dialog__consent small {
    margin-top: 4px;
    font-size: 11px;
  }

  .rsvp-dialog__counts {
    gap: 14px;
    margin-top: 18px;
  }

  .rsvp-dialog__counts {
    margin-top: 20px;
  }

  .rsvp-dialog__guests {
    margin-top: 22px;
  }

  .rsvp-dialog__guests > p {
    margin-top: 4px;
    font-size: 12px;
  }

  .rsvp-dialog__guest-list {
    gap: 18px;
    margin-top: 14px;
  }

  .rsvp-dialog__guest-row {
    gap: 10px;
  }

  .rsvp-dialog__guest-row + .rsvp-dialog__guest-row {
    padding-top: 18px;
  }

  .rsvp-dialog__guest-row > p {
    font-size: 14px;
  }

  .rsvp-dialog__guest-row > div {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .rsvp-dialog__field textarea {
    height: 72px;
    padding: 8px 0;
  }

  .rsvp-dialog__actions {
    display: grid;
    gap: 0;
    margin-top: 26px;
  }

  .rsvp-dialog__submit {
    width: 100%;
    min-width: 0;
    min-height: 42px;
    margin-top: 0;
    padding: 12px 24px;
    font-size: 16px;
  }

  .rsvp-dialog__status {
    flex: none;
    max-width: none;
    margin-top: 12px;
    font-size: 12px;
    text-align: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .faq-section__item,
  .faq-section__answer,
  .faq-section__item summary i,
  .rsvp-section__button,
  .site-footer__button,
  .rsvp-dialog,
  .rsvp-dialog::backdrop,
  .rsvp-dialog__submit {
    animation: none;
    transition: none;
  }
}

/* Figma-matched Event Details, desktop node 74:114 and mobile node 84:2. */
.event-details {
  container-type: inline-size;
  position: relative;
  isolation: isolate;
  width: 100%;
  height: 146.8056cqw;
  min-height: 0;
  margin: 0;
  aspect-ratio: auto;
  overflow: hidden;
  color: #111111;
  background:
    url("Event Detail/Web Optimized/event-paper-texture-1440.webp") center top / 100% auto repeat-y,
    #d9d3b8;
}

.event-details__venue-media,
.event-details__paper-media {
  position: absolute;
  display: block;
  width: 100%;
}

.event-details__venue-media {
  top: 22.9167cqw;
  right: 0;
  left: 0;
  z-index: 0;
  height: 48.4722cqw;
  overflow: hidden;
}

.event-details__venue-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, transparent 43.84%, rgb(0 0 0 / 0.2));
  pointer-events: none;
}

.event-details__venue-image {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center;
}

.event-details__paper-media {
  inset: 0;
  z-index: 1;
  height: 100%;
  pointer-events: none;
}

.event-details__paper {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: fill;
}

.event-details__paper-edge,
.event-details__red-line {
  display: none;
}

.event-details__heading,
.event-details__venue-copy,
.event-details__schedule,
.event-details__dress-code {
  position: absolute;
  z-index: 2;
}

.event-details__heading {
  inset: 0;
  pointer-events: none;
}

.event-details__title {
  position: absolute;
  top: 9.0278cqw;
  left: 9.375cqw;
  display: block;
  width: auto;
  margin: 0;
  color: var(--wine);
  font-family: var(--display);
  font-size: 6.6633cqw;
  font-weight: 400;
  letter-spacing: -0.09em;
  line-height: 1;
  white-space: nowrap;
  text-shadow: 0.5556cqw 0.5556cqw 1.7361cqw rgb(0 0 0 / 0.25);
}

.event-details__title span {
  position: static;
}

.event-details__intro {
  position: absolute;
  top: 17.3611cqw;
  left: 14.2361cqw;
  width: 60cqw;
  margin: 0;
  color: rgb(0 0 0 / 0.7);
  font-family: var(--body);
  font-size: 1.9444cqw;
  font-weight: 400;
  line-height: 1;
  text-shadow: 0.5556cqw 0.5556cqw 1.7361cqw rgb(0 0 0 / 0.2);
}

.event-details__venue-copy {
  top: 47.1528cqw;
  left: 14.2361cqw;
  width: 30.2778cqw;
  color: #ffffff;
  text-shadow: 0.5556cqw 0.5556cqw 1.7361cqw rgb(0 0 0 / 0.25);
}

.event-details__venue-copy h3 {
  margin: 0;
  color: #ffffff;
  font-family: var(--display);
  font-size: 1.9444cqw;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1;
  text-shadow: inherit;
}

.event-details__venue-copy address {
  max-width: none;
  margin: 1.6667cqw 0 0;
  color: rgb(255 255 255 / 0.7);
  font-family: var(--body);
  font-size: 1.3889cqw;
  font-style: normal;
  line-height: 1;
  text-shadow: inherit;
}

.event-details__map-actions {
  display: flex;
  align-items: flex-start;
  gap: 1.6667cqw;
  margin-top: 1.6667cqw;
}

.event-details__map-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.8333cqw;
  min-height: 2.8472cqw;
  margin: 0;
  padding: 0.5556cqw;
  border: 0;
  border-radius: 0.5556cqw;
  color: #ffffff;
  background: rgb(234 220 200 / 0.2);
  box-shadow: none;
  font-family: var(--body);
  font-size: 0.9722cqw;
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
  text-shadow: inherit;
  white-space: nowrap;
  transition:
    background-color 150ms ease,
    transform 120ms ease;
}

.event-details__map-link img {
  display: block;
  width: 1.7361cqw;
  height: 1.7361cqw;
  object-fit: contain;
}

.event-details__map-link:hover {
  color: #ffffff;
  background: rgb(234 220 200 / 0.34);
}

.event-details__map-link:focus-visible {
  outline: 0.1389cqw solid #ffffff;
  outline-offset: 0.2083cqw;
}

.event-details__map-link:active {
  transform: scale(0.98);
}

.event-details__schedule {
  top: 73.0556cqw;
  left: 14.2361cqw;
  width: 34.0278cqw;
}

.event-details__date {
  margin: 0;
  color: rgb(17 17 17 / 0.7);
  font-family: var(--body);
  font-size: 1.9444cqw;
  font-weight: 400;
  line-height: 1;
  text-shadow: 0.5556cqw 0.5556cqw 1.7361cqw rgb(0 0 0 / 0.2);
}

.event-details__schedule h3 {
  margin: 0.8333cqw 0 0 -4.8611cqw;
  color: var(--wine);
  font-family: var(--display);
  font-size: 4.1182cqw;
  font-weight: 400;
  letter-spacing: -0.09em;
  line-height: 1;
  text-shadow: 0.5556cqw 0.5556cqw 1.7361cqw rgb(0 0 0 / 0.25);
}

.event-details__timetable {
  width: 100%;
  margin: 4.4444cqw 0 0 0.5556cqw;
  padding: 0;
  list-style: none;
}

.event-details__timetable li {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  margin: 0;
  padding: 0 0 1.6667cqw;
  border-bottom: 0.0694cqw solid rgb(17 17 17 / 0.78);
}

.event-details__timetable li + li {
  margin-top: 1.6667cqw;
}

.event-details__timetable li:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.event-details__timetable time {
  font-family: var(--display);
  font-size: 1.9444cqw;
  font-weight: 700;
  line-height: 1;
  text-shadow: 0.5556cqw 0.5556cqw 1.7361cqw rgb(0 0 0 / 0.2);
}

.event-details__timetable span {
  margin-top: 1.6667cqw;
  color: rgb(17 17 17 / 0.7);
  font-family: var(--body);
  font-size: 1.6667cqw;
  font-weight: 400;
  line-height: 1;
  text-shadow: 0.5556cqw 0.5556cqw 1.7361cqw rgb(0 0 0 / 0.2);
}

.event-details__dress-code {
  top: 100.9722cqw;
  left: 55.8333cqw;
  width: 26.5278cqw;
  min-height: 33.2639cqw;
  padding: 1.9444cqw 1.25cqw;
  border: 8px solid rgb(215 207 184 / 0.1);
  border-radius: 1.7361cqw;
  background: rgb(255 255 255 / 0.1);
  box-shadow: 8px 8px 5px rgb(0 0 0 / 0.25);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  transform: rotate(-5.05deg);
  transform-origin: center;
}

.event-details__dress-code h3 {
  margin: 0;
  color: var(--wine);
  font-family: var(--display);
  font-size: 2.5451cqw;
  font-weight: 400;
  letter-spacing: -0.09em;
  line-height: 1;
  text-shadow: 0.5556cqw 0.5556cqw 1.7361cqw rgb(0 0 0 / 0.2);
}

.event-details__dress-code > p {
  margin: 1.6667cqw 0 0;
  color: rgb(0 0 0 / 0.7);
  font-family: var(--body);
  font-size: 1.13cqw;
  line-height: 1;
  text-shadow: 0.5556cqw 0.5556cqw 1.7361cqw rgb(0 0 0 / 0.18);
  white-space: nowrap;
}

.event-details__dress-code ul {
  display: flex;
  flex-direction: column;
  gap: 1.55cqw;
  margin: 1.6667cqw 0 0;
  padding: 0;
  list-style: none;
}

.event-details__dress-code li {
  display: flex;
  align-items: center;
  gap: 1.6667cqw;
  min-height: 4.1667cqw;
}

.event-details__palette-swatch {
  position: relative;
  flex: 0 0 4.1667cqw;
  width: 4.1667cqw;
  height: 4.1667cqw;
}

.event-details__palette-swatch img {
  position: absolute;
  top: -0.4861cqw;
  left: -0.4861cqw;
  display: block;
  width: 6.25cqw;
  height: 6.25cqw;
  max-width: none;
}

.event-details__palette-swatch--earth {
  flex-basis: 9.5833cqw;
  width: 9.5833cqw;
}

.event-details__palette-swatch--earth img {
  width: 11.6667cqw;
}

.event-details__dress-code strong,
.event-details__dress-code em {
  color: rgb(0 0 0 / 0.7);
  font-family: var(--body);
  font-size: 1.2017cqw;
  line-height: 1;
  text-shadow: 0.5556cqw 0.5556cqw 1.7361cqw rgb(0 0 0 / 0.18);
  white-space: nowrap;
}

.event-details__dress-code strong {
  font-weight: 800;
}

.event-details__dress-code em {
  font-weight: 400;
}

@media (max-width: 767px) {
  .event-details {
    height: 496cqw;
    min-height: 0;
    background: #d9d3b8 url("Event Detail/Web Optimized/event-details-bg-mobile-1170.webp") center top / 100% 100% no-repeat;
  }

  .event-details::after {
    content: none;
    display: none;
  }

  .event-details__venue-media {
    display: none;
  }

  .event-details__venue-media::after {
    background: linear-gradient(to bottom, transparent 38%, rgb(0 0 0 / 0.34));
  }

  .event-details__venue-image {
    object-position: 47% center;
  }

  .event-details__paper-media {
    display: none;
  }

  .event-details__paper-edge {
    display: none;
  }

  .event-details__title {
    top: 9.7436cqw;
    left: 7.4359cqw;
    width: 90cqw;
    height: 43.5897cqw;
    font-size: 12.0513cqw;
    letter-spacing: -0.075em;
    white-space: normal;
    text-shadow: 2.0513cqw 2.0513cqw 6.4103cqw rgb(0 0 0 / 0.25);
  }

  .event-details__title span {
    position: absolute;
    display: block;
  }

  .event-details__title-the {
    top: 0;
    left: 0;
  }

  .event-details__title-wedding {
    top: 12.0513cqw;
    left: 0;
    font-size: 19.4872cqw;
  }

  .event-details__title-details {
    top: 31.5385cqw;
    left: 58.4615cqw;
  }

  .event-details__intro {
    top: 59.4872cqw;
    left: 14.359cqw;
    width: 71.2821cqw;
    font-size: 3.5897cqw;
    line-height: 1;
    text-align: center;
    text-shadow: 2.0513cqw 2.0513cqw 6.4103cqw rgb(0 0 0 / 0.18);
  }

  .event-details__venue-copy {
    top: 129.4872cqw;
    left: 7.4359cqw;
    width: 80.7692cqw;
    text-shadow: 2.0513cqw 2.0513cqw 6.4103cqw rgb(0 0 0 / 0.34);
  }

  .event-details__venue-copy h3 {
    font-size: 5.8974cqw;
  }

  .event-details__venue-copy address {
    width: 80.7692cqw;
    margin-top: 3.0769cqw;
    font-size: 3.0769cqw;
    line-height: 1;
  }

  .event-details__map-actions {
    flex-direction: column;
    gap: 3.0769cqw;
    margin-top: 3.0769cqw;
  }

  .event-details__map-link {
    gap: 3.0769cqw;
    min-height: 9.2308cqw;
    padding: 2.0513cqw;
    border-radius: 2.0513cqw;
    font-size: 2.5641cqw;
  }

  .event-details__map-link img {
    width: 5.1282cqw;
    height: 5.1282cqw;
  }

  .event-details__schedule {
    top: 209.4872cqw;
    left: 0;
    width: 100%;
    text-align: center;
  }

  .event-details__date {
    font-size: 3.5897cqw;
    text-align: center;
    text-shadow: 2.0513cqw 2.0513cqw 6.4103cqw rgb(0 0 0 / 0.18);
  }

  .event-details__schedule h3 {
    margin: 2.5641cqw 0 0;
    font-size: 15.2051cqw;
    text-align: center;
    text-shadow: 2.0513cqw 2.0513cqw 6.4103cqw rgb(0 0 0 / 0.22);
  }

  .event-details__timetable {
    width: 62.8205cqw;
    margin: 3.0769cqw auto 0;
  }

  .event-details__timetable li {
    align-items: center;
    min-height: 16.4103cqw;
    padding: 0 0 3.0769cqw;
    border-bottom-width: 0.2564cqw;
    text-align: center;
  }

  .event-details__timetable li + li {
    margin-top: 8cqw;
  }

  .event-details__timetable time {
    font-size: 5.1282cqw;
    text-shadow: 2.0513cqw 2.0513cqw 6.4103cqw rgb(0 0 0 / 0.18);
  }

  .event-details__timetable span {
    margin-top: 3.0769cqw;
    font-size: 5.1282cqw;
    text-shadow: 2.0513cqw 2.0513cqw 6.4103cqw rgb(0 0 0 / 0.16);
  }

  .event-details__desktop-only {
    display: none !important;
  }

  .event-details__red-line {
    position: absolute;
    top: 378.4615cqw;
    left: 70.7692cqw;
    z-index: 2;
    display: block;
    width: 1.0256cqw;
    height: 121.0256cqw;
    background: url("Event Detail/event-red-line.png") center / 100% 100% no-repeat;
    pointer-events: none;
  }

  .event-details__dress-code {
    top: 396.6026cqw;
    left: 11.7692cqw;
    width: 76.4615cqw;
    min-height: 95.8718cqw;
    padding: 4.8077cqw 4.2308cqw;
    border-width: 8px;
    border-radius: 6.4103cqw;
    box-shadow: 8px 8px 5px rgb(0 0 0 / 0.25);
    backdrop-filter: blur(100px);
    -webkit-backdrop-filter: blur(100px);
  }

  .event-details__dress-code h3 {
    font-size: 7.6923cqw;
    text-shadow: 2.0513cqw 2.0513cqw 6.4103cqw rgb(0 0 0 / 0.18);
  }

  .event-details__dress-code > p {
    margin-top: 3.8462cqw;
    font-size: 3.0769cqw;
    text-shadow: 2.0513cqw 2.0513cqw 6.4103cqw rgb(0 0 0 / 0.14);
  }

  .event-details__dress-code ul {
    gap: 3.3333cqw;
    margin-top: 4.359cqw;
  }

  .event-details__dress-code li {
    gap: 3.8462cqw;
    min-height: 10.2564cqw;
  }

  .event-details__palette-swatch {
    flex-basis: 10.2564cqw;
    width: 10.2564cqw;
    height: 10.2564cqw;
  }

  .event-details__palette-swatch img {
    top: -1.1538cqw;
    left: -1.1538cqw;
    width: 15.3846cqw;
    height: 15.3846cqw;
  }

  .event-details__palette-swatch--earth {
    flex-basis: 23.8462cqw;
    width: 23.8462cqw;
  }

  .event-details__palette-swatch--earth img {
    width: 28.9744cqw;
  }

  .event-details__dress-code strong,
  .event-details__dress-code em {
    font-size: 3.3333cqw;
    text-shadow: 2.0513cqw 2.0513cqw 6.4103cqw rgb(0 0 0 / 0.14);
  }
}

@media (max-width: 350px) {
  .event-details__map-link {
    font-size: 2.4cqw;
  }
}

@media (prefers-reduced-motion: reduce) {
  .event-details__map-link {
    transition: none;
  }
}