:root{
  --burgundy:#6b1e2b;
  --burgundy-deep:#4a121f;
  --wine:#3a0f18;
  --wine-deep:#210911;
  --beige:#efe3ca;
  --beige-light:#f8f2e4;
  --gold:#c6a15b;
  --gold-soft:#e2c98a;
  --gold-bright:#ffcd54;
  --white:#fffdf8;
  --black:#1c1712;
  --near-black:#0f0b09;
  --text-muted:rgba(232,217,189,0.68);
  --ok-color:#a8cf9a;
  --err-color:#e8987a;
  --shadow: 0 20px 60px rgba(28,23,18,0.25);
  --glow-shadow: 0 20px 50px rgba(0,0,0,0.45), 0 0 40px rgba(198,161,91,0.12);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'Jost',sans-serif;
  background:var(--near-black);
  color:var(--beige);
  overflow-x:hidden;
}
.serif{font-family:'Playfair Display',serif;}
.script{font-family:'Great Vibes',cursive;}
.eyebrow{
  font-family:'Jost',sans-serif;
  letter-spacing:0.35em;
  text-transform:uppercase;
  font-size:0.72rem;
  font-weight:500;
  color:var(--gold-soft);
}
a{color:inherit;}

.grain{
  position:fixed; inset:0; pointer-events:none; z-index:9998;
  opacity:0.06; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ==================================================
   GATE PAGE (index.html)
================================================== */
#gate{
  position:fixed; inset:0; z-index:9999; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  background-color:#050302;
  background-image:
    linear-gradient(rgba(10,6,5,0.28), rgba(10,6,5,0.42)),
    url('assets/gate-background.jpg');
  background-position:center center;
  background-repeat:no-repeat;
  background-size:cover;
  transition:transform 1.1s cubic-bezier(.7,0,.2,1), opacity 1.1s ease;
}
/* On tall/narrow (portrait) screens, "cover" on the landscape photo would
   zoom into the empty center and crop away the flowers on both sides —
   swap in a 90°-rotated version so the dense floral bands sit at the
   top and bottom of the screen instead. */
@media (max-aspect-ratio: 1/1){
  #gate{
    background-image:
      linear-gradient(rgba(10,6,5,0.28), rgba(10,6,5,0.42)),
      url('assets/gate-background-mobile.jpg');
  }
}
#gate.open{ transform:translateY(-100%); opacity:0.4; }

.gate-decor{ position:absolute; inset:0; pointer-events:none; z-index:1; overflow:hidden; }

/* --- twinkling gold sparkles (accent on top of the photo's built-in glitter) --- */
.spark{
  position:absolute; width: 8px; height: 8px; border-radius:50%;
  background:var(--gold-bright); box-shadow:0 0 8px 2px rgba(255, 191, 43, 0.8);
  animation:twinkle 3.2s ease-in-out infinite;
}
@keyframes twinkle{
  0%,100%{ opacity:0.15; transform:scale(0.7); }
  50%{ opacity:1; transform:scale(1.3); }
}

/* --- golden glow trail left behind each flying butterfly --- */
.trail-dot{
  position:fixed; border-radius:50%; pointer-events:none; z-index:2;
  background:radial-gradient(circle, rgba(255, 182, 11, 0.95) 0%, rgba(255, 189, 34, 0.6) 45%, rgba(244,217,152,0) 75%);
  mix-blend-mode:screen;
  z-index: 1;
  animation:trailFade 1.1s ease-out forwards;
  will-change:opacity, transform;
}
@keyframes trailFade{
  0%{ opacity:0.85; transform:scale(1); }
  100%{ opacity:0; transform:scale(0.2); }
}

/* --- real photographed butterflies, screen-blended so the black backdrop disappears --- */
.butterfly-img{
  position:absolute;
  mix-blend-mode:screen;
  animation:flutter 7s ease-in-out infinite;
  z-index: 2;
  /* filter:drop-shadow(0 0 10px rgba(244,217,152,0.35)); */
}
@keyframes flutter{
  0%{ transform:translate(0,0) rotate(0deg) scale(1); }
  25%{ transform:translate(-10px,-16px) rotate(-4deg) scale(1.02); }
  50%{ transform:translate(4px,-28px) rotate(3deg) scale(1); }
  75%{ transform:translate(10px,-12px) rotate(5deg) scale(1.01); }
  100%{ transform:translate(0,0) rotate(0deg) scale(1); }
}
.bf1{ width:110px; top:6%; left:3%; animation-duration:8s; }
.bf2{ width:70px; top:36%; left:1%; animation-duration:6.5s; animation-delay:1.2s; }
.bf3{ width:130px; top:66%; left:4%; animation-duration:7.5s; animation-delay:0.6s; }
.bf4{ width:60px; top:20%; right:4%; animation-duration:6.8s; animation-delay:1.8s; }
.bf5{ width:90px; top:44%; right:2%; animation-duration:9s; animation-delay:2.4s; }
.bf6{ width:120px; top:70%; right:3%; animation-duration:7s; animation-delay:0.3s; }

