/* ═══════════════════════════════════════════════════════
   TOKENS — edita aquí para re-tematizar todo
═══════════════════════════════════════════════════════ */
:root {
  --espresso:     #15110E;
  --ivory:        #F4EFE7;
  --champagne:    #DED0BC;
  --gold:         #B99563;
  --taupe:        #81766A;
  --sage:         #737B6B;
  --white:        #FFFFFF;
  --ink:          #1E1810;

  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body:    'Manrope', system-ui, sans-serif;

  --ease:         cubic-bezier(.16,1,.3,1);
  --ease-in:      cubic-bezier(.4,0,1,1);

  --side:         clamp(20px, 5vw, 48px);
  --max-w:        1200px;
  --col:          min(100%, 680px);
  --radius:       3px;

  --section-v:    clamp(72px, 10vw, 120px);
}

/* ── Reset ─────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  background: var(--espresso);
  color: var(--ivory);
  font-family: var(--font-body);
  font-weight: 300;
  font-size: 16px;
  line-height: 1.6;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; border: none; background: none; color: inherit; font: inherit; }

/* Grain texture */
body::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9999;
  opacity: 0.028;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: 128px 128px;
}

/* ── Focus ─────────────────────────────────────── */
:focus-visible { outline: 1.5px solid var(--gold); outline-offset: 3px; border-radius: var(--radius); }

/* ── Shared ─────────────────────────────────────── */
.section-eyebrow {
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
}
.section-heading {
  font-family: var(--font-display);
  font-size: clamp(32px, 6vw, 52px);
  font-weight: 300;
  line-height: 1.08;
  letter-spacing: -.01em;
  color: var(--ink);
  margin-bottom: 40px;
}
.section-heading em { font-style: italic; }
.section-heading--light { color: var(--champagne); }

/* ── Buttons ─────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  padding: 14px 28px;
  border-radius: var(--radius);
  min-height: 48px;
  transition: background .2s, color .2s, border-color .2s, transform .15s;
}
.btn:active { transform: translateY(1px); }

.btn--primary {
  background: var(--espresso);
  color: var(--champagne);
  border: 1px solid rgba(185,149,99,.25);
}
.btn--primary:hover {
  background: #2A1F16;
  border-color: var(--gold);
}

.btn--ghost {
  background: transparent;
  color: var(--espresso);
  border: 1px solid rgba(21,17,14,.25);
}
.btn--ghost:hover { border-color: var(--espresso); }

.btn--ghost-light {
  background: transparent;
  color: var(--champagne);
  border: 1px solid rgba(222,208,188,.3);
}
.btn--ghost-light:hover { border-color: var(--champagne); }

/* ══════════════════════════════════════════════════
   PROGRESS BAR
══════════════════════════════════════════════════ */
.progress-bar {
  position: fixed;
  top: 0; left: 0;
  height: 2px;
  width: 0%;
  background: var(--gold);
  z-index: 1000;
  transition: width .1s linear;
  pointer-events: none;
}

/* ══════════════════════════════════════════════════
   COVER / OPENING
══════════════════════════════════════════════════ */
.cover {
  position: fixed;
  inset: 0;
  z-index: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  transition: opacity .8s var(--ease), visibility .8s;
}
.cover.is-open {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.cover__bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
.cover__img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scale(1.06);
  animation: coverZoom 20s ease-out forwards;
  will-change: transform;
}
@keyframes coverZoom {
  to { transform: scale(1.0); }
}
.cover__overlay {
  position: absolute; inset: 0;
  background: rgba(15,10,6,.72);
}
.cover__vignette {
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at center, transparent 30%, rgba(10,7,4,.65) 100%);
}

.cover__content {
  position: relative;
  z-index: 1;
  text-align: center;
  padding: 48px var(--side);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  animation: coverFadeUp .9s .3s var(--ease) both;
}
@keyframes coverFadeUp {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: none; }
}

.cover__monogram svg { width: 64px; height: 64px; margin-bottom: 24px; }

.cover__eyebrow {
  font-size: 11px;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--gold);
  opacity: .7;
  margin-bottom: 20px;
}

.cover__names {
  font-family: var(--font-display);
  font-size: clamp(48px, 15vw, 80px);
  font-weight: 300;
  color: var(--champagne);
  line-height: .95;
  letter-spacing: -.02em;
  margin-bottom: 20px;
}
.cover__names em {
  display: block;
  font-size: .48em;
  font-style: italic;
  color: var(--gold);
  opacity: .7;
  margin: 6px 0;
  letter-spacing: 0;
}

