:root {
  --ivory: #f5efe6;
  --warm-white: #faf8f3;
  --sage: #9caf88;
  --olive: #59654c;
  --gold: #c9a769;
  --gold-deep: #a98b51;
  --charcoal: #2b2b2b;
  --deep: #22291f;
  --paper-shadow: 0 32px 90px rgba(40, 47, 36, 0.19);
  --display: "Bodoni Moda", Didot, serif;
  --script: "Italianno", "Snell Roundhand", cursive;
  --body: "Lora", Georgia, serif;
  --utility: "Jost", sans-serif;
  --ease-out: cubic-bezier(.22, .8, .24, 1);
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }

html {
  min-width: 320px;
  background: var(--warm-white);
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-width: 320px;
  color: var(--charcoal);
  background: var(--warm-white);
  font-family: var(--body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

body.is-intro-locked { overflow: hidden; }
button, a { -webkit-tap-highlight-color: transparent; }
button, input { font: inherit; }
a { color: inherit; }

:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: 4px;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.no-js .envelope-intro { display: none; }

.envelope-intro {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: grid;
  place-items: center;
  padding: max(18px, env(safe-area-inset-top)) 20px max(18px, env(safe-area-inset-bottom));
  overflow: hidden;
  color: var(--olive);
  background:
    radial-gradient(ellipse at 50% 46%, rgba(255, 255, 255, .92) 0 16%, transparent 58%),
    linear-gradient(145deg, #fbfaf6 0%, #f6f1e9 48%, #efe8dc 100%);
  isolation: isolate;
  perspective: 1200px;
  transition: opacity .75s var(--ease-out), visibility .75s;
}

.envelope-intro::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  background:
    linear-gradient(102deg, transparent 0 49.7%, rgba(89, 101, 76, .035) 50%, transparent 50.3%),
    radial-gradient(circle at 18% 82%, rgba(156, 175, 136, .11), transparent 22rem);
}

.intro-grain {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: .14;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.12'/%3E%3C/svg%3E");
  mix-blend-mode: multiply;
}

.intro-botanical {
  position: absolute;
  z-index: 0;
  width: clamp(240px, 38vw, 520px);
  height: auto;
  opacity: 0;
  pointer-events: none;
  user-select: none;
  animation: botanical-arrival 1.5s .05s var(--ease-out) both;
}

.intro-botanical--left {
  top: clamp(-112px, -7vw, -54px);
  left: clamp(-126px, -7vw, -64px);
  --botanical-x: -28px;
}

.intro-botanical--right {
  top: clamp(-88px, -5vw, -36px);
  right: clamp(-116px, -6vw, -52px);
  width: clamp(230px, 35vw, 480px);
  animation-delay: .18s;
  --botanical-x: 28px;
}

.envelope-stage {
  position: relative;
  z-index: 2;
  width: min(100%, 560px);
  text-align: center;
}

.eyebrow,
.intro-date,
.open-hint,
.hero-edition,
.hero-kicker,
.scroll-cue {
  font-family: var(--utility);
  text-transform: uppercase;
  letter-spacing: .24em;
}

.eyebrow {
  position: relative;
  z-index: 3;
  margin: 0;
  color: rgba(89, 101, 76, .76);
  font-size: clamp(.55rem, 1.8vw, .67rem);
  font-weight: 500;
  letter-spacing: .28em;
  animation: intro-copy-arrival .8s .18s var(--ease-out) both;
}

.intro-title {
  position: relative;
  z-index: 3;
  margin: clamp(4px, 1vh, 11px) 0 clamp(8px, 1.7vh, 17px);
  padding-right: .08em;
  color: #687558;
  font: 400 clamp(4.25rem, 21vw, 9.5rem)/.78 var(--script);
  letter-spacing: -.015em;
  text-wrap: balance;
  text-shadow: 0 2px 12px rgba(89, 101, 76, .08);
  animation: title-arrival 1.1s .26s var(--ease-out) both;
}

.intro-sprig {
  position: absolute;
  z-index: 3;
  top: clamp(85px, 12vw, 126px);
  right: clamp(-42px, -4vw, -16px);
  width: clamp(104px, 25vw, 165px);
  height: auto;
  opacity: 0;
  pointer-events: none;
  transform-origin: 50% 100%;
  user-select: none;
  animation: sprig-arrival 1.15s .68s var(--ease-out) both;
}

.envelope {
  position: relative;
  z-index: 2;
  width: min(80vw, 410px);
  aspect-ratio: 1.47;
  margin: 0 auto;
  padding: 0;
  border: 0;
  color: inherit;
  background: transparent;
  cursor: pointer;
  isolation: isolate;
  filter: drop-shadow(0 28px 24px rgba(49, 55, 45, .24));
  transform-style: preserve-3d;
  animation: envelope-arrival 1.15s .52s var(--ease-out) both;
}

.envelope:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: 12px;
  border-radius: 4px;
}

.envelope__back,
.envelope__letter,
.envelope__flap,
.envelope__pocket,
.envelope__seal { position: absolute; }

.envelope__back {
  inset: 0;
  z-index: 0;
  border: 1px solid rgba(89, 101, 76, .32);
  border-radius: 2px;
  background: #849676;
}

.envelope__letter {
  z-index: 1;
  left: 6%;
  right: 6%;
  top: 5%;
  height: 82%;
  display: grid;
  place-content: center;
  gap: 16px;
  border: 1px solid rgba(201, 167, 105, .38);
  color: var(--olive);
  background:
    linear-gradient(rgba(255,255,255,.2), rgba(255,255,255,0)),
    #fbf7ef;
  box-shadow: 0 4px 12px rgba(43, 43, 43, .08);
  transition: transform 1s .34s var(--ease-out);
}

.letter-monogram {
  font: 400 clamp(2.55rem, 11vw, 4rem)/.8 var(--script);
}

.letter-monogram span { color: var(--gold); }
.letter-date { font: 500 .58rem/1 var(--utility); letter-spacing: .23em; text-transform: uppercase; }

.envelope__flap {
  z-index: 4;
  inset: 0;
  border-top: 1px solid rgba(89, 101, 76, .25);
  background: linear-gradient(165deg, #aebf9f, #8fa27f);
  clip-path: polygon(0 0, 50% 65%, 100% 0);
  transform-origin: top;
  transform: rotateX(0deg);
  backface-visibility: hidden;
  transition: transform .82s var(--ease-out), z-index 0s .42s;
}

.envelope__pocket { z-index: 3; inset: 0; pointer-events: none; }
.envelope__pocket--left { background: #91a581; clip-path: polygon(0 0, 52% 56%, 0 100%); }
.envelope__pocket--right { background: #879b78; clip-path: polygon(100% 0, 48% 56%, 100% 100%); }
.envelope__pocket--bottom { background: linear-gradient(175deg, #9caf8c, #879a78); clip-path: polygon(0 100%, 50% 48%, 100% 100%); }

.envelope__seal {
  z-index: 6;
  left: 50%;
  top: 53%;
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.45);
  border-radius: 50%;
  color: #fff9ed;
  background:
    radial-gradient(circle at 33% 26%, rgba(255, 235, 184, .72), transparent 22%),
    radial-gradient(circle at 65% 70%, #a48140, #c6a35f 48%, #8f6e34 100%);
  box-shadow: inset 0 0 0 3px rgba(109, 79, 28, .18), inset 0 0 0 5px rgba(255,255,255,.12), 0 7px 15px rgba(58, 64, 48, .28);
  font: 500 .78rem/1 var(--display);
  letter-spacing: .04em;
  transform: translate(-50%, -50%);
  transition: opacity .3s, transform .5s var(--ease-out);
}

.envelope:hover .envelope__seal { transform: translate(-50%, -54%) scale(1.045); }
.is-opening .envelope__seal { opacity: 0; transform: translate(-50%, -65%) scale(.72); }
.is-opening .envelope__flap { z-index: 0; transform: rotateX(180deg); }
.is-opening .envelope__letter { z-index: 5; transform: translateY(-62%) scale(1.035); }
.is-opening .envelope { animation: envelope-exit 1.1s .9s var(--ease-out) both; }
.is-opening .envelope-stage > :not(.envelope) { animation: copy-fade .45s ease both; }
.is-opening .intro-botanical { animation: botanical-exit .9s .15s ease both; }
.envelope-intro.is-opening { animation: intro-exit .55s 1.2s ease both; }

.intro-date {
  position: relative;
  z-index: 3;
  margin: clamp(18px, 3vh, 27px) 0 0;
  color: var(--gold-deep);
  font-size: .64rem;
  font-weight: 600;
  letter-spacing: .32em;
  animation: intro-copy-arrival .75s 1.02s var(--ease-out) both;
}

.open-hint {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 11px;
  position: relative;
  z-index: 3;
  margin: clamp(14px, 2.6vh, 24px) 0 0;
  color: rgba(89, 101, 76, .68);
  font-size: .54rem;
  animation: intro-copy-arrival .75s 1.15s var(--ease-out) both;
}

.open-hint span {
  width: 29px;
  height: 1px;
  background: var(--gold);
  animation: hint-line 1.8s ease-in-out infinite;
}

.editorial-hero {
  position: relative;
  min-height: 100svh;
  display: grid;
  grid-template-rows: auto 1fr auto;
  padding: max(22px, env(safe-area-inset-top)) clamp(20px, 6vw, 76px) max(24px, env(safe-area-inset-bottom));
  overflow: hidden;
  color: var(--charcoal);
  background:
    linear-gradient(90deg, transparent 49.8%, rgba(89,101,76,.08) 50%, transparent 50.2%),
    var(--warm-white);
}

.editorial-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .15;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 150 150' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.1'/%3E%3C/svg%3E");
  mix-blend-mode: multiply;
}

.hero-rule {
  position: absolute;
  z-index: 1;
  top: clamp(72px, 10vh, 112px);
  left: clamp(20px, 6vw, 76px);
  right: clamp(20px, 6vw, 76px);
  height: 1px;
  background: rgba(89,101,76,.3);
}

.hero-edition {
  z-index: 2;
  display: flex;
  justify-content: space-between;
  margin: 0;
  font-size: .54rem;
  font-weight: 500;
}

.music-control {
  position: absolute;
  z-index: 4;
  top: clamp(90px, 12vh, 130px);
  left: clamp(20px, 6vw, 76px);
  width: min(calc(100% - 40px), 310px);
  min-height: 58px;
  display: grid;
  grid-template-columns: 38px 1fr 28px;
  align-items: center;
  gap: 11px;
  padding: 8px 10px;
  border: 1px solid rgba(89,101,76,.23);
  border-radius: 0;
  color: var(--charcoal);
  background: rgba(250,248,243,.76);
  backdrop-filter: blur(12px);
  text-align: left;
  cursor: pointer;
}

.music-control:disabled { cursor: not-allowed; opacity: .72; }
.music-control:focus-visible { outline: 3px solid var(--gold); outline-offset: 4px; }
.music-control__disc { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--deep); }
.music-control__disc::before { content: ""; width: 13px; height: 13px; border: 1px solid #e2cc9b; border-radius: 50%; }
.music-control__disc i { position: absolute; width: 4px; height: 4px; border-radius: 50%; background: #e2cc9b; }
.music-control[aria-pressed="true"] .music-control__disc { animation: record-spin 3.5s linear infinite; }
.music-control__copy { min-width: 0; }
.music-control__copy strong, .music-control__copy small { display: block; }
.music-control__copy strong { font: 500 .9rem/1.1 var(--display); }
.music-control__copy small { margin-top: 4px; overflow: hidden; font: 500 .47rem/1 var(--utility); letter-spacing: .09em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.music-control__action { color: var(--gold-deep); font: .7rem/1 var(--utility); text-align: center; }
.music-control[data-state="pending"] .music-control__action { font-size: 0; }
.music-control[data-state="pending"] .music-control__action::after { content: "—"; font-size: .72rem; }

.hero-date {
  position: absolute;
  z-index: 0;
  top: clamp(92px, 13vh, 150px);
  right: clamp(-24px, -2vw, -6px);
  margin: 0;
  color: rgba(156,175,136,.26);
  font-family: var(--display);
  text-align: right;
}

.hero-date strong {
  display: block;
  font-size: clamp(10.5rem, 52vw, 34rem);
  font-weight: 500;
  line-height: .65;
  letter-spacing: -.09em;
}

.hero-date span {
  display: block;
  padding-right: clamp(33px, 8vw, 105px);
  color: var(--olive);
  font: 500 clamp(.62rem, 1.5vw, .9rem)/1 var(--utility);
  letter-spacing: .27em;
  text-transform: uppercase;
}

.hero-date i { color: var(--gold); }

.hero-title-wrap {
  z-index: 2;
  align-self: center;
  width: min(100%, 980px);
  margin-top: clamp(160px, 24vh, 250px);
}

.hero-kicker {
  margin: 0 0 16px 2px;
  color: var(--olive);
  font-size: .61rem;
  font-weight: 500;
}

.editorial-hero h2 {
  margin: 0;
  color: var(--charcoal);
  font: 400 clamp(4.8rem, 20vw, 12rem)/.75 var(--display);
  letter-spacing: -.075em;
}

.editorial-hero h2 span {
  display: block;
  margin-left: clamp(30px, 10vw, 180px);
  color: var(--gold-deep);
  font-style: italic;
}

.hero-copy {
  z-index: 2;
  align-self: end;
  width: min(74%, 360px);
  margin: 28px 0 70px;
  font-size: clamp(.96rem, 2.5vw, 1.22rem);
  line-height: 1.55;
}

.scroll-cue {
  position: absolute;
  z-index: 2;
  right: clamp(20px, 6vw, 76px);
  bottom: max(28px, env(safe-area-inset-bottom));
  display: grid;
  justify-items: end;
  gap: 9px;
  font-size: .49rem;
  font-weight: 500;
  text-decoration: none;
}

.scroll-cue i { width: 54px; height: 1px; background: var(--gold); }

.section-inner { width: min(100%, 1120px); margin: 0 auto; }
.section-dark { position: relative; color: var(--ivory); background: var(--deep); }
.section-light { color: var(--charcoal); background: var(--warm-white); }
.section-paper { color: var(--charcoal); background: var(--ivory); }
.section-olive { position: relative; color: var(--ivory); background: var(--olive); overflow: hidden; }

.section-kicker {
  margin: 0 0 20px;
  color: var(--gold-deep);
  font: 500 .61rem/1 var(--utility);
  letter-spacing: .25em;
  text-transform: uppercase;
}

.section-dark .section-kicker,
.section-olive .section-kicker { color: #e2cc9b; }

.section-heading h2,
.opening-note h2,
.adult-notice h2,
.gifts h2,
.rsvp-preview h2 {
  margin: 0;
  font: 400 clamp(3.2rem, 13vw, 8.5rem)/.84 var(--display);
  letter-spacing: -.065em;
}

.section-heading h2 i,
.opening-note h2 i,
.adult-notice h2 i,
.gifts h2 i,
.rsvp-preview h2 i { color: var(--gold-deep); font-weight: 400; }

.section-dark h2 i,
.section-olive h2 i { color: #e2cc9b; }

.section-heading > p:last-child {
  width: min(100%, 440px);
  margin: 30px 0 0;
  font-size: clamp(.96rem, 2vw, 1.1rem);
  line-height: 1.7;
}

.opening-note { padding: clamp(86px, 16vw, 180px) 24px; overflow: hidden; }
.section-number {
  position: absolute;
  top: -5%;
  right: -2%;
  color: rgba(245,239,230,.045);
  font: 500 clamp(18rem, 70vw, 50rem)/1 var(--display);
}
.opening-note__grid { position: relative; z-index: 1; }
.opening-note blockquote {
  width: min(82%, 520px);
  margin: clamp(70px, 12vw, 120px) 0 30px auto;
  color: #e9d8b2;
  font: italic 400 clamp(1.45rem, 4vw, 2.3rem)/1.35 var(--body);
}
.opening-note .body-copy {
  width: min(82%, 520px);
  margin: 0 0 0 auto;
  color: rgba(245,239,230,.72);
  font-size: clamp(.96rem, 2vw, 1.1rem);
  line-height: 1.7;
}

.photo-story { padding: clamp(84px, 14vw, 170px) 18px; }
.photo-story .section-heading { margin: 0 6px clamp(54px, 10vw, 100px); }
.photo-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.photo-slot {
  position: relative;
  min-height: clamp(170px, 48vw, 330px);
  margin: 0;
  overflow: hidden;
  background:
    linear-gradient(145deg, rgba(250,248,243,.28), transparent),
    linear-gradient(135deg, #d6dbcf, #8d9c83);
}
.photo-slot:nth-child(1), .photo-slot:nth-child(6) { grid-row: span 2; min-height: clamp(348px, 98vw, 668px); }
.photo-slot:nth-child(3), .photo-slot:nth-child(7) { background: linear-gradient(145deg, #e7dccd, #b9aa93); }
.photo-slot::before {
  content: attr(data-index);
  position: absolute;
  top: 14px;
  left: 14px;
  color: rgba(255,255,255,.9);
  font: 500 .62rem/1 var(--utility);
  letter-spacing: .15em;
}
.photo-slot::after {
  content: "foto pendiente";
  position: absolute;
  right: 12px;
  bottom: 13px;
  color: rgba(255,255,255,.7);
  font: 500 .5rem/1 var(--utility);
  letter-spacing: .18em;
  text-transform: uppercase;
  writing-mode: vertical-rl;
}
.photo-slot img { width: 100%; height: 100%; display: block; object-fit: cover; }
.photo-slot:has(img)::after { display: none; }

.countdown-section { min-height: 72svh; display: grid; align-items: center; padding: clamp(90px, 15vw, 180px) 24px; }
.countdown-layout { position: relative; z-index: 1; }
.countdown-section h2 { margin: 0; font: 400 clamp(3.4rem, 14vw, 8.8rem)/.82 var(--display); letter-spacing: -.07em; }
.countdown-section h2 i { color: #e2cc9b; font-weight: 400; }
.countdown { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: clamp(60px, 11vw, 110px); border-top: 1px solid rgba(245,239,230,.28); border-bottom: 1px solid rgba(245,239,230,.28); }
.countdown > span { min-width: 0; padding: 22px 4px 19px; text-align: center; border-right: 1px solid rgba(245,239,230,.18); }
.countdown > span:last-child { border-right: 0; }
.countdown strong { display: block; color: var(--ivory); font: 400 clamp(1.8rem, 8vw, 4rem)/1 var(--display); font-variant-numeric: tabular-nums; }
.countdown small { display: block; margin-top: 9px; color: #e2cc9b; font: 500 clamp(.44rem, 1.6vw, .62rem)/1 var(--utility); letter-spacing: .16em; text-transform: uppercase; }
.countdown-date { margin: 20px 0 0; color: rgba(245,239,230,.7); font: 500 .56rem/1 var(--utility); letter-spacing: .2em; text-align: right; text-transform: uppercase; }

.itinerary { padding: clamp(84px, 14vw, 170px) 24px; }
.section-heading--split { display: grid; gap: 0; }
.event-list { margin-top: clamp(58px, 11vw, 110px); border-top: 1px solid rgba(89,101,76,.34); }
.event-row {
  display: grid;
  grid-template-columns: 46px 38px minmax(0, 1fr);
  gap: 13px;
  padding: 32px 0;
  border-bottom: 1px solid rgba(89,101,76,.34);
}
.event-icon { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid rgba(201,167,105,.7); border-radius: 50%; color: var(--olive); }
.event-icon svg { width: 22px; height: 22px; stroke: currentColor; }
.event-index { margin: 5px 0 0; color: var(--gold-deep); font: 500 .63rem/1 var(--utility); }
.event-type { margin: 4px 0 12px; color: var(--olive); font: 500 .62rem/1 var(--utility); letter-spacing: .2em; text-transform: uppercase; }
.event-content h3 { margin: 0 0 9px; font: 500 clamp(1.7rem, 5vw, 2.6rem)/1.05 var(--display); }
.event-content > p:not(.event-type) { margin: 0; font-size: .92rem; line-height: 1.55; }
.event-content .event-note { margin-top: 14px !important; color: rgba(43,43,43,.67); }
.text-link { display: inline-block; min-height: 44px; margin-top: 18px; padding: 12px 0 8px; color: var(--olive); font: 500 .61rem/1 var(--utility); letter-spacing: .16em; text-decoration: none; text-transform: uppercase; border-bottom: 1px solid var(--gold); }
.text-link.is-disabled { color: rgba(43,43,43,.45); border-bottom-style: dashed; }

.dress-code { padding: clamp(88px, 15vw, 180px) 24px; }
.section-heading--light > p:last-child { color: rgba(245,239,230,.68); }
.dress-grid { display: grid; margin-top: clamp(58px, 10vw, 110px); border-top: 1px solid rgba(245,239,230,.2); }
.dress-column { padding: 34px 0; border-bottom: 1px solid rgba(245,239,230,.2); }
.dress-index { margin: 0 0 28px; color: #e2cc9b; font: 500 .62rem/1 var(--utility); letter-spacing: .18em; text-transform: uppercase; }
.dress-icon { width: 58px; height: 72px; color: var(--sage); stroke: currentColor; }
.dress-column h3 { width: min(86%, 390px); margin: 30px 0 12px; color: var(--ivory); font: 400 clamp(1.65rem, 5vw, 2.7rem)/1.1 var(--display); }
.dress-column > p:last-child { margin: 0; color: rgba(245,239,230,.66); line-height: 1.6; }
.reserved-colors { margin-top: 54px; }
.reserved-colors > p { font: 500 .61rem/1 var(--utility); letter-spacing: .2em; text-transform: uppercase; }
.reserved-colors ul { display: flex; flex-wrap: wrap; gap: 18px 24px; margin: 24px 0 0; padding: 0; list-style: none; }
.reserved-colors li { display: flex; align-items: center; gap: 9px; font-size: .8rem; }
.swatch { width: 22px; height: 22px; border-radius: 50%; border: 1px solid rgba(255,255,255,.36); }
.swatch--white { background: #fff; }.swatch--beige { background: #dfceb5; }.swatch--green { background: #718268; }

.adult-notice { padding: clamp(90px, 15vw, 190px) 24px; text-align: center; }
.adult-notice__inner { width: min(100%, 800px); }
.adult-notice svg { width: 56px; height: 56px; margin-bottom: 38px; color: var(--gold-deep); stroke: currentColor; }
.adult-notice h2 { margin-bottom: 38px; }
.adult-notice__inner > p:last-child { width: min(100%, 590px); margin: 0 auto; font-size: clamp(1rem, 2.5vw, 1.2rem); line-height: 1.8; }

.gifts { min-height: 80svh; display: grid; align-items: center; padding: clamp(95px, 16vw, 190px) 24px; }
.gift-number { position: absolute; right: -4%; bottom: -18%; color: rgba(245,239,230,.06); font: 500 clamp(22rem, 78vw, 54rem)/1 var(--display); }
.gifts__inner { position: relative; z-index: 1; }
.gifts h2 { margin-bottom: 42px; }
.gifts__inner > p:last-child { width: min(82%, 530px); margin: 0 0 0 auto; color: rgba(245,239,230,.78); font-size: clamp(1rem, 2.5vw, 1.2rem); line-height: 1.75; }

.recommendations { padding: clamp(86px, 15vw, 180px) 24px; }
.recommendation-list { margin: clamp(60px, 11vw, 110px) 0 0; padding: 0; list-style: none; border-top: 1px solid rgba(89,101,76,.3); }
.recommendation-list li { display: grid; grid-template-columns: 48px 1fr; gap: 16px; padding: 28px 0; border-bottom: 1px solid rgba(89,101,76,.3); }
.recommendation-list li > span { color: var(--gold-deep); font: 500 .63rem/1 var(--utility); }
.recommendation-list h3 { margin: 0 0 10px; font: 500 clamp(1.45rem, 4vw, 2rem)/1 var(--display); }
.recommendation-list p { margin: 0; color: rgba(43,43,43,.68); line-height: 1.65; }

.rsvp-section { padding: clamp(90px, 15vw, 180px) 24px 52px; }
.rsvp-layout { display: grid; }
.rsvp-intro h2 { margin: 0; font: 400 clamp(3.5rem, 14vw, 8.8rem)/.82 var(--display); letter-spacing: -.07em; }
.rsvp-intro h2 i { color: var(--gold-deep); font-weight: 400; }
.rsvp-intro > p:last-child { width: min(100%, 560px); margin: 38px 0 0; font-size: clamp(.96rem, 2vw, 1.12rem); line-height: 1.72; }
.rsvp-form { display: grid; gap: 14px; margin-top: clamp(60px, 10vw, 100px); padding-top: 34px; border-top: 1px solid rgba(89,101,76,.3); }
.field-label, .rsvp-form legend { margin-bottom: 2px; color: var(--olive); font: 500 .61rem/1.3 var(--utility); letter-spacing: .18em; text-transform: uppercase; }
.rsvp-form input[type="text"] { width: 100%; min-height: 56px; padding: 12px 0; border: 0; border-bottom: 1px solid rgba(89,101,76,.45); border-radius: 0; color: var(--charcoal); background: transparent; font: 400 1.2rem/1.2 var(--body); }
.rsvp-form input[type="text"]::placeholder { color: rgba(43,43,43,.38); }
.rsvp-form input:focus-visible { outline: 3px solid var(--gold); outline-offset: 4px; }
.rsvp-form fieldset { display: grid; gap: 10px; margin: 28px 0 10px; padding: 0; border: 0; }
.rsvp-form legend { margin-bottom: 16px; }
.radio-option { position: relative; min-height: 52px; display: flex; align-items: center; border-bottom: 1px solid rgba(89,101,76,.25); cursor: pointer; }
.radio-option input { position: absolute; opacity: 0; }
.radio-option span { width: 100%; display: flex; align-items: center; justify-content: space-between; font-size: 1rem; }
.radio-option span::after { content: ""; width: 18px; height: 18px; border: 1px solid var(--olive); border-radius: 50%; box-shadow: inset 0 0 0 4px var(--warm-white); }
.radio-option input:checked + span::after { background: var(--olive); }
.radio-option input:focus-visible + span { outline: 3px solid var(--gold); outline-offset: 4px; }
.rsvp-submit { min-height: 54px; display: flex; align-items: center; justify-content: space-between; margin-top: 24px; padding: 0 20px; border: 1px solid var(--olive); border-radius: 0; color: var(--ivory); background: var(--olive); font: 500 .66rem/1 var(--utility); letter-spacing: .18em; text-transform: uppercase; cursor: pointer; }
.rsvp-submit:disabled { color: rgba(43,43,43,.48); background: transparent; cursor: not-allowed; }
.rsvp-submit:not(:disabled):hover { color: var(--deep); background: var(--gold); border-color: var(--gold); }
.rsvp-status { min-height: 42px; margin: 4px 0 0; color: rgba(43,43,43,.58); font: .78rem/1.55 var(--utility); }
.editorial-footer { margin-top: clamp(90px, 16vw, 180px); padding-top: 38px; border-top: 1px solid rgba(89,101,76,.3); text-align: center; }
.editorial-footer p { margin: 0 0 12px; font-size: .9rem; font-style: italic; }
.editorial-footer strong { display: block; color: var(--charcoal); font: 400 clamp(2.8rem, 11vw, 6rem)/.9 var(--display); letter-spacing: -.06em; }
.editorial-footer strong i { color: var(--gold-deep); font-weight: 400; }
.editorial-footer > span { display: block; margin-top: 24px; color: var(--olive); font: 500 .58rem/1 var(--utility); letter-spacing: .23em; }

.js [data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .78s var(--ease-out), transform .78s var(--ease-out);
}

.js [data-reveal].is-visible {
  opacity: 1;
  transform: none;
}

.js .event-row[data-reveal]:nth-child(2),
.js .dress-column[data-reveal]:nth-child(2),
.js .recommendation-list li[data-reveal]:nth-child(2) { transition-delay: .1s; }

.js .recommendation-list li[data-reveal]:nth-child(3) { transition-delay: .2s; }

.noscript-note {
  position: fixed;
  inset: auto 0 0;
  z-index: 100;
  margin: 0;
  padding: 12px 18px;
  color: var(--ivory);
  background: var(--deep);
  font: .8rem/1.4 var(--utility);
  text-align: center;
}

@keyframes botanical-arrival {
  from { opacity: 0; transform: translate3d(var(--botanical-x), -24px, 0) scale(.95); }
  to { opacity: .3; transform: none; }
}
@keyframes botanical-exit { to { opacity: 0; transform: translateY(-14px) scale(1.02); } }
@keyframes intro-exit { to { opacity: 0; } }
@keyframes intro-copy-arrival {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}
@keyframes title-arrival {
  from { opacity: 0; transform: translateY(24px) scale(.97); }
  to { opacity: 1; transform: none; }
}
@keyframes sprig-arrival {
  from { opacity: 0; transform: translate(12px, 22px) rotate(2deg) scale(.88); }
  to { opacity: .82; transform: rotate(-7deg) scale(1); }
}
@keyframes envelope-arrival {
  0% { opacity: 0; transform: translateY(38px) rotateX(-5deg) scale(.94); }
  72% { opacity: 1; transform: translateY(-4px) rotateX(0) scale(1.01); }
  100% { opacity: 1; transform: none; }
}
@keyframes envelope-exit { to { opacity: 0; transform: translateY(-12%) scale(1.08); } }
@keyframes copy-fade { to { opacity: 0; transform: translateY(8px); } }
@keyframes hint-line { 0%,100% { transform: scaleX(.55); transform-origin: left; } 50% { transform: scaleX(1); } }
@keyframes record-spin { to { transform: rotate(360deg); } }

@media (max-width: 420px) {
  .intro-botanical--left { left: -118px; }
  .intro-botanical--right { right: -108px; }
}

@media (max-height: 650px) {
  .intro-title { font-size: clamp(4.55rem, 19vw, 6rem); }
  .envelope { width: min(70vw, 330px); }
  .intro-date { margin-top: 14px; }
  .open-hint { margin-top: 11px; }
  .intro-sprig { top: 92px; width: 92px; }
}

@media (min-width: 760px) {
  .hero-copy { margin-left: 6vw; }
  .hero-title-wrap { margin-left: 6vw; }
  .photo-grid { grid-template-columns: repeat(4, 1fr); }
  .photo-slot { min-height: 300px; }
  .photo-slot:nth-child(1), .photo-slot:nth-child(6) { min-height: 608px; }
  .section-heading--split { grid-template-columns: minmax(0, 1.4fr) minmax(260px, .6fr); }
  .section-heading--split .section-kicker { grid-column: 1 / -1; }
  .section-heading--split > p:last-child { align-self: end; }
  .event-row { grid-template-columns: 70px 52px minmax(0, 1fr); gap: 24px; padding: 48px 0; }
  .event-icon { width: 60px; height: 60px; }
  .event-icon svg { width: 30px; height: 30px; }
  .dress-grid { grid-template-columns: repeat(2, 1fr); }
  .dress-column { padding: 48px 42px 48px 0; border-right: 1px solid rgba(245,239,230,.2); }
  .dress-column + .dress-column { padding-left: 42px; border-right: 0; }
  .recommendation-list li { grid-template-columns: 80px 1fr; padding: 40px 0; }
  .rsvp-layout { grid-template-columns: minmax(0, 1fr) minmax(330px, .65fr); gap: 8vw; }
  .rsvp-form { margin-top: 48px; }
  .editorial-footer { grid-column: 1 / -1; }
}

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

@media print {
  .envelope-intro, .scroll-cue, .noscript-note { display: none !important; }
  .editorial-hero { min-height: 100vh; }
}