
:root{
  --cream:#f6eee4;
  --cream-2:#efe3d5;
  --green:#314637;
  --green-dark:#24342a;
  --sage:#9cab84;
  --rust:#c8633f;
  --magenta:#8f0f73;
  --ink:#1f2d23;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--cream);
  color:var(--green);
  font-family:'Cormorant Garamond',serif;
  overflow-x:hidden;
}
img{display:block;max-width:100%}
a{text-decoration:none;color:inherit}
button{font:inherit}
.site-shell{min-height:100vh;position:relative}
.section-pad{padding:84px 20px}
.container{width:min(100%,1160px);margin:0 auto;position:relative;z-index:2}
.narrow{width:min(100%,850px)}
.center{text-align:center}
.center-text{text-align:center}
.script{font-family:'Reenie Beanie',cursive;font-weight:400}
.overline{
  margin:0 0 .85rem;
  letter-spacing:.28em;
  text-transform:uppercase;
  font-size:.9rem;
  font-weight:700;
}
.rust{color:var(--rust)}
.cream{color:var(--cream)}
.section-title{
  margin:0;
  font-size:clamp(4rem,12vw,6.25rem);
  line-height:.9;
}
.section-header{
  max-width:780px;
  margin:0 auto 48px;
  text-align:center;
}
.section-header p:last-child{
  margin:1rem auto 0;
  max-width:650px;
  color:rgba(49,70,55,.76);
  font-size:1.2rem;
  line-height:1.6;
}
.bg-orbs{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  opacity:.08;
  overflow:hidden;
}
.bg-orbs span{
  position:absolute;
  border:1px solid var(--green);
  border-radius:999px;
}
.bg-orbs span:first-child{width:16rem;height:16rem;right:-3rem;top:0}
.bg-orbs span:last-child{width:22rem;height:22rem;left:-5rem;bottom:2rem}

.hero{
  position:relative;
  overflow:hidden;
  padding-top:54px;
}
.hero-grid{
  display:grid;
  gap:42px;
  align-items:center;
}
.hero-photo{
  position:relative;
}
.hero-photo-frame{
  width:min(100%,460px);
  margin:0 auto;
  border-radius:34px;
  padding:12px;
  background:rgba(255,255,255,.55);
  border:1px solid rgba(49,70,55,.1);
  box-shadow:0 22px 70px rgba(49,70,55,.12);
  backdrop-filter:blur(8px);
}
.hero-img{
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
  object-position:center;
  border-radius:26px;
  filter:saturate(1.02) contrast(1.04);
}
.hero-photo-overlay{
  position:absolute;
  inset:12px;
  border-radius:26px;
  background:
    radial-gradient(circle at 70% 20%, rgba(255,226,205,.18), transparent 26%),
    linear-gradient(to top, rgba(36,52,42,.18), rgba(36,52,42,.02) 42%);
  pointer-events:none;
}
.hero-photo-caption{
  position:absolute;
  left:28px;
  right:28px;
  bottom:28px;
  display:flex;
  justify-content:center;
}
.hero-photo-caption span{
  display:inline-block;
  padding:.65rem 1rem;
  border-radius:999px;
  background:rgba(246,238,228,.72);
  color:rgba(49,70,55,.82);
  backdrop-filter:blur(6px);
  font-size:1rem;
}
.hero-copy{text-align:center}
.hero-title{
  margin:0;
  font-size:clamp(5rem,17vw,8rem);
  line-height:.76;
}
.couple-title{
  margin:0;
  font-size:clamp(4rem,12vw,5.4rem);
  line-height:.9;
}
.soft-line{
  height:1px;
  width:100%;
  margin:2rem 0;
  background:linear-gradient(to right, transparent, rgba(49,70,55,.35), transparent);
}
.intro-text{
  max-width:37rem;
  margin:1.1rem auto 0;
  color:rgba(49,70,55,.78);
  font-size:1.28rem;
  line-height:1.65;
}
.button-row{
  display:flex;
  flex-direction:column;
  gap:.9rem;
  margin-top:2rem;
}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:3.2rem;
  padding:.85rem 1.4rem;
  border-radius:999px;
  transition:transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
  font-size:1.02rem;
  font-weight:700;
}
.btn:hover{transform:translateY(-2px)}
.btn-primary{
  background:var(--green);
  color:var(--cream);
  box-shadow:0 12px 26px rgba(49,70,55,.14);
}
.btn-primary:hover{background:var(--green-dark)}
.btn-outline{
  border:1px solid rgba(49,70,55,.22);
  color:var(--green);
  background:transparent;
}
.btn-outline:hover{background:rgba(49,70,55,.05)}
.btn-light{
  background:var(--cream);
  color:var(--magenta);
  margin-bottom:.85rem;
}
.btn-bank-outline{
  border:1px solid rgba(246,238,228,.42);
  color:var(--cream);
}
.btn-bank-outline:hover{background:rgba(255,255,255,.08)}
.pill{
  display:inline-block;
  margin-top:1.4rem;
  padding:.7rem 1.1rem;
  border-radius:999px;
  background:rgba(255,255,255,.5);
  border:1px solid rgba(49,70,55,.1);
  color:rgba(49,70,55,.75);
  font-size:1rem;
}