.gate-content{
  position:relative; z-index:2;
  width:min(440px, 88vw);
  text-align:center;
  animation:float 6s ease-in-out infinite;
}
@keyframes float{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-8px); } }

.monogram-glow{
  font-family:'Playfair Display',serif; font-weight:700; font-style:italic;
  font-size:clamp(3rem,8vw,4rem);
  background:linear-gradient(150deg, #fff6d8 0%, var(--gold-bright) 30%, var(--gold) 65%, #8a6a2f 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  text-shadow:
    0 0 14px rgba(244,217,152,0.85),
    0 0 34px rgba(244,217,152,0.5),
    0 0 70px rgba(198,161,91,0.35);
  margin-bottom:18px;
  transition:transform .6s cubic-bezier(.7,0,.2,1), text-shadow .6s ease;
}
.monogram-glow img{
  display: inline-block;
  width: 150px;
}
.monogram-glow.crack{
  transform:scale(1.12);
  text-shadow:
    0 0 20px rgba(244,217,152,1),
    0 0 50px rgba(244,217,152,0.8),
    0 0 100px rgba(198,161,91,0.6);
}

.gate-title{
  font-size:0.68rem; letter-spacing:0.4em; text-transform:uppercase; color:var(--gold-soft);
  margin-bottom:14px; opacity:0.95;
}
.flourish{
  width:200px; height:35px; margin:0 auto 18px; opacity:0.85;
  background-image: url('assets/svg_line-decor-gold.svg');
  background-repeat:no-repeat; background-position:center; background-size:contain;
}
.gate-heading{
  font-size:clamp(1.5rem,4.4vw,1.9rem); line-height:1.25; margin-bottom:2px; color:var(--beige-light);
  font-weight:400;
}
.gate-heading .script{
  display:block; font-size:2.5em; color:var(--gold-bright); line-height:1;
  font-family: "Pinyon Script", cursive;
  margin:4px 0 2px;
  text-shadow:0 0 18px rgb(255 197 58 / 50%);
}
.gate-sub{ font-size:1.2rem; color:var(--gold-soft); margin-bottom:16px; font-style:italic; }

.pw-form{ display:flex; flex-direction:column; gap:16px; align-items:center; }

.btn{
  font-family:'Jost',sans-serif; letter-spacing:0.28em; text-transform:uppercase;
  font-size:0.75rem; font-weight:600; padding:16px 30px;
  /* background:linear-gradient(160deg, #7a2434 0%, var(--burgundy) 55%, var(--burgundy-deep) 100%); */
  background: var(--burgundy-deep);
  color:var(--gold-bright); border:1px solid rgba(198, 161, 91, 0.45); border-radius:999px;
  cursor:pointer; transition:all .35s ease; width:100%;
  box-shadow:0 10px 26px rgba(0,0,0,0.35);
}
.btn:hover{ filter:brightness(1.15); letter-spacing:0.32em; }
.btn:active{ transform:scale(0.98); }
.btn-gate{
  appearance: none;
  background: transparent;
  background-image: url('assets/gate-btn.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  border: none;
  width: min(300px, 78vw);
  aspect-ratio: 860 / 160;
  height: auto;
  font-family: 'Playfair Display', serif;
  font-size: 18px;
  color: var(--gold-bright);
  text-transform: uppercase;
  letter-spacing: 2.5px;
  cursor: pointer;
}

/* ==================================================
   MAIN SITE (main.html)
================================================== */
section{ position:relative; padding:110px 24px; }
.wrap{ max-width:920px; margin:0 auto; position:relative; z-index:1; }

.ornament{ width:1px; height:56px; background:linear-gradient(var(--gold), transparent); margin:0 auto; position:relative; opacity:0.7; }
.ornament::before{
  content:""; position:absolute; left:-12px; top:-30%; transform:translate(-50%,-50%);
  width:26px; height:26px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cg fill='%23c6a15b'%3E%3Cpath d='M32 30c-4-14-16-20-22-16-5 4-3 16 8 20 6 2 12 0 14-4z'/%3E%3Cpath d='M32 30c4-14 16-20 22-16 5 4 3 16-8 20-6 2-12 0-14-4z'/%3E%3Cpath d='M32 34c-4 12-15 18-21 14-5-3-3-14 7-18 6-2 11 0 14 4z'/%3E%3Cpath d='M32 34c4 12 15 18 21 14 5-3 3-14-7-18-6-2-11 0-14 4z'/%3E%3Crect x='30' y='26' width='4' height='16' rx='2'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:center; background-size:contain;
  animation:iconFloat 4.5s ease-in-out infinite;
}

/* --- scroll reveal --- */
[data-reveal]{
  opacity:0; transform:translateY(28px);
  transition:opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1);
}
[data-reveal].in{ opacity:1; transform:translateY(0); }
[data-reveal="fade"]{ transform:translateY(0); }
[data-reveal-delay="1"]{ transition-delay:.12s; }
[data-reveal-delay="2"]{ transition-delay:.24s; }
[data-reveal-delay="3"]{ transition-delay:.36s; }
[data-reveal-delay="4"]{ transition-delay:.48s; }

/* ---------- shared section heading + lead paragraph (was repeated inline everywhere) ---------- */
.section-heading{
  font-weight: 300;
  font-size:clamp(1.8rem,4vw,2.4rem); margin-top:10px; color:var(--gold-bright);
  text-shadow:0 0 18px rgb(255 197 58 / 50%);
}
.section-lead{ max-width:520px; margin:14px auto 0; color:var(--text-muted); }
.section-lead.narrow{ max-width:420px; }
.section-intro{ text-align:center; }

/* ambient glow bloom behind headings — a slow "breathing" light source */
.glow-bloom{ position:relative; }
.glow-bloom::before{
  content:""; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:340px; height:220px; max-width:80vw;
  background:radial-gradient(ellipse, rgba(255,205,84,0.16) 0%, rgba(255,205,84,0) 70%);
  animation:breathe 6s ease-in-out infinite; pointer-events:none; z-index:-1;
}
@keyframes breathe{
  0%,100%{ opacity:0.6; transform:translate(-50%,-50%) scale(0.92); }
  50%{ opacity:1; transform:translate(-50%,-50%) scale(1.08); }
}

/* gentle idle float for small icons — distinct from the hover scale effect */
@keyframes iconFloat{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-7.5px); }
}

