*{box-sizing:border-box}
:root{
  --bg:#fff8fb;
  --bg-soft:#fff1f6;
  --text:#573846;
  --muted:#8f7080;
  --line:rgba(120,78,98,.14);
  --white:#ffffff;
  --pink:#f39ac1;
  --pink-dark:#de6fa7;
  --pink-soft:#ffddeb;
  --shadow:0 22px 60px rgba(190,110,150,.14);
}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:'Manrope',sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at top left, rgba(255,221,235,.75), transparent 28%),
    radial-gradient(circle at bottom right, rgba(255,240,246,.9), transparent 30%),
    var(--bg);
  overflow-x:hidden;
}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
.container{width:min(1140px, calc(100% - 32px)); margin:0 auto; position:relative; z-index:2}
.hero{
  min-height:100vh;
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  background:
    linear-gradient(180deg, rgba(20,10,16,.48), rgba(20,10,16,.62)),
    url('../img/hero-banner.jpg') center/cover no-repeat;
}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 18% 18%, rgba(255,255,255,.35), transparent 18%),
    radial-gradient(circle at 82% 10%, rgba(255,221,235,.24), transparent 22%);
  animation:heroGlow 10s ease-in-out infinite alternate;
}
@keyframes heroGlow{0%{opacity:.7;transform:scale(1)}100%{opacity:1;transform:scale(1.02)}}
.hero-overlay{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(12,8,11,.18), rgba(12,8,11,.34)),
    radial-gradient(circle at top right, rgba(255,255,255,.28), transparent 24%);
}
.nav,.hero-content,.hero-badges{position:relative;z-index:2}
.nav{display:flex;align-items:center;justify-content:space-between;padding:24px 0}
.top-logo-wrap{
  width:160px;height:56px;
  
  

  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.top-logo{max-width:90%;max-height:80%;object-fit:contain}
.nav-links{display:flex;gap:26px;list-style:none;margin:0;padding:0}
.nav-links a{color:#fff;text-transform:uppercase;letter-spacing:.12em;font-size:12px;font-weight:700}
.nav-toggle{display:none;border:0;background:transparent;color:#fff;font-size:28px}
.hero-content{text-align:center;padding:24px 0 70px}
.hero-photo-wrap{
  width:min(320px, 68vw); margin:0 auto 22px;
  border-radius:32px; overflow:hidden; box-shadow:0 28px 60px rgba(56,28,43,.24);
  border:4px solid rgba(255,255,255,.42);
  animation:floatMain 6s ease-in-out infinite;
}
@keyframes floatMain{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.hero-photo{width:100%; aspect-ratio:4/5; object-fit:cover}
.eyebrow{color:#fff;text-transform:uppercase;letter-spacing:.24em;font-size:12px;margin-bottom:12px}
h1,h2,h3{font-family:'Great Vibes',cursive;line-height:1.06;margin:0 0 16px;font-weight:400}
h1{font-size:clamp(62px,9vw,132px);color:#fff;animation:titleFloat 5s ease-in-out infinite}
@keyframes titleFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
h2{font-size:clamp(42px,6vw,78px)}
h3{font-size:40px}
p{margin:0 0 14px;line-height:1.8}
.hero-subtitle{width:min(820px,100%);margin:0 auto 26px;color:#fff;font-size:clamp(17px,2.1vw,22px)}
.hero-subtitle strong{font-weight:800}
.card{background:rgba(255,255,255,.8);border:1px solid rgba(255,255,255,.62);border-radius:30px;box-shadow:var(--shadow)}
.glass{backdrop-filter:blur(16px)}
.hero-event{
  width:min(900px,100%);margin:0 auto 6px;padding:22px;
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;
}
.hero-event div{padding:10px 8px}
.hero-event small{display:block;color:#8f7080;text-transform:uppercase;letter-spacing:.16em;margin-bottom:8px}
.hero-event strong{font-size:16px}
.hero-badges{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;padding:0 16px 26px}
.hero-badges span{
  color:#fff;border:1px solid rgba(255,255,255,.24);background:rgba(255,255,255,.12);
  border-radius:999px;padding:10px 14px;font-size:12px;letter-spacing:.08em;animation:badgePulse 4.5s ease-in-out infinite
}
.hero-badges span:nth-child(2){animation-delay:.5s}.hero-badges span:nth-child(3){animation-delay:1s}.hero-badges span:nth-child(4){animation-delay:1.5s}
@keyframes badgePulse{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
.section{padding:96px 0;position:relative}
.section-soft{background:var(--bg-soft)}
.section-label{text-transform:uppercase;letter-spacing:.22em;font-size:12px;color:var(--pink-dark);margin-bottom:12px}
.center{text-align:center}
.single-column{max-width:900px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center}
.text-card{padding:28px 32px}
.timeline{width:min(980px,100%);margin:40px auto 0;position:relative}
.timeline::before{
  content:"";position:absolute;left:118px;top:0;bottom:0;width:2px;
  background:linear-gradient(var(--pink-soft), rgba(243,154,193,.18))
}
.timeline-item{display:grid;grid-template-columns:90px 1fr;gap:28px;margin-bottom:22px}
.timeline-time{color:var(--pink-dark);font-weight:700;padding-top:26px}
.timeline-card{padding:24px 28px;position:relative;transition:transform .3s ease}
.timeline-card:hover{transform:translateY(-4px)}
.timeline-card::before{
  content:"";position:absolute;left:-38px;top:31px;width:12px;height:12px;border-radius:50%;
  background:var(--pink);box-shadow:0 0 0 10px rgba(243,154,193,.18)
}
.visual-board{padding:26px}
.palette{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}
.palette span{
  display:block;height:100px;border-radius:22px;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.04);animation:palettePop 5s ease-in-out infinite
}
.palette span:nth-child(2){animation-delay:.3s}.palette span:nth-child(3){animation-delay:.6s}.palette span:nth-child(4){animation-delay:.9s}
@keyframes palettePop{0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}
.dress-tags{display:flex;flex-wrap:wrap;gap:12px}
.dress-tags span{background:#fff;border:1px solid rgba(110,67,88,.1);border-radius:999px;padding:11px 16px;font-size:13px}
.gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:28px}
.gallery-item{overflow:hidden;padding:0}
.gallery-item img{
  width:100%;height:100%;aspect-ratio:4/5;object-fit:cover;
  transition:transform .6s ease, filter .6s ease;border-radius:30px
}
.gallery-item:hover img{transform:scale(1.06);filter:saturate(1.08)}
.map-card{overflow:hidden}
.map-card iframe{display:block;width:100%;height:420px;border:0}
.route-link-wrap{padding:16px}
.route-link{
  display:inline-flex;align-items:center;justify-content:center;
  padding:12px 18px;border-radius:999px;
  background:linear-gradient(135deg, var(--pink), var(--pink-dark));color:#fff;font-size:13px;font-weight:700
}
.footer{padding:36px 0;border-top:1px solid var(--line);background:#1a000d}
.footer-inner.center-footer{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}
.footer-logo-horizontal{width:min(100px, 80vw);height:auto;max-height:90px;object-fit:contain}
.footer-text{color:var(--muted);margin:0;text-align:center}
.music-toggle{
  position:fixed;right:16px;bottom:16px;width:50px;height:50px;border-radius:50%;border:0;
  background:linear-gradient(135deg, var(--pink), var(--pink-dark));color:#fff;
  box-shadow:0 12px 36px rgba(229,100,160,.32);z-index:60;cursor:pointer;animation:spinPulse 4s ease-in-out infinite
}
@keyframes spinPulse{0%,100%{transform:scale(1) rotate(0deg)}50%{transform:scale(1.06) rotate(8deg)}}
.cursor-glow{
  position:fixed;width:280px;height:280px;background:radial-gradient(circle, rgba(243,154,193,.16), transparent 62%);
  pointer-events:none;transform:translate(-50%,-50%);z-index:0
}
.floating-decor{
  position:fixed;border-radius:50%;filter:blur(6px);pointer-events:none;z-index:0;opacity:.46
}
.decor-1{width:100px;height:100px;top:14%;left:6%;background:radial-gradient(circle, rgba(243,154,193,.4), transparent 70%);animation:floaty 8s ease-in-out infinite}
.decor-2{width:140px;height:140px;top:58%;right:6%;background:radial-gradient(circle, rgba(255,221,235,.8), transparent 70%);animation:floaty 10s ease-in-out infinite reverse}
.decor-3{width:90px;height:90px;bottom:10%;left:18%;background:radial-gradient(circle, rgba(255,240,246,.9), transparent 70%);animation:floaty 7s ease-in-out infinite}
.decor-4{width:120px;height:120px;top:34%;right:20%;background:radial-gradient(circle, rgba(243,154,193,.26), transparent 70%);animation:floaty 9s ease-in-out infinite}
.petals{position:fixed;inset:0;pointer-events:none;z-index:1;overflow:hidden}
.petal{
  position:absolute;top:-40px;width:14px;height:20px;background:linear-gradient(180deg, #ffddeb, #f39ac1);
  border-radius:70% 70% 70% 70% / 60% 60% 80% 80%;opacity:.75;animation:fall linear forwards
}
@keyframes fall{to{transform:translateY(110vh) rotate(360deg);opacity:.15}}
@keyframes floaty{0%,100%{transform:translateY(0) translateX(0)}50%{transform:translateY(-18px) translateX(10px)}}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease, transform .8s ease}
.reveal.show{opacity:1;transform:translateY(0)}
@media (max-width: 960px){.two-col,.gallery-grid,.hero-event{grid-template-columns:1fr}}
@media (max-width: 760px){
  .nav-toggle{display:block}
  .nav-links{
    position:absolute;top:74px;right:0;flex-direction:column;background:rgba(86,40,62,.94);
    border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:16px;display:none;min-width:230px
  }
  .nav-links.open{display:flex}
  .timeline::before{display:none}
  .timeline-item{grid-template-columns:1fr}
  .timeline-card::before{display:none}
  .timeline-time{padding-top:0}
  .gallery-grid,.two-col,.hero-event{grid-template-columns:1fr}
}

.countdown{
display:flex;
gap:18px;
justify-content:center;
margin:20px auto 30px;
padding:16px 22px;
width:max-content;
}
.cd-item{
display:flex;
flex-direction:column;
align-items:center;
min-width:60px;
}
.cd-item span{
font-size:28px;
font-weight:700;
color:#de6fa7;
}
.cd-item small{
font-size:11px;
letter-spacing:.12em;
text-transform:uppercase;
color:#8f7080;
}