.green-section{
  position:relative;
  background:var(--sage);
  color:var(--cream);
  overflow:hidden;
}
.story-main{
  max-width:700px;
  margin:1.4rem auto 0;
  font-size:clamp(1.9rem,4vw,2.8rem);
  line-height:1.45;
}
.story-line{
  width:min(100%,260px);
  height:1px;
  margin:2.4rem auto;
  background:rgba(246,238,228,.45);
}
.story-closing{
  margin:0;
  font-size:clamp(3.2rem,9vw,4.8rem);
  line-height:.95;
}

.cards-grid{display:grid;gap:18px}
.two{grid-template-columns:1fr}
.small-gap{gap:14px}
.card{
  border-radius:30px;
  background:rgba(255,255,255,.48);
  border:1px solid rgba(49,70,55,.1);
  box-shadow:0 18px 55px rgba(49,70,55,.07);
}
.info-card{
  padding:2rem;
  text-align:center;
  transition:transform .18s ease, box-shadow .18s ease;
}
.info-card:hover{
  transform:translateY(-4px);
  box-shadow:0 24px 60px rgba(49,70,55,.1);
}
.mini-icon{
  width:3rem;height:3rem;
  border-radius:999px;
  margin:0 auto 1rem;
  display:grid;place-items:center;
  background:var(--green);
  color:var(--cream);
  font-size:1.2rem;
}
.info-card h3{
  margin:0;
  font-size:1.6rem;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:var(--rust);
}
.info-main{
  margin:1rem 0 .45rem;
  font-size:1.6rem;
  font-weight:700;
  color:var(--green);
}
.info-card p:not(.info-main){
  margin:0;
  color:rgba(49,70,55,.76);
  font-size:1.2rem;
  line-height:1.55;
}
.compact{margin-top:1.5rem}

.cream-section{background:var(--cream-2)}
.timeline{
  overflow:hidden;
  border-radius:30px;
  border:1px solid rgba(49,70,55,.1);
  background:rgba(255,255,255,.38);
  box-shadow:0 20px 55px rgba(49,70,55,.06);
}
.timeline-row{
  display:grid;
  grid-template-columns:7rem 1fr;
  align-items:center;
  border-bottom:1px solid rgba(49,70,55,.1);
}
.timeline-row:last-child{border-bottom:none}
.timeline-row strong{
  padding:1.1rem;
  text-align:center;
  background:rgba(49,70,55,.05);
  letter-spacing:.08em;
  font-size:1.15rem;
}
.timeline-row span{
  padding:1.1rem 1.2rem;
  font-size:1.24rem;
  color:var(--green);
}

.payment-grid{grid-template-columns:1fr}
.payment-card{padding:2rem}
.deadline{
  margin:0 0 1.4rem;
  font-size:1.16rem;
}
.price-box{
  border-radius:22px;
  padding:1.2rem;
  background:rgba(246,238,228,.72);
  border:1px solid rgba(49,70,55,.1);
}
.price-box h4{
  margin:0 0 .8rem;
  font-size:1.3rem;
}
.price-box p{
  margin:.35rem 0;
  color:rgba(49,70,55,.78);
  font-size:1.12rem;
}
.muted-note{
  margin:1.4rem 0 0;
  color:rgba(49,70,55,.68);
  font-size:1rem;
}
.bank-card{
  border-radius:30px;
  padding:2rem;
  background:var(--magenta);
  color:var(--cream);
  box-shadow:0 20px 55px rgba(143,15,115,.16);
}
.bank-card h3{
  margin:0;
  font-size:1.6rem;
  text-transform:uppercase;
  letter-spacing:.15em;
}
.bank-data{
  margin-top:1.4rem;
  padding:1.2rem 1.3rem;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.1);
}
.bank-data span{
  display:block;
  margin-bottom:.25rem;
  opacity:.76;
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:.85rem;
}
.bank-data strong{
  display:block;
  margin-bottom:1rem;
  font-size:1.65rem;
  font-weight:600;
}
.bank-data strong:last-child{margin-bottom:0}
.send-title{
  margin:1.35rem 0 1rem;
  font-size:1.16rem;
}