.cover__date {
  font-size: 13px;
  letter-spacing: .22em;
  color: var(--champagne);
  opacity: .55;
  margin-bottom: 40px;
}

.cover__btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--espresso);
  background: var(--champagne);
  padding: 15px 32px;
  border-radius: var(--radius);
  border: none;
  min-height: 52px;
  transition: background .2s, transform .15s, box-shadow .2s;
  box-shadow: 0 4px 24px rgba(0,0,0,.35);
}
.cover__btn:hover {
  background: var(--ivory);
  transform: translateY(-1px);
  box-shadow: 0 8px 32px rgba(0,0,0,.4);
}
.cover__btn:active { transform: translateY(0); }

/* ══════════════════════════════════════════════════
   MUSIC BUTTON
══════════════════════════════════════════════════ */
.music-btn {
  position: fixed;
  top: 20px; right: 20px;
  z-index: 700;
  width: 44px; height: 44px;
  border-radius: 50%;
  background: rgba(21,17,14,.75);
  border: 1px solid rgba(185,149,99,.25);
  display: flex;
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(8px);
  transition: background .2s, opacity .4s;
}
.music-btn[hidden] { display: none; }
.music-btn:hover { background: rgba(40,30,20,.9); }

.music-bars {
  display: flex;
  align-items: flex-end;
  gap: 2.5px;
  height: 14px;
}
.music-bars span {
  display: block;
  width: 2.5px;
  background: var(--gold);
  border-radius: 1px;
  animation: bar 1s ease-in-out infinite alternate;
  transform-origin: bottom;
}
.music-bars span:nth-child(1) { height: 6px;  animation-delay: 0s; }
.music-bars span:nth-child(2) { height: 12px; animation-delay: .2s; }
.music-bars span:nth-child(3) { height: 8px;  animation-delay: .4s; }
.music-bars span:nth-child(4) { height: 10px; animation-delay: .1s; }

@keyframes bar {
  from { transform: scaleY(.4); }
  to   { transform: scaleY(1); }
}
.music-btn.is-paused .music-bars span { animation-play-state: paused; opacity: .4; }

/* ══════════════════════════════════════════════════
   MAIN
══════════════════════════════════════════════════ */
.main { opacity: 0; transition: opacity .6s ease; }
.main.is-visible { opacity: 1; }

/* ══════════════════════════════════════════════════
   REVEAL ANIMATIONS
══════════════════════════════════════════════════ */
.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .9s var(--ease), transform .9s var(--ease);
}
.reveal.is-visible { opacity: 1; transform: none; }

.reveal-mask {
  overflow: hidden;
}
.reveal-mask > img,
.reveal-mask > .gallery__img {
  transform: scale(1.08);
  transition: transform 1.1s var(--ease), opacity .6s ease;
  opacity: 0;
}
.reveal-mask.is-visible > img,
.reveal-mask.is-visible > .gallery__img {
  transform: scale(1);
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  .reveal, .reveal-mask > img, .reveal-mask > .gallery__img,
  .cover__img, .cover__content { animation: none; transition: none; }
  .reveal { opacity: 1; transform: none; }
  .reveal-mask > img { opacity: 1; transform: none; }
}

/* ══════════════════════════════════════════════════
   HERO
══════════════════════════════════════════════════ */
.hero {
  position: relative;
  height: 100svh;
  min-height: 600px;
  overflow: hidden;
  display: flex;
  align-items: center;
}

.hero__img-wrap {
  position: absolute;
  inset: 0;
}
.hero__img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: 70% center;
  will-change: transform;
}
.hero__gradient {
  position: absolute; inset: 0;
  background: linear-gradient(
    to right,
    rgba(21,17,14,.82) 0%,
    rgba(21,17,14,.55) 45%,
    rgba(21,17,14,.1) 75%,
    transparent 100%
  );
}

/* Desktop copy */
.hero__copy--desktop {
  position: relative;
  z-index: 2;
  padding: 0 var(--side);
  max-width: min(520px, 48%);
  margin-left: max(var(--side), calc((100% - var(--max-w)) / 2 + var(--side)));
}
.hero__copy--mobile { display: none; }

.hero__eyebrow {
  font-size: 11px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
  font-weight: 500;
}

