@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600;700&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{--bg:#170506;--panel:#21090a;--cream:#f6e8cf;--gold:#d9a441;--red:#8e2828;--muted:#d4c1aa}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#090304;color:var(--cream);font-family:'DM Sans',sans-serif}a{color:inherit;text-decoration:none}
body.locked{overflow:hidden}.page{max-width:720px;margin:auto;background:var(--bg);min-height:100vh;position:relative;overflow:hidden;box-shadow:0 0 80px #000}
.hero{min-height:100svh;position:relative;display:flex;align-items:center;justify-content:center;padding:70px 25px 115px;background:#170506;overflow:hidden}
.hero-bg{position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,3,4,.25),rgba(15,3,4,.82)),var(--hero-image,linear-gradient(135deg,#5e302b,#160506));background-size:cover;background-position:center;transform:scale(1.05);animation:slowzoom 12s ease-in-out infinite alternate}
@keyframes slowzoom{to{transform:scale(1.13)}}.hero:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 35%,transparent 0 25%,rgba(0,0,0,.3) 75%,rgba(0,0,0,.7))}
.ornament-top,.ornament-bottom{position:absolute;left:0;width:100%;z-index:3;opacity:.95}.ornament-top{top:0}.ornament-bottom{bottom:0;transform:rotate(180deg)}
.corner{position:absolute;width:150px;z-index:4;opacity:.8}.corner.tl{top:10px;left:0}.corner.tr{top:10px;right:0;transform:scaleX(-1)}.corner.bl{bottom:65px;left:0;transform:scaleY(-1)}.corner.br{bottom:65px;right:0;transform:scale(-1)}
.hero-content{position:relative;z-index:5;text-align:center;max-width:650px}.eyebrow{letter-spacing:.45em;font-size:12px;color:#e7c77d;text-transform:uppercase;margin-bottom:25px}.title{font-family:'Cormorant Garamond',serif;font-size:clamp(60px,14vw,105px);line-height:.78;margin:0;font-weight:600;text-transform:uppercase;letter-spacing:.02em;text-shadow:0 8px 35px #000}.amp{color:var(--gold);font-size:.72em;display:block;margin:18px 0}.subtitle{font-family:'Cormorant Garamond',serif;font-size:22px;font-style:italic;margin:28px 0 8px}.date{letter-spacing:.35em;color:#e8c66f;font-size:14px}.guest-card{margin:32px auto 20px;padding:18px 25px;background:rgba(30,6,8,.58);border:1px solid rgba(217,164,65,.55);border-radius:20px;backdrop-filter:blur(8px);max-width:430px}.guest-card strong{font-size:20px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:999px;padding:16px 30px;background:linear-gradient(135deg,#f1c66d,#b77c25);color:#24100b;font-weight:700;font-size:16px;cursor:pointer;box-shadow:0 10px 35px rgba(217,164,65,.22);transition:.25s}.btn:hover{transform:translateY(-2px)}
.section{position:relative;padding:90px 22px;background:var(--bg)}.section.alt{background:#200809}.section-inner{max-width:650px;margin:auto;text-align:center}.kicker{color:#d9a441;text-transform:uppercase;letter-spacing:.35em;font-size:11px}.heading{font-family:'Cormorant Garamond',serif;font-size:52px;line-height:.9;margin:15px 0 22px}.body{color:var(--muted);font-size:16px;line-height:1.9}.divider{display:flex;align-items:center;gap:18px;justify-content:center;margin:30px 0}.divider:before,.divider:after{content:"";height:1px;background:#9e702d;width:100px}.divider span{color:#d9a441;font-size:24px}
.couple{display:grid;grid-template-columns:1fr 1fr;gap:16px}.person{background:#1b0708;border:1px solid #5f3a20;border-radius:22px;padding:12px;overflow:hidden}.person img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:16px}.person h3{font-family:'Cormorant Garamond';font-size:28px;margin:12px 0 2px}.person p{color:#bda88f;margin:0 0 8px}
.countdown{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:28px 0}.timebox{background:#1d0809;border:1px solid #68461f;border-radius:14px;padding:14px 4px}.timebox b{display:block;font-family:'Cormorant Garamond';font-size:34px;color:#f0cb77}.timebox span{font-size:10px;color:#bca78e;text-transform:uppercase}
.event{background:#1d0809;border:1px solid #68461f;border-radius:22px;padding:24px;margin:14px 0;text-align:left}.event h3{font-family:'Cormorant Garamond';font-size:30px;margin:0 0 8px}.event p{color:#cbb79f;line-height:1.7}.event .btn{padding:11px 18px;font-size:13px}
.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.gallery img{width:100%;aspect-ratio:1/1.2;object-fit:cover;border-radius:14px;border:1px solid #6a471f;transition:.4s}.gallery img:hover{transform:scale(1.02)}
.form{display:grid;gap:12px;text-align:left}.input,.textarea,.select{width:100%;background:#110405;color:#f6e8cf;border:1px solid #6b4721;border-radius:14px;padding:15px;font:inherit}.textarea{min-height:120px;resize:vertical}.form label{font-size:13px;color:#c9b49b}.nav{position:fixed;z-index:50;bottom:14px;left:50%;transform:translateX(-50%);width:min(680px,calc(100% - 24px));background:rgba(25,6,7,.92);border:1px solid #714b22;border-radius:24px;padding:8px;display:grid;grid-template-columns:repeat(5,1fr);backdrop-filter:blur(15px);box-shadow:0 15px 40px #000}.nav a{text-align:center;padding:8px 3px;color:#bda78c;font-size:10px}.nav i{display:block;color:#e2b75d;font-style:normal;font-size:20px;margin-bottom:4px}.music{position:fixed;z-index:60;right:20px;bottom:105px;width:54px;height:54px;border-radius:50%;background:#25090a;border:1px solid #d9a441;color:#e5b85c;display:grid;place-items:center;font-size:22px;cursor:pointer}.music.play{animation:spin 4s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.reveal{opacity:0;transform:translateY(35px);transition:opacity .8s ease,transform .8s ease}.reveal.show{opacity:1;transform:none}.fade-in{animation:fade .9s ease both}@keyframes fade{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:100;display:none;align-items:center;justify-content:center;padding:20px}.lightbox.show{display:flex}.lightbox img{max-width:95%;max-height:90%;border-radius:12px}.close{position:absolute;right:20px;top:20px;font-size:30px;color:#fff;cursor:pointer}
@media(max-width:520px){.hero{padding-left:18px;padding-right:18px}.title{font-size:clamp(53px,15vw,78px)}.heading{font-size:44px}.couple{grid-template-columns:1fr 1fr}.person h3{font-size:23px}.section{padding:75px 18px}.corner{width:105px}.nav{bottom:8px}.nav a{font-size:9px}.nav i{font-size:18px}}
