:root{
  --blush:#E9B9C3;
  --peach:#F2C7A5;
  --sage:#A9B7A3;
  --ivory:#FBF7F3;
  --ink:#2F2A2A;
  --gold:#CBB68A;
  --card: rgba(255,255,255,.80);
}

body{
  font-family: "Cormorant Garamond", serif;
  color: var(--ink);
  background: radial-gradient(1200px 800px at 50% -10%, #fff, var(--ivory));
  letter-spacing: .2px;
}

.nav-blur{
  backdrop-filter: blur(10px);
  background: rgba(255,255,255,.75);
  border-bottom: 1px solid rgba(203,182,138,.35);
}

.brand-script{
  font-family: "Great Vibes", cursive;
  font-size: 1.6rem;
  letter-spacing: .5px;
  color: var(--ink);
  text-decoration: none;
}

.btn-soft{
  --bs-btn-bg: rgba(233,185,195,.35);
  --bs-btn-border-color: rgba(203,182,138,.55);
  --bs-btn-hover-bg: rgba(233,185,195,.55);
  --bs-btn-hover-border-color: rgba(203,182,138,.75);
  --bs-btn-color: var(--ink);
  border-width: 1px;
  border-radius: 999px;
  padding: .65rem 1.1rem;
}

.hero{
  position: relative;
  min-height: 92vh;
  display: grid;
  place-items: center;
  overflow: hidden;
}

/* cathedral background + ivory wash */
.hero::before{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(to bottom, rgba(251,247,243,.68), rgba(251,247,243,.92)),
    url("../images/cathedral.jpg");
  background-size: cover;
  background-position: center 22%;
  transform: scale(1.02);
  z-index: 0;
}

/* floral overlay frame */
.hero::after{
  content:"";
  position:absolute; inset:0;
  background: url("../images/invite-frame-landscape.jpg");
  background-size: cover;
  background-position: center;
  opacity: .45;
  mix-blend-mode: multiply;
  z-index: 0;
  pointer-events: none;
}

/* Mobile */
@media (max-width: 768px){
  .hero::after{
    background-image: url("../images/invite-frame-portrait.jpg"); /* 2400x3200 */
    background-size: cover;
    background-position: center; /* portrait aligns naturally */
    opacity: .45;
    mix-blend-mode: normal;
    filter: saturate(1.1) contrast(1.05);
  }
}

.hero-card{
  position: relative;
  z-index: 1;
  width: min(900px, 92vw);
  background: var(--card);
  border: 1px solid rgba(203,182,138,.55);
  border-radius: 28px;
  box-shadow: 0 20px 60px rgba(47,42,42,.12);
  padding: clamp(1.25rem, 3vw, 2.25rem);
  text-align: center;
}

.hero-card .kicker{
  margin-bottom: 1.6rem;
}


.kicker{
  text-transform: uppercase;
  letter-spacing: .22em;
  font-size: .9rem;
  opacity: .85;
}

.names{
  font-family: "Great Vibes", cursive;
  font-size: clamp(3.1rem, 6vw, 4.6rem);
  line-height: 1.05;
  margin: .35rem 0 .75rem;
}

.gold-divider{
  width: min(520px, 80%);
  margin: 1rem auto;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(203,182,138,.95), transparent);
  position: relative;
}
.gold-divider::after{
  content:"";
  position:absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  width: 12px;
  height: 12px;
  border-radius: 999px;
  border: 1px solid rgba(203,182,138,.95);
  background: rgba(251,247,243,.9);
}

.section{
  padding: 4.5rem 0;
}

.section-title{
  font-family: "Great Vibes", cursive;
  font-size: 3rem;
  line-height: 1;
  margin-bottom: .25rem;
}

.section-sub{
  text-transform: uppercase;
  letter-spacing: .22em;
  font-size: .85rem;
  opacity: .8;
  margin-bottom: 1.5rem;
}

.section-tint{
  background: linear-gradient(to bottom, rgba(233,185,195,.10), rgba(242,199,165,.08));
}

.section-tint-2{
  background: linear-gradient(to bottom, rgba(169,183,163,.10), rgba(233,185,195,.08));
}

.info-card{
  background: rgba(255,255,255,.75);
  border: 1px solid rgba(203,182,138,.35);
  border-radius: 22px;
  padding: 1.25rem;
  height: 100%;
  box-shadow: 0 12px 30px rgba(47,42,42,.07);
}

.badge-soft{
  background: rgba(169,183,163,.22);
  border: 1px solid rgba(203,182,138,.35);
  color: var(--ink);
  border-radius: 999px;
  padding: .35rem .7rem;
  font-size: .85rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.embed{
  background: rgba(255,255,255,.8);
  border: 1px solid rgba(203,182,138,.35);
  border-radius: 22px;
  padding: 1rem;
  min-height: 420px;
}

.footer{
  position: relative;
  padding: 4rem 0 3rem;
  overflow: hidden;
  border-top: 1px solid rgba(203,182,138,.35);
  background: linear-gradient(to bottom, rgba(251,247,243,.9), rgba(251,247,243,1));
}
.footer::before{
  content:"";
  position:absolute; inset:0;
  background: url("../images/invite-frame.png");
  background-size: cover;
  background-position: center;
  opacity: .18;
  pointer-events:none;
}

.rsvp-form{
  max-width: 750px;
  margin: auto;
}

.rsvp-form fieldset{
  border: 1px solid rgba(203,182,138,.35);
  padding: 2rem;
  border-radius: 20px;
  background: rgba(255,255,255,.75);
}

.rsvp-form legend{
  font-family: "Great Vibes", cursive;
  font-size: 2rem;
}

.form-control,
.form-select{
  border-radius: 12px;
  border: 1px solid rgba(203,182,138,.45);
  padding: .7rem .9rem;
}

.form-control:focus,
.form-select:focus{
  border-color: #CBB68A;
  box-shadow: 0 0 0 .2rem rgba(203,182,138,.25);
}

/* Remove Bootstrap green validation */
.form-control.is-valid,
.form-select.is-valid,
textarea.is-valid {
  border-color: rgba(203,182,138,.45) !important;
  box-shadow: none !important;
}

/* Soft blush invalid styling */
.form-control.is-invalid,
.form-select.is-invalid,
textarea.is-invalid {
  border-color: rgba(233,185,195,.8) !important;
  box-shadow: 0 0 0 .15rem rgba(233,185,195,.18) !important;
  background-image: none !important;
}

/* Hide attendance error by default */
#attendance-error {
  display: none;
}

.map-wrap {
  width: 100%;
  height: 420px; /* desktop height */
  border-radius: 24px;
  overflow: hidden;
}

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

/* Taller on large screens */
@media (min-width: 992px) {
  .map-wrap {
    height: 520px;
  }
}

/* Slightly shorter on mobile */
@media (max-width: 576px) {
  .map-wrap {
    height: 340px;
  }
}