.hero__names {
  font-family: var(--font-display);
  font-size: clamp(44px, 8vw, 80px);
  font-weight: 300;
  line-height: .92;
  color: var(--champagne);
  letter-spacing: -.02em;
  margin-bottom: 20px;
}
.hero__names em {
  display: block;
  font-size: .5em;
  font-style: italic;
  color: var(--gold);
  opacity: .65;
  margin: 6px 0;
}

.hero__city {
  font-size: 12px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--champagne);
  opacity: .5;
  margin-bottom: 16px;
}

.hero__phrase {
  font-size: 15px;
  color: var(--champagne);
  opacity: .7;
  line-height: 1.65;
  margin-bottom: 36px;
  max-width: 36ch;
}

.hero__actions { display: flex; gap: 12px; flex-wrap: wrap; }
.hero__actions .btn--primary {
  background: var(--champagne);
  color: var(--espresso);
  border-color: transparent;
}
.hero__actions .btn--primary:hover { background: var(--ivory); }
.hero__actions .btn--ghost { color: var(--champagne); border-color: rgba(222,208,188,.35); }
.hero__actions .btn--ghost:hover { border-color: var(--champagne); }

/* Scroll indicator */
.hero__scroll {
  position: absolute;
  bottom: 32px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
}
.hero__scroll-line {
  display: block;
  width: 1px;
  height: 40px;
  background: linear-gradient(to bottom, var(--gold), transparent);
  animation: scrollPulse 2s ease-in-out infinite;
  margin: auto;
}
@keyframes scrollPulse {
  0%,100% { opacity: .3; transform: scaleY(1); }
  50%      { opacity: .8; transform: scaleY(1.15); }
}

/* Mobile hero */
@media (max-width: 700px) {
  .hero { height: auto; flex-direction: column; align-items: stretch; }
  .hero__img-wrap { position: relative; height: 68svh; }
  .hero__img { object-position: 63% center; }
  .hero__gradient {
    background: linear-gradient(
      to bottom,
      transparent 40%,
      rgba(21,17,14,.6) 80%,
      var(--espresso) 100%
    );
  }
  .hero__copy--desktop { display: none; }
  .hero__copy--mobile {
    display: flex;
    flex-direction: column;
    position: relative;
    z-index: 2;
    padding: 28px var(--side) 48px;
    background: var(--espresso);
    margin-top: -2px;
  }
  .hero__names { font-size: clamp(40px, 13vw, 58px); }
  .hero__scroll { bottom: auto; top: calc(68svh - 52px); }
}

/* ══════════════════════════════════════════════════
   GUEST SECTION
══════════════════════════════════════════════════ */
.guest-section {
  background: var(--ivory);
  padding: clamp(56px, 8vw, 80px) var(--side);
}
.guest-section[hidden] { display: none; }

.guest-section__inner {
  max-width: var(--col);
  margin: auto;
  text-align: center;
  position: relative;
}

.guest-section__mono svg {
  width: 40px; height: 40px;
  margin: 0 auto 24px;
}

.guest-section__label {
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--taupe);
  margin-bottom: 16px;
  font-family: var(--font-body);
}

.guest-section__name {
  font-family: var(--font-display);
  font-size: clamp(32px, 8vw, 52px);
  font-weight: 400;
  color: var(--espresso);
  line-height: 1.05;
  letter-spacing: -.01em;
  margin-bottom: 12px;
}

.guest-section__passes {
  font-size: 13px;
  color: var(--taupe);
  letter-spacing: .06em;
  margin-bottom: 24px;
}
.guest-section__passes[hidden] { display: none; }

.guest-section__rule {
  width: 48px;
  height: 1px;
  background: var(--gold);
  margin: 0 auto;
  opacity: .4;
}

/* ══════════════════════════════════════════════════
   STICKY NAV
══════════════════════════════════════════════════ */
.sticky-nav {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(20,16,12,.92);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(185,149,99,.12);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 0 var(--side);
  height: 52px;
  transition: transform .3s var(--ease);
}
.sticky-nav.is-hidden { transform: translateY(-100%); }

.sticky-nav__item {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--champagne);
  opacity: .6;
  padding: 0 20px;
  height: 100%;
  transition: opacity .2s, color .2s;
  border-bottom: 2px solid transparent;
  white-space: nowrap;
}
.sticky-nav__item:hover { opacity: 1; }
.sticky-nav__item--cta {
  color: var(--gold);
  opacity: .9;
  border-bottom-color: var(--gold);
}
.sticky-nav__item--cta:hover { opacity: 1; }

/* Mobile: bottom bar */
@media (max-width: 700px) {
  .sticky-nav {
    position: fixed;
    top: auto;
    bottom: 0;
    width: 100%;
    height: calc(56px + env(safe-area-inset-bottom));
    padding-bottom: env(safe-area-inset-bottom);
    border-top: 1px solid rgba(185,149,99,.12);
    border-bottom: none;
    background: rgba(15,11,8,.96);
    justify-content: space-around;
  }
  .sticky-nav.is-hidden { transform: translateY(100%); }
  .sticky-nav__item { flex-direction: column; gap: 4px; font-size: 9px; padding: 0 12px; opacity: .7; }
  .sticky-nav__item svg { width: 18px; height: 18px; }
  .sticky-nav__item--cta { border-bottom: none; border-top: 2px solid var(--gold); }
  .main { padding-bottom: calc(56px + env(safe-area-inset-bottom)); }
}

/* ══════════════════════════════════════════════════
   COUNTDOWN
══════════════════════════════════════════════════ */
.countdown-section {
  background: var(--espresso);
  padding: var(--section-v) var(--side);
  position: relative;
  overflow: hidden;
}
.countdown-section::before {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 600px; height: 300px;
  background: radial-gradient(ellipse, rgba(185,149,99,.07) 0%, transparent 70%);
  pointer-events: none;
}

.countdown-section__inner {
  max-width: var(--max-w);
  margin: auto;
  text-align: center;
}

.countdown-section__phrase {
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(18px, 3.5vw, 24px);
  color: var(--champagne);
  opacity: .6;
  margin-bottom: 48px;
  font-weight: 300;
}

.countdown {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: clamp(8px, 3vw, 32px);
  flex-wrap: wrap;
}

.countdown__col {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.countdown__num {
  font-family: var(--font-display);
  font-size: clamp(52px, 14vw, 96px);
  font-weight: 300;
  color: var(--champagne);
  line-height: 1;
  letter-spacing: -.03em;
  min-width: 2ch;
  text-align: center;
  transition: opacity .15s;
}

.countdown__lbl {
  font-size: 10px;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--gold);
  opacity: .6;
  font-family: var(--font-body);
}

.countdown__sep {
  font-family: var(--font-display);
  font-size: clamp(32px, 8vw, 56px);
  color: var(--gold);
  opacity: .25;
  align-self: flex-start;
  margin-top: .1em;
  line-height: 1;
}

/* ══════════════════════════════════════════════════
   STORY
══════════════════════════════════════════════════ */
.story {
  background: var(--ivory);
  padding: var(--section-v) var(--side);
  overflow: hidden;
}

.story__inner {
  max-width: var(--max-w);
  margin: auto;
  display: grid;
  grid-template-columns: 1fr 1.1fr 1fr;
  grid-template-rows: auto;
  gap: 32px;
  align-items: start;
}

.story__img-a {
  grid-column: 1;
  grid-row: 1;
  aspect-ratio: 3/4;
  border-radius: var(--radius);
  overflow: hidden;
  margin-top: 48px;
}

.story__text {
  grid-column: 2;
  grid-row: 1;
  padding: 40px 24px;
  background: var(--ivory);
  position: relative;
  z-index: 1;
}

.story__img-b {
  grid-column: 3;
  grid-row: 1;
  aspect-ratio: 4/5;
  border-radius: var(--radius);
  overflow: hidden;
}

.story__img { width: 100%; height: 100%; object-fit: cover; }

.story__chapter {
  font-size: 10px;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
  font-family: var(--font-body);
  font-weight: 500;
}

.story__heading {
  font-family: var(--font-display);
  font-size: clamp(36px, 5vw, 52px);
  font-weight: 300;
  line-height: 1.05;
  color: var(--espresso);
  margin-bottom: 28px;
}
.story__heading em { font-style: italic; }

.story__body {
  font-size: 15px;
  color: var(--taupe);
  line-height: 1.75;
  max-width: 40ch;
  margin-bottom: 16px;
}
.story__body em { color: var(--espresso); font-style: italic; }

.story__date-marker {
  font-size: 11px;
  letter-spacing: .22em;
  color: var(--gold);
  opacity: .5;
  margin-top: 28px;
  font-family: var(--font-body);
}

@media (max-width: 900px) {
  .story__inner {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
  }
  .story__img-a { grid-column: 1; grid-row: 1; margin-top: 0; }
  .story__text  { grid-column: 2; grid-row: 1; padding: 24px 0 24px 16px; }
  .story__img-b { grid-column: 1 / -1; grid-row: 2; aspect-ratio: 16/7; }
}