/* ---------- ambient decor (main site) ----------
   Sparks and butterflies scattered per-section, sitting behind the
   content but above the section background — same idea as the gate
   page, tuned down (smaller, dimmer, fewer) so it reads as ambience
   rather than competing with the text and cards. */
.ambient-decor{ position:absolute; inset:0; pointer-events:none; overflow:hidden; z-index:0; }
.ambient-decor .butterfly-img{ opacity:0.5; }
.mbf1{ width:64px; top:14%; left:8%; animation-duration:9s; }
.mbf2{ width:52px; top:66%; right:9%; animation-duration:7.5s; animation-delay:1.4s; }
.mbf3{ width:58px; top:20%; right:7%; animation-duration:8.5s; animation-delay:0.7s; }
.mbf4{ width:56px; top:70%; left:7%; animation-duration:8s; animation-delay:2s; }
.mbf5{ width:64px; top:35%; right:8%; animation-duration:8s; animation-delay:2s; }
.mbf6{ width:80px; top:70%; left:8%; animation-duration:6s; animation-delay:1s; }

/* ---------- HERO ---------- */
#hero{
  min-height:100svh; display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; position:relative; overflow:hidden;
  background-color:#050302;
  background-image:
    linear-gradient(rgba(10,6,5,0.28), rgba(10,6,5,0.42)),
    url('assets/main-background.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  padding-top:60px;
}
#hero > *:not(.ambient-decor){ position:relative; z-index:1; }