.faq-wrap{display:grid;gap:.9rem}
.faq-item{
  width:100%;
  text-align:left;
  background:rgba(246,238,228,.12);
  color:var(--cream);
  border:1px solid rgba(246,238,228,.2);
  border-radius:22px;
  padding:1.1rem 1.2rem;
  cursor:pointer;
  transition:background .18s ease, transform .18s ease;
}
.faq-item:hover{
  background:rgba(246,238,228,.17);
  transform:translateY(-1px);
}
.faq-item strong{
  display:block;
  font-size:1.2rem;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.faq-item span{
  display:none;
  margin-top:.7rem;
  color:rgba(246,238,228,.85);
  font-size:1.1rem;
  line-height:1.6;
}
.faq-item.open span{display:block}

.final-section{position:relative}
.illustration-shell{
  position:relative;
  width:min(100%,460px);
  margin:0 auto 1rem;
  opacity:0;
  transform:translateY(38px) scale(.96);
  transition:opacity .9s ease, transform .9s ease;
}
.illustration-shell.visible{
  opacity:1;
  transform:translateY(0) scale(1);
}
.illustration-glow{
  position:absolute;
  inset:auto 8% 8% 8%;
  height:48%;
  border-radius:999px;
  background:radial-gradient(circle, rgba(200,99,63,.22), rgba(200,99,63,0) 68%);
  filter:blur(28px);
  pointer-events:none;
}
.final-illustration{
  position:relative;
  z-index:2;
  width:100%;
  animation:floaty 4.5s ease-in-out infinite;
}
.spark{
  position:absolute;
  width:10px;height:10px;
  border-radius:999px;
  background:rgba(200,99,63,.75);
  box-shadow:0 0 14px rgba(200,99,63,.7);
  opacity:0;
  animation:sparkle 2.4s ease-in-out infinite;
}
.spark-1{top:16%;left:14%;animation-delay:.2s}
.spark-2{top:26%;right:18%;animation-delay:1s}
.spark-3{bottom:20%;right:12%;animation-delay:1.7s}
.thanks-text{
  max-width:700px;
  margin:1rem auto 0;
  color:rgba(49,70,55,.76);
  font-size:1.2rem;
  line-height:1.6;
}
.contact-links{
  margin-top:1.2rem;
  color:rgba(49,70,55,.8);
  font-size:1.06rem;
}
.contact-links a{
  text-decoration:underline;
  text-decoration-color:rgba(200,99,63,.45);
  text-underline-offset:4px;
}
.contact-links span{margin:0 .4rem}

.flower{
  position:absolute;
  z-index:1;
  width:min(30vw,240px);
  opacity:.7;
  pointer-events:none;
  filter:saturate(.95);
}
.flower-top-left{left:-3rem;top:1rem;transform:rotate(-8deg)}
.flower-top-right{right:-3rem;top:7rem;transform:scaleX(-1) rotate(16deg)}
.flower-mid-left{left:-2rem;bottom:2rem;transform:rotate(-14deg)}
.flower-mid-right{right:-2rem;top:3rem;transform:scaleX(-1) rotate(18deg)}

.reveal{animation:reveal .8s ease both}
.delay-1{animation-delay:.12s}

@keyframes reveal{
  from{opacity:0;transform:translateY(18px)}
  to{opacity:1;transform:none}
}
@keyframes floaty{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-7px)}
}
@keyframes sparkle{
  0%,100%{opacity:0;transform:scale(.5)}
  40%{opacity:1;transform:scale(1)}
  60%{opacity:.55;transform:scale(.7)}
}

@media (min-width:700px){
  .button-row{flex-direction:row;justify-content:center}
  .timeline-row{grid-template-columns:9rem 1fr}
  .two{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:900px){
  .hero-grid{grid-template-columns:.95fr 1.05fr}
  .hero-copy{text-align:left}
  .intro-text{margin-left:0}
  .button-row{justify-content:flex-start}
  .payment-grid{grid-template-columns:1.08fr .92fr}
}