@media (max-width: 600px) {
  .story__inner {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }
  .story__img-a { grid-column: 1; grid-row: 1; aspect-ratio: 4/3; }
  .story__text  { grid-column: 1; grid-row: 2; padding: 0; }
  .story__img-b { grid-column: 1; grid-row: 3; aspect-ratio: 4/3; margin-left: calc(-1 * var(--side)); width: calc(100% + var(--side)); }
}

/* ══════════════════════════════════════════════════
   DIVIDER EMOCIONAL
══════════════════════════════════════════════════ */
.divider-img {
  position: relative;
  height: clamp(240px, 40vw, 480px);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.divider-img__img {
  position: absolute;
  inset: -10%;
  width: 120%;
  height: 120%;
  object-fit: cover;
  will-change: transform;
}
.divider-img__overlay {
  position: absolute; inset: 0;
  background: rgba(15,10,6,.62);
}
.divider-img__text {
  position: relative;
  z-index: 1;
  font-family: var(--font-display);
  font-size: clamp(22px, 4.5vw, 40px);
  font-weight: 300;
  color: var(--champagne);
  text-align: center;
  line-height: 1.35;
  padding: 0 var(--side);
  max-width: 24ch;
}
.divider-img__text em { font-style: italic; color: var(--gold); opacity: .85; }

/* ══════════════════════════════════════════════════
   VENUES
══════════════════════════════════════════════════ */
.venues {
  background: var(--ivory);
  padding: var(--section-v) var(--side);
}

.venues__inner {
  max-width: var(--max-w);
  margin: auto;
}

.venues .section-heading { color: var(--espresso); }

.venues__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

@media (max-width: 700px) {
  .venues__grid { grid-template-columns: 1fr; }
}

.venue-card {
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--white);
  box-shadow: 0 2px 20px rgba(0,0,0,.07);
}

.venue-card__img-wrap {
  position: relative;
  aspect-ratio: 16/9;
  overflow: hidden;
  background: var(--champagne);
}
.venue-card__img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .6s var(--ease);
}
.venue-card:hover .venue-card__img { transform: scale(1.03); }
.venue-card__img-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(21,17,14,.5) 0%, transparent 50%);
}

.venue-card__body {
  padding: 28px 24px 20px;
}

.venue-card__type {
  font-size: 10px;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 500;
  margin-bottom: 8px;
}

.venue-card__name {
  font-family: var(--font-display);
  font-size: clamp(20px, 3vw, 26px);
  font-weight: 400;
  color: var(--espresso);
  line-height: 1.15;
  margin-bottom: 8px;
}

.venue-card__time {
  font-family: var(--font-display);
  font-size: 32px;
  font-weight: 300;
  color: var(--gold);
  line-height: 1;
  margin-bottom: 16px;
}

.venue-card__details {
  overflow: hidden;
  transition: max-height .45s var(--ease), opacity .35s ease;
  max-height: 500px;
  opacity: 1;
}
.venue-card__details.is-collapsed {
  max-height: 0;
  opacity: 0;
}

.venue-card__address {
  font-size: 14px;
  color: var(--taupe);
  line-height: 1.6;
  margin-bottom: 10px;
}
.venue-card__note {
  font-size: 13px;
  color: var(--taupe);
  opacity: .7;
  margin-bottom: 16px;
}

.venue-card__map-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--espresso);
  border-bottom: 1px solid rgba(21,17,14,.2);
  padding-bottom: 2px;
  transition: border-color .2s, color .2s;
  margin-bottom: 16px;
}
.venue-card__map-btn:hover { color: var(--gold); border-color: var(--gold); }

.calendar-actions { margin-bottom: 8px; }
.calendar-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--taupe);
  opacity: .7;
  padding: 0;
  transition: opacity .2s, color .2s;
}
.calendar-btn:hover { opacity: 1; color: var(--espresso); }

.venue-card__toggle {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--taupe);
  opacity: .6;
  margin-top: 12px;
  padding: 8px 0;
  min-height: 44px;
  transition: opacity .2s;
}
.venue-card__toggle:hover { opacity: 1; }
.venue-card__toggle-icon { transition: transform .3s; }
.venue-card__toggle[aria-expanded="false"] .venue-card__toggle-icon { transform: rotate(-90deg); }

/* ══════════════════════════════════════════════════
   TIMELINE
══════════════════════════════════════════════════ */
.timeline-section {
  background: var(--espresso);
  padding: var(--section-v) var(--side);
  overflow: hidden;
}
.timeline-section__inner {
  max-width: var(--max-w);
  margin: auto;
}

/* Desktop: horizontal */
.timeline {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0;
  margin-top: 48px;
}

.timeline__line {
  position: absolute;
  top: 7px;
  left: 7px;
  right: 7px;
  height: 1px;
  background: rgba(185,149,99,.18);
}
.timeline__line-fill {
  height: 1px;
  background: var(--gold);
  width: 0%;
  transition: width .6s var(--ease);
}

.timeline__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  position: relative;
  opacity: .35;
  transition: opacity .5s ease;
}
.timeline__item.is-active { opacity: 1; }

.timeline__dot {
  width: 14px; height: 14px;
  border-radius: 50%;
  border: 1.5px solid var(--gold);
  background: var(--espresso);
  transition: background .4s ease;
  z-index: 1;
  margin-bottom: 20px;
  flex-shrink: 0;
}
.timeline__item.is-active .timeline__dot { background: var(--gold); }

.timeline__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 4px;
  padding: 0 8px;
}

.timeline__icon {
  width: 20px; height: 20px;
  color: var(--gold);
  opacity: .6;
  margin-bottom: 6px;
}

.timeline__time {
  font-family: var(--font-display);
  font-size: 15px;
  color: var(--gold);
  font-weight: 300;
}

.timeline__event {
  font-size: 12px;
  color: var(--champagne);
  opacity: .75;
  line-height: 1.4;
  font-family: var(--font-body);
}

/* Mobile: vertical */
@media (max-width: 700px) {
  .timeline { flex-direction: column; gap: 0; }
  .timeline__line {
    top: 7px; left: 6px; right: auto; bottom: 7px;
    width: 1px; height: auto;
  }
  .timeline__line-fill { width: 1px; height: 0%; transition: height .6s var(--ease); }
  .timeline__item { flex-direction: row; align-items: flex-start; gap: 20px; padding: 0 0 32px 0; }
  .timeline__dot { margin-bottom: 0; margin-top: 0; flex-shrink: 0; }
  .timeline__content { align-items: flex-start; text-align: left; }
}

/* ══════════════════════════════════════════════════
   DRESS CODE
══════════════════════════════════════════════════ */
.dress {
  background: var(--ivory);
  padding: var(--section-v) var(--side);
  overflow: hidden;
}

.dress__inner {
  max-width: var(--max-w);
  margin: auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}

.dress__inner .section-eyebrow { grid-column: 1 / -1; margin-bottom: 0; }

.dress__heading {
  font-family: var(--font-display);
  font-size: clamp(36px, 6vw, 56px);
  font-weight: 300;
  line-height: 1.05;
  color: var(--espresso);
}
.dress__heading em { font-style: italic; }

.dress__note {
  font-size: 14px;
  color: var(--taupe);
  margin-top: 16px;
  max-width: 38ch;
  line-height: 1.65;
}

.dress__palette {
  display: flex;
  gap: 12px;
  margin-top: 28px;
}
.dress__swatch {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--c);
  border: 1px solid rgba(0,0,0,.08);
  transition: transform .2s;
}
.dress__swatch:hover { transform: scale(1.15); }

.dress__silhouettes {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 32px;
}
.dress__silhouette {
  width: 80px; height: 140px;
  color: var(--taupe);
  opacity: .4;
}

@media (max-width: 700px) {
  .dress__inner { grid-template-columns: 1fr; gap: 32px; }
  .dress__silhouettes { justify-content: flex-start; }
}

/* ══════════════════════════════════════════════════
   GALLERY
══════════════════════════════════════════════════ */
.gallery {
  background: var(--espresso);
  padding: var(--section-v) var(--side);
}
.gallery__inner { max-width: var(--max-w); margin: auto; }

.gallery__grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr;
  grid-template-rows: auto auto;
  gap: 10px;
  margin-top: 40px;
}

.gallery__item {
  display: block;
  overflow: hidden;
  border-radius: var(--radius);
  background: #1A1610;
  cursor: pointer;
  position: relative;
  padding: 0;
}

.gallery__item::after {
  content: '';
  position: absolute; inset: 0;
  background: rgba(21,17,14,0);
  transition: background .3s;
}
.gallery__item:hover::after { background: rgba(21,17,14,.2); }