@media (max-aspect-ratio: 1/1){
  #hero{
    background-image:
      linear-gradient(rgba(10,6,5,0.28), rgba(10,6,5,0.42)),
      url('assets/main-background-mobile.jpg');
    padding-top: 0;
  }
}
.hero-eyebrow{ margin-bottom:24px; }
.hero-names{
  font-family: "Pinyon Script", cursive;
  font-size:clamp(2rem, 10vw, 5rem);
  color:var(--gold-bright); line-height:1; margin-bottom:6px;
  text-shadow:0 0 40px rgba(255,205,84,0.25), 0 0 80px rgba(255,205,84,0.12);
  animation: iconFloat 5s ease-in-out infinite;
}
.hero-names img {
  max-width: 90%;
}
.hero-date{
  font-family:'Jost',serif; font-weight:300; letter-spacing:0.3em;
  font-size:clamp(1rem,3vw,1rem); color:var(--beige-light); margin:20px 0 30px;
}
.hero-line{ max-width:480px; margin:0 auto 40px; color:var(--text-muted); font-size:1.02rem; line-height:1.7; }
.scroll-cue{
  margin-top:10px; font-size:0.68rem; letter-spacing:0.3em; text-transform:uppercase;
  color:var(--gold-soft); opacity:0.7; animation:bob 2.4s ease-in-out infinite;
}
@keyframes bob{ 0%,100%{transform:translateY(0);} 50%{transform:translateY(8px);} }

/* ---------- DATE / SAVE ---------- */
#savedate{
  background:
    radial-gradient(circle at 50% 30%, rgba(255,205,84,0.08), transparent 65%),
    var(--wine-deep);
  color:var(--beige-light); text-align:center; overflow:hidden; position:relative;
}
#savedate .eyebrow{ color:var(--gold-soft); }
.savedate-heading{ 
  font-family:'Playfair Display',serif; 
  font-weight: 300;
  font-size:clamp(2.6rem,8vw,4.2rem); margin:15px 0 20px; color:var(--beige-light); 
}
.savedate-big{
  font-family:'Playfair Display',serif; 
  font-weight:300; 
  font-size:clamp(2.2rem,6vw,3.4rem);
  letter-spacing:0.05em; color:var(--gold-bright); margin-top:0;
  text-shadow:0 0 30px rgba(255,205,84,0.25);
}
.savedate-day{ 
  font-family:'Jost',serif; 
  font-style:italic; font-weight:400; font-size:0.5em; display:block; color:var(--gold-soft); }

/* ---------- COUNTDOWN ---------- */
#countdown{ 
  text-align:center; 
  background-color:var(--near-black); 
  background-image:
    linear-gradient(rgba(10,6,5,0.28), rgba(10,6,5,0.42)),
    url('assets/img_butterfly-background.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.cd-grid{ display:flex; flex-wrap:wrap; justify-content:center; gap:18px; margin-top:44px; }
.cd-cell{
  width:118px; padding:26px 10px 20px;
  background:linear-gradient(160deg, rgba(58,15,24,0.6), rgba(15,11,9,0.75));
  border:1px solid rgba(198,161,91,0.45);
  box-shadow:var(--glow-shadow); position:relative; transition:transform .35s ease, box-shadow .35s ease;
  animation:cellGlow 5s ease-in-out infinite;
}
.cd-cell:nth-child(2){ animation-delay:.4s; }
.cd-cell:nth-child(3){ animation-delay:.8s; }
.cd-cell:nth-child(4){ animation-delay:1.2s; }
.cd-cell:hover{ transform:translateY(-5px); }
@keyframes cellGlow{
  0%,100%{ box-shadow:var(--glow-shadow); border-color:rgba(198,161,91,0.45); }
  50%{ box-shadow:0 20px 50px rgba(0,0,0,0.45), 0 0 26px rgba(255,205,84,0.22); border-color:rgba(255,205,84,0.7); }
}
.cd-cell::before{ content:""; position:absolute; inset:6px; border:1px solid rgba(198,161,91,0.25); pointer-events:none; }
.cd-num{
  font-family:'Jost',sans-serif; font-weight:700; font-size:2.5rem; color:var(--white); line-height:1;
  display:inline-block; text-shadow:0 0 18px rgba(255,205,84,0.3);
}
.cd-num.tick{ animation:tick .5s ease; }
@keyframes tick{ 0%{ transform:translateY(-8px); opacity:0.4;} 100%{ transform:translateY(0); opacity:1;} }
.cd-label{ margin-top:10px; font-size:0.66rem; letter-spacing:0.24em; text-transform:uppercase; color:var(--text-muted); }

/* ---------- VENUE ---------- */
#venue{
  background:
    radial-gradient(circle at 15% 20%, rgba(255,205,84,0.06), transparent 40%),
    radial-gradient(circle at 85% 80%, rgba(255,205,84,0.06), transparent 40%),
    var(--wine-deep);
}
.venue-grid{ 
  display:grid; grid-template-columns:1fr 1fr; 
  gap:2px; 
  margin-top:30px; 
  background: transparent;
}
.venue-card{
  background: transparent;
  padding:48px 34px; 
  text-align:center; 
  transition:background .4s ease, transform .4s ease, box-shadow .4s ease;

  @media (max-width:480px){
    padding: 30px 25px; 
  }
}
.venue-card:hover{ background:linear-gradient(160deg, rgba(58,15,24,0.9), rgba(15,11,9,0.95)); transform:translateY(-4px); box-shadow:0 20px 50px rgba(0,0,0,0.4); }
.venue-img {
  display: inline-block;
  max-width: 100%;
  height: auto;
  margin: 0 auto 15px;
  transition: transform .4s ease;
  animation: iconFloat 5s ease-in-out infinite;
}
.venue-card:hover .venue-img{ transform:scale(1.08) rotate(-2deg); }
.venue-kind{ font-size:0.68rem; letter-spacing:0.3em; text-transform:uppercase; color:var(--gold); margin-bottom:10px; }
.venue-name{ font-size:1.5rem; margin-bottom:12px; color:var(--beige-light); }
.venue-addr{ color:var(--text-muted); font-size:0.95rem; line-height:1.6; margin-bottom:18px; }
.venue-time{
  display:inline-block; font-family:'Playfair Display',serif; font-style:italic; font-size:1.05rem;
  color:var(--gold-soft); border-top:1px solid rgba(198,161,91,0.4); padding-top:14px;
}
.venue-map{
  display:inline-block; margin-top:18px; font-size:0.72rem; letter-spacing:0.2em; text-transform:uppercase;
  color:var(--gold-bright); text-decoration:none; border-bottom:1px solid var(--gold); padding-bottom:2px;
  transition:letter-spacing .3s ease;
}
.venue-map:hover{ letter-spacing:0.32em; }