.gallery__item--tall {
  grid-column: 1;
  grid-row: 1 / 3;
  aspect-ratio: 3/4;
}
.gallery__item--wide {
  grid-column: 2 / 4;
  aspect-ratio: 16/9;
}
.gallery__item:not(.gallery__item--tall):not(.gallery__item--wide) {
  grid-column: 2;
  aspect-ratio: 1;
}
.gallery__item:last-child {
  grid-column: 3;
  aspect-ratio: 1;
}

.gallery__img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .5s var(--ease);
}
.gallery__item:hover .gallery__img { transform: scale(1.04); }

@media (max-width: 600px) {
  .gallery__grid {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
  }
  .gallery__item--tall { grid-column: 1; grid-row: 1 / 3; aspect-ratio: 2/3; }
  .gallery__item--wide { grid-column: 2; aspect-ratio: 1; }
  .gallery__item:not(.gallery__item--tall):not(.gallery__item--wide) { grid-column: 2; }
  .gallery__item:last-child { grid-column: 1 / -1; aspect-ratio: 16/7; }
}

/* LIGHTBOX */
.lightbox {
  position: fixed;
  inset: 0;
  z-index: 900;
  background: rgba(10,7,4,.95);
  display: flex;
  align-items: center;
  justify-content: center;
}
.lightbox[hidden] { display: none; }

.lightbox__img-wrap {
  max-width: min(90vw, 900px);
  max-height: 85svh;
  display: flex;
  align-items: center;
  justify-content: center;
}
.lightbox__img {
  max-width: 100%;
  max-height: 85svh;
  object-fit: contain;
  border-radius: var(--radius);
}

.lightbox__close {
  position: absolute;
  top: 20px; right: 20px;
  width: 44px; height: 44px;
  border-radius: 50%;
  background: rgba(255,255,255,.08);
  display: flex; align-items: center; justify-content: center;
  color: var(--champagne);
  transition: background .2s;
}
.lightbox__close:hover { background: rgba(255,255,255,.15); }

.lightbox__nav {
  position: absolute;
  top: 50%; transform: translateY(-50%);
  width: 48px; height: 48px;
  border-radius: 50%;
  background: rgba(255,255,255,.07);
  display: flex; align-items: center; justify-content: center;
  color: var(--champagne);
  transition: background .2s;
}
.lightbox__nav:hover { background: rgba(255,255,255,.14); }
.lightbox__nav--prev { left: 16px; }
.lightbox__nav--next { right: 16px; }

.lightbox__counter {
  position: absolute;
  bottom: 20px; left: 50%;
  transform: translateX(-50%);
  font-size: 12px;
  letter-spacing: .14em;
  color: var(--champagne);
  opacity: .4;
}

/* ══════════════════════════════════════════════════
   GIFTS
══════════════════════════════════════════════════ */
.gifts {
  background: var(--ivory);
  padding: var(--section-v) var(--side);
  text-align: center;
}
.gifts__inner { max-width: var(--col); margin: auto; }

.gifts__heading {
  font-family: var(--font-display);
  font-size: clamp(30px, 5vw, 44px);
  font-weight: 300;
  line-height: 1.1;
  color: var(--espresso);
  margin-bottom: 16px;
}
.gifts__heading em { font-style: italic; }

.gifts__body {
  font-size: 15px;
  color: var(--taupe);
  margin-bottom: 36px;
  line-height: 1.7;
}

.gifts__actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

/* ══════════════════════════════════════════════════
   RSVP
══════════════════════════════════════════════════ */
.rsvp {
  background: var(--espresso);
  padding: var(--section-v) var(--side);
}
.rsvp__inner {
  max-width: 520px;
  margin: auto;
}

.rsvp .section-heading { color: var(--champagne); margin-bottom: 8px; }

.rsvp__deadline {
  font-size: 13px;
  color: var(--champagne);
  opacity: .45;
  margin-bottom: 40px;
  letter-spacing: .04em;
}
.rsvp__deadline strong { color: var(--champagne); opacity: .8; font-weight: 400; }

.rsvp__field { display: flex; flex-direction: column; gap: 8px; margin-bottom: 24px; }

.rsvp__label {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--champagne);
  opacity: .5;
}
.rsvp__optional { font-weight: 300; text-transform: none; letter-spacing: 0; font-size: 10px; }

.rsvp__input {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(185,149,99,.2);
  border-radius: var(--radius);
  color: var(--champagne);
  font-family: var(--font-body);
  font-size: 15px;
  padding: 13px 16px;
  min-height: 48px;
  transition: border-color .2s, background .2s;
  width: 100%;
}
.rsvp__input:focus {
  outline: none;
  border-color: var(--gold);
  background: rgba(255,255,255,.07);
}
.rsvp__input::placeholder { color: rgba(222,208,188,.3); }
.rsvp__input--narrow { max-width: 120px; }
.rsvp__input--textarea { resize: vertical; min-height: 88px; }

.rsvp__radio-group { display: flex; flex-direction: column; gap: 12px; }
.rsvp__radio {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 15px;
  color: var(--champagne);
  opacity: .75;
  cursor: pointer;
  min-height: 44px;
  transition: opacity .2s;
}
.rsvp__radio:hover { opacity: 1; }
.rsvp__radio input[type="radio"] {
  width: 18px; height: 18px;
  accent-color: var(--gold);
  flex-shrink: 0;
}

.rsvp__btns { display: flex; gap: 12px; }

.rsvp__step[hidden] { display: none; }

.rsvp__success {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 40px 0;
  text-align: center;
}
.rsvp__success[hidden] { display: none; }
.rsvp__success-text {
  font-family: var(--font-display);
  font-size: 20px;
  color: var(--champagne);
  font-style: italic;
  font-weight: 300;
}

/* ══════════════════════════════════════════════════
   CLOSING
══════════════════════════════════════════════════ */
.closing {
  position: relative;
  min-height: 80svh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.closing__bg {
  position: absolute; inset: 0;
  background: var(--espresso);
}
.closing__img {
  width: 100%; height: 100%;
  object-fit: cover;
  animation: closingZoom 20s ease-out forwards;
}
@keyframes closingZoom {
  from { transform: scale(1.04); }
  to   { transform: scale(1); }
}
.closing__overlay {
  position: absolute; inset: 0;
  background: rgba(15,10,6,.7);
}

.closing__content {
  position: relative;
  z-index: 1;
  text-align: center;
  padding: var(--section-v) var(--side);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

.closing__monogram svg { width: 80px; height: 80px; }

.closing__text {
  font-family: var(--font-display);
  font-size: clamp(26px, 5vw, 44px);
  font-weight: 300;
  color: var(--champagne);
  line-height: 1.25;
}
.closing__text em { font-style: italic; color: var(--gold); opacity: .8; }

.closing__date {
  font-size: 12px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--champagne);
  opacity: .35;
}

.closing__cta {
  background: var(--champagne);
  color: var(--espresso);
  border-color: transparent;
  margin-top: 8px;
}
.closing__cta:hover { background: var(--ivory); }

/* ══════════════════════════════════════════════════
   MODAL
══════════════════════════════════════════════════ */
.modal[hidden] { display: none; }
.modal {
  position: fixed;
  inset: 0;
  z-index: 850;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--side);
}

.modal__backdrop {
  position: absolute; inset: 0;
  background: rgba(10,7,4,.8);
  backdrop-filter: blur(4px);
}

.modal__box {
  position: relative;
  background: var(--ivory);
  border-radius: var(--radius);
  padding: 40px 36px;
  max-width: 400px;
  width: 100%;
  box-shadow: 0 24px 64px rgba(0,0,0,.4);
}

.modal__close {
  position: absolute;
  top: 16px; right: 16px;
  width: 36px; height: 36px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: var(--taupe);
  transition: background .2s;
}
.modal__close:hover { background: rgba(0,0,0,.06); }

.modal__title {
  font-family: var(--font-display);
  font-size: 24px;
  font-weight: 400;
  color: var(--espresso);
  margin-bottom: 28px;
}

.bank-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 12px 0;
  border-bottom: 1px solid rgba(0,0,0,.07);
  gap: 16px;
}
.bank-row:last-of-type { border-bottom: none; }
.bank-row__label {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--taupe);
  flex-shrink: 0;
}
.bank-row__value {
  font-size: 14px;
  color: var(--espresso);
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.modal__body { margin-bottom: 24px; }

.modal__copy {
  width: 100%;
  background: var(--espresso);
  color: var(--champagne);
  border: none;
  margin-bottom: 8px;
}
.modal__copy:hover { background: #2A1F16; }

.modal__feedback {
  text-align: center;
  font-size: 13px;
  color: var(--sage);
  letter-spacing: .08em;
}
.modal__feedback[hidden] { display: none; }