/* ---------- ATTIRE ---------- */
#attire{ 
  background:var(--near-black); 
  background-image:
    linear-gradient(rgba(10,6,5,0.28), rgba(10,6,5,0.42)),
    url('assets/img_butterfly-background.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  text-align:center; 
}
.swatch-row{
  display:flex; justify-content:center; flex-wrap:wrap; gap:22px; margin:44px 0 56px;
}
.swatch{ 
  display:flex; flex-direction:column; align-items:center; gap:10px; 
  width: 100%;
  max-width: 65px;
}
@media (max-width:480px){
  .swatch {
    max-width: 100px;
  }
}
.swatch-dot{
  width:46px; height:46px; border-radius:50%; border:1px solid rgba(198,161,91,0.4);
  box-shadow:var(--glow-shadow); transition:transform .35s ease, box-shadow .35s ease;
}
.swatch:hover .swatch-dot{ transform:translateY(-6px) scale(1.06); box-shadow:0 20px 50px rgba(0,0,0,0.4), 0 0 24px rgba(255,205,84,0.25); }
.swatch-label{ font-size:0.64rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--text-muted); }

.attire-grid{
  display:grid; grid-template-columns:repeat(2, 1fr); gap:2px; background:rgba(198,161,91,0.35);
}
.attire-card{
  background:linear-gradient(160deg, rgba(33,9,17,0.85), rgba(15,11,9,0.95));
  padding:44px 22px; text-align:center; transition:background .4s ease, transform .4s ease;
}
.attire-card:hover{ background:linear-gradient(160deg, rgba(58,15,24,0.9), rgba(15,11,9,0.95)); transform:translateY(-4px); }
.attire-for{ font-size:0.62rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); margin-bottom:8px; }
.attire-role{ font-size:1.1rem; margin-bottom:10px; color:var(--gold-bright); }
.attire-desc{ color:var(--text-muted); font-size:0.88rem; line-height:1.6; }
.attire-note{
  max-width:560px; margin:44px auto 0; font-size:0.92rem; color:var(--text-muted); font-style:italic; line-height:1.7;
}

@media (max-width:820px){
  .attire-grid{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width:480px){
  .attire-grid{ grid-template-columns:1fr; }
}

/* ---------- GIFTS ---------- */
#gifts{
  background:
    radial-gradient(circle at 50% 30%, rgba(255,205,84,0.08), transparent 65%),
    var(--wine-deep);
  color:var(--beige-light); text-align:center; overflow:hidden; position:relative;
}
#gifts .eyebrow{ color:var(--gold-soft); }
.gifts-heading{ 
  font-family:'Playfair Display',serif; 
  font-weight: 300;
  font-size:clamp(2rem,6vw,3rem); margin:15px 0 20px; color:var(--beige-light); 
}
.gifts-big{
  font-family:'Playfair Display',serif; 
  font-weight:300; 
  font-size:clamp(2.2rem,6vw,3.4rem);
  letter-spacing:0.05em; color:var(--gold-bright); margin-top:0;
  text-shadow:0 0 30px rgba(255,205,84,0.25);
}
.gifts-day{ 
  font-family: 'Playfair Display', serif;
  font-style:italic; font-weight:400; font-size:0.4em; display:block; color:var(--gold-soft); }

/* ---------- RSVP ---------- */
#rsvp{
  text-align:center;
  background:var(--near-black); 
  background-image:
    linear-gradient(rgba(10,6,5,0.60), rgba(10,6,5,0.90)),
    url('assets/img_rsvp-background.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  text-align:center; 
}
#rsvp .section-heading {
  font-size: clamp(1.8rem, 4vw, 3.4rem);
}
.rsvp-card{
  max-width:480px; margin:50px auto 0;
  background:linear-gradient(160deg, rgba(20,12,10,0.85), rgba(15,11,9,0.92));
  border:1px solid rgba(198,161,91,0.45);
  padding:48px 40px; box-shadow:var(--glow-shadow); position:relative; transition:box-shadow .4s ease;
  backdrop-filter:blur(3px);
}
.rsvp-card:hover{ box-shadow:0 26px 70px rgba(0,0,0,0.5), 0 0 40px rgba(255,205,84,0.15); }
.rsvp-card::before{ content:""; position:absolute; inset:8px; border:1px solid rgba(198,161,91,0.25); pointer-events:none; }
.field{ text-align:left; margin-bottom:22px; }
.field label{ display:block; font-size:0.68rem; letter-spacing:0.22em; text-transform:uppercase; color:var(--gold-soft); margin-bottom:8px; }
.field input, .field select{
  width:100%; font-family:'Jost',sans-serif; font-size:0.98rem; padding:12px 14px;
  border:none; border-bottom:1px solid rgba(198,161,91,0.5); background:transparent; outline:none; color:var(--beige-light);
  transition:border-color .3s ease;
}
.field input::placeholder{ color:rgba(232,217,189,0.35); }
.field input:focus, .field select:focus{ border-bottom-color:var(--gold-bright); }
#rsvpMsg{ margin-top:18px; font-size:0.88rem; min-height:20px; transition:opacity .4s ease; }
#rsvpMsg.ok{ color:var(--ok-color); }
#rsvpMsg.err{ color:var(--err-color); }

/* ---------- FOOTER ---------- */
footer{ background:var(--near-black); color:var(--beige); text-align:center; padding:15px 24px 15px; border-top:1px solid rgba(198,161,91,0.15); }
footer .credit{ font-family:'Jost',sans-serif; font-size:0.8rem; letter-spacing:0.1em; color:var(--text-muted); }

/* ---------- MUSIC PLAYER ---------- */
#musicToggle{
  position:fixed; bottom:20px; right:20px; z-index:500; width:104px; height:104px;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
}
#circle{
  position:absolute; inset:0; width:100%; height:100%;
  animation:ringSpin 12s linear infinite; pointer-events:none;
}
#circle svg{ width:100%; height:100%; display:block; }
@keyframes ringSpin{ to{ transform:rotate(360deg); } }

.disc{
  width:100px; height:100px; border-radius:50%; position:relative;
  filter:drop-shadow(0 10px 20px rgba(0,0,0,0.5)) drop-shadow(0 0 16px rgba(255,205,84,0.15));
  transition:transform .3s ease;
}
#musicToggle:hover .disc{ transform:scale(1.06); }
#musicToggle.nudge .disc{ animation:musicNudge 1.8s ease-in-out infinite; }
@keyframes musicNudge{
  0%,100%{ filter:drop-shadow(0 10px 20px rgba(0,0,0,0.5)) drop-shadow(0 0 16px rgba(255,205,84,0.15)); }
  50%{ filter:drop-shadow(0 10px 20px rgba(0,0,0,0.5)) drop-shadow(0 0 24px rgba(255,205,84,0.55)); }
}
.disc.spin{ animation:spin 3.2s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg); } }

@media (max-width:720px){
  .venue-grid{ grid-template-columns:1fr; }
  section{ padding:80px 20px; }
}
@media (prefers-reduced-motion:reduce){
  *{ animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; }